JavaScript --- 离线存储

231 阅读1分钟

1. cookie : 

         cookie是按域名存储的,同一域名下的所有cookie会在请求时作为请求头发送,所以在cookie中存储大量信息会影响请求性能,cookie信息量越大,请求的时间就越长,同时,由于任何人都可访问到cookie,因此,不能再cookie中存储重要敏感信息。

2.  globalStorage: --不是storge的实例, globalStorage[location.host] 才是

      特点:全局存储,但是在存储时,需要指明域名,(这保证了其他域名下无法访问到当前域名下的存储数据),如果事先不确定域名,可以用location.host代替, 并且,它具有类似 localstorage的特点,如果不手动删除,数据会始终留在磁盘上。

     使用方法: globalStorage[location.host].userName="1232"

                       globalStorage[location.host].getItem("userName")

                       globalStorage[location.host].removeItem("userName")

    ***适用于存储用户的偏好、客户文档

3.  sessionStorge:--storge的实例

      特点:页面关闭时清除,存储的数据为字符串类型

      存储数据类型: 

                             sessionStorage.userName = "111111"

                             sessionStorage. setItem('userName', '1122222')

                            ** delete**  sessionStorage.userName

                             sessionStorage. removeItem('userName')

                            sessionStorage.clear()

     注意:适用于存储小段数据,如果需要跨会话存储数据,建议使用globalStorage/localStorage

4. localStaorge : ---storage的实例

   在HTML5中,localStorage作为持久保存客户端数据取代了globalStorage,与globalStorage相比,优点在于,不需要指定域名,默认只能访问同域名、同协议下的存储数据。

   使用方法: 类似sessionStorage

5. indexedDB

   作用:在浏览器中保存结构化数据;使用对象保存数据,而不是用表来保存数据;

   特点:异步操作,可在onerror或onsuccess事件中处理回调逻辑;