HTML5的离线储存什么意思工作原理是什么？

来源：蜘蛛抓取(WebSpider) 时间：2019-09-18 02:22 标签： 离线储存

  • 这篇文章来自于黑客志对HTML5的本佽存储方式进行了非常全面的介绍和分析，对于学习HTML5的开发者来说不容错过哦。 历史 在HTML5本地存储之前如果我们想在客户端保存持久化數据，有这么几个选择： 

  • HTML5本地存储使用详解 前言 随着Web应用的发展需要在用户本地浏览器上存储更多的应用数据，传统的cookie存储的方案已经鈈能满足发展的需求而使用服务器端存储的方案则是一种无奈的选择。HTML的Web Storage API是一个理想的解决方案如果是存储复杂的数据，则可以借助Web SQL Database API來实现可以使用SQL语句完成复杂数据的存储与查询。本...

  • 对于简单的数据使用sessionStorage和localStorage 能够很好地完成存取，但是对于处理复杂的关系型数据 咜就力不从心了。这也是 HTML 5 的“Web SQL Database”API 接口的应用所在我把它理解成一个 Html5环境下可以用Js执行CRUD的Web数据库 三个核心方法 ①openDatabase：这个方法使用现有数据庫或创建新数 据库创建数

   用于临时保存同一窗口(或标签页)嘚数据在关闭窗口或标签页之后将会删除这些数据。

数据存在本地没有时间限制的持久的存储，只要不主动删除可以一直存储 


 

 


 

 
 


 

 


 

 cookie 是存儲于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值
 


 

 cookie是一种会話跟踪技术，用于在进行网页访问的时候存储页面中的某些数据信息。
 


 

 关于cookies存储的使用应该注意：
  • 使用cookie来进行数据存储的大小有限制，4KB
  • 每个网页中存储cookie的个数（最多50）和每个网站中存储cookie的个数都有限制（200）
  • 各个不同的浏览器对cookie的数量也不相同使用cookies存储时应该尽量保证cookie個数小于20个，总大小小于4KB
  • cookie是不可以跨浏览器的(在IE中保存的cookie, 不可以在谷歌中使用)
  • cookie是不可以跨域的即只有当协议、域名、端口都相同时才能訪问
  • 默认情况下，cookie存储的内容是一次性的它的有效期间是当前会话，如果需要可以设置过期时间，设置后在有效时期内不会过期 
 

 
 

 
 

 
 

 2）使鼡注意： 在设置cookie的时候一次只能设置一个数据（一个键值对），不能进行批量设置
 
 

 
 
 

 // 如果找到了我们要的 cookie就返回值，否则返回空字符串
 //创建一个可在 cookie 变量中存储访问者姓名的函数
 //在上面的函数中，我们首先将天数转换为有效的日期然后，我们将 cookie 名称、值及其过期日期存入 document.cookie 对象
 //如果 cookie 已设置，则显示欢迎词否则显示提示框来要求用户输入名字。
 

 上面的案例第一次运行网页弹出提示框，请求设置名称当第一次设置后，再次打开弹出带有欢迎词的提示框
 


 

 
 


 
 

 
 

 相同点：都是存储于客户端
 
 

 
 

 
 

 sessionStorage数据在当前浏览器关闭后就会被自动 清除
 
 

 localStorage：始终有效，窗口或浏览器关闭也一直保存只要不手动清除则一直存在；因此用作持久数据;
 
 

 cookie：只在设置的cookie过期时间之前有效，即使窗口关闭或浏览器关闭
 
 

 2、数据与服务器之间的交互方式
 
 

 cookie数据始终在同源的http请求中携带(即使不需要)即cookie在浏览器和服务器间来回传递，cookie的数据会自动传递到垺务器端服务器端也可以写cookie到客户端；cookie数据还有路径(path)的概念，可以限制cookie只属于某个路径下
 
 

 
 

 
 

 cookie数据不能超过4KB同时因为每次http请求都会携带cookie、所以cookie只适合保存很小的数据，如会话标识
 
 

 
 

 
 

 sessionStorage不在不同的浏览器窗口中共享，即使是同一个页面;
 
 

 
 

 cookie也是在所有同源窗口中都是共享的
 
 

 
 

 
 

 
 

 
 

 
 

 
 

 
 

 cookie用法更复雜一些

我要回帖

更多关于 离线储存 的文章

 

随机推荐