首先打开调试面板「windows:F12;mac:command+option+i」,找到Application选项卡。
如下两区域与pwa相关,也就是渐进式web应用程序。
使用前端数据库如websql或IndexDB,可以在如下选项中查看。
数据库详情要到Storage中查看:
Storage中最常用的是Session storage和Local storage:
Session storage和Local storage的区别
数据生命周期:
- LocalStorage: 存储在LocalStorage中的数据没有过期时间,除非被显式删除或者浏览器缓存被清除,否则数据将一直存在。
- SessionStorage: 存储在SessionStorage中的数据在当前会话(即当前标签页或者窗口)关闭后会被自动删除,它的生命周期仅限于当前会话。
数据作用域:
- LocalStorage: 存储在LocalStorage中的数据在同源(相同协议、主机和端口)的所有页面中都是共享的。也就是说,无论是从同一个页面还是不同页面,只要是同源的页面都可以访问到相同的LocalStorage数据。
- SessionStorage: 存储在SessionStorage中的数据仅在同一个窗口或标签页中共享,如果是在不同的窗口或标签页打开同一个网站,它们之间的SessionStorage数据是相互隔离的。
总结
如果希望存储的数据具有持久性,并且在不同窗口之间共享,使用LocalStorage;
如果希望存储的数据仅在当前会话中有效,并且不需要在不同窗口之间共享,可以使用SessionStorage。