hybrid app开发中用到的html5新特性localStorage、sessionStorage和websql database

最新推荐文章于 2022-03-25 16:36:58 发布

原创

最新推荐文章于 2022-03-25 16:36:58 发布 · 2.4k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#localStorage #websql #html本地缓存

在Hybrid App开发中，为了实现数据的持久化存储，通常会利用HTML5的本地存储特性，如localStorage、sessionStorage和websql database。localStorage用于长期存储数据，而sessionStorage数据仅在会话期间有效。两者都遵循跨域限制，且易于使用。相比之下，websql提供了一个类似关系数据库的存储方式，允许通过SQL语句进行数据操作，为复杂数据管理提供便利。

最近在项目中进行hybrid app开发，项目中有大量的js代码运行在android设备上。使用到了很多HTML5的新特性，之前没有遇到过，不了解，这里记录下增加点前端的知识。混合式app开发中，经常需要使用缓存功能，比如你在页面表单控件上输入了数据，你希望下次退出app再次进来的时候还能看到这些数据；比如你的项目中有保存草稿的功能，只是先将数据临时存储在本地，以后再提及到服务器。这就需要我们将数据持久地存储在本地，这就需要用到HTML5中的本地化存储解决方案。本文主要介绍下sessionStorage、localStorage和websql database这3种存储方案。

sessionStorage和localStorage这2种方案，api的使用方式一模一样，非常简单，具体的使用可以参考"HTML5 LocalStorage本地存储"这篇文章。sessionStorage和localStorage的区别如下：

html5中的Web Storage包括了两种存储方式：sessionStorage和localStorage。
sessionStorage用于本地存储一个会话（session）中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。
因此sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。当浏览器窗口关闭时，sessionStorage中的数据就会被清除。
而l