Chrome.storage和HTML5中localStorage的差异
Chrome为扩展应用提供了存储API,以便将扩展中需要保存的数据写入本地磁盘。Chrome提供的存储API可以说是对localStorage的改进,它与localStorage相比有以下区别:
· 如果储存区域指定为sync,数据可以自动同步;
· content_scripts可以直接读取数据,而不必通过background页面;
· 在隐身模式下仍然可以读出之前存储的数据;
· 读写速度更快;
· 用户数据可以以对象的类型保存。
对于第二点要进一步说明一下。首先localStorage是基于域名的,这在前面的小节中已经提到过了。而content_scripts是注入到用户当前浏览页面中的,如果content_scripts直接读取localStorage,所读取到的数据是用户当前浏览页面所在域中的。所以通常的解决办法是content_scripts通过runtime.sendMessage和background通信,由background读写扩展所在域(通常是chrome-extension://extension-id/)的localStorage,然后再传递给content_scripts。
http://blog.csdn.net/talking12391239/article/details/41114693
分享到:
相关推荐
在浏览器兼容性方面,HTML5 LocalStorage从IE8开始就被广泛支持,其他现代浏览器如Firefox、Chrome、Safari和Opera也均提供兼容性。但在本地文件环境中,如直接打开HTML文件,某些浏览器(如IE和Firefox)可能需要...
这个事件在不同浏览器中的处理机制可能略有差异,例如,IE 11在当前页面进行`localStorage`操作时会触发事件,而Chrome则不会。 在实际应用中,我们可以将JSON对象存储在`localStorage`中。首先使用`JSON.stringify...
5. **Web Storage**:包括`localStorage`和`sessionStorage`,提供了比传统Cookie更强大的数据存储能力。 6. **Web Workers**:支持后台多线程处理,提高复杂计算的性能,而不阻塞用户界面。 7. **WebSockets**:...
开发者需要了解每个平台的Webview特性,比如Safari和Chrome的差异,以及如何使用PhoneGap、Cordova或React Native等框架将HTML5应用打包成原生应用,实现更好的性能和兼容性。 6. 开发工具与调试: 开发HTML5移动...
3. **Web Storage**:HTML5提供了本地存储能力,可以通过`localStorage`和`sessionStorage`对象来实现数据的长期或临时存储,从而减少服务器负担并提升用户体验。 4. **Canvas**:这是一个用于绘制图形的强大工具,...
3. **Web存储(Web Storage)**:使用localStorage和sessionStorage来持久化数据。 4. **浏览器事件和消息传递**:了解如何使用`chrome.runtime.onMessage`和`chrome.tabs.sendMessage`进行扩展内部和跨标签页通信...
4. **离线存储(Web Storage)**:HTML5的localStorage和sessionStorage提供了本地存储机制,使得网页可以离线工作,用户在无网络连接时也能访问之前加载的数据。 5. **Web Workers和WebSockets**:Web Workers为...
- **Web Storage**包括localStorage和sessionStorage,用于客户端存储数据。 - **离线应用**通过AppCache机制使Web应用能够在离线状态下运行。 5. **高级Web API**: - **XMLHttpRequest**用于实现异步请求,是...
此外,Web Storage(包括localStorage和sessionStorage)和Web Workers提供了本地数据存储和后台处理能力,提升了网页应用的性能。 CSS3则是层叠样式表的第三次重大更新,它带来了许多新的选择器、模块和效果。例如...
- **Web Storage**:包括`localStorage`和`sessionStorage`,可用于持久化存储少量数据。 - **离线应用**:通过`Application Cache`(AppCache)机制,可以缓存整个Web应用,使其即使在网络连接中断时也能正常运行。...
HTML5的文件离线存储是通过Web Storage技术实现的,其中包括sessionStorage和localStorage,它允许网页存储键值对数据,以支持在本地存储数据,工作原理类似cookie,但容量更大,且不会随HTTP请求发送。 关于浏览器...
* Web Storage 是指 HTML5 中的本地存储机制,包括 sessionStorage 和 localStorage。 浏览器本地存储 在浏览器本地存储方面,候选人需要了解 sessionStorage 和 localStorage 的区别。 * sessionStorage 是指...
Chrome Frame 会把最新版的Chrome Webkit 内核和JavaScript 引擎注入到IE中, IE浏览器将获得Chrome的性能和功能 目录 摘要 I ABSTRACT II 专业名词清单 III 第一章 绪论 1 1.1 研究背景与意义 1 1.2国内外相关...
1. HTML基础:面试可能会涉及到HTML5的新特性,比如离线存储、Web Storage(localStorage和sessionStorage)、Canvas、SVG、WebSocket等。此外,还会问到语义化标签的使用,如、、等。 2. CSS布局:面试中可能涉及...
9. Web API和Web存储:理解浏览器提供的Web API,如WebSocket用于实时通信,以及Web Storage(localStorage和sessionStorage)用于在客户端存储数据。 10. 性能优化:学习如何优化网页加载速度,包括压缩资源、减少...
34. Vue中computed和watch的差异: - computed是基于它们的依赖进行缓存的。 - watch用于观察和响应Vue实例上的数据变动。 35. PWA的简述: - Progressive Web App是一种渐进式的网络应用,可以提供类似原生应用...
现代浏览器如Chrome, Firefox, Safari和Edge对HTML5和CSS3提供了较好的支持,但老旧版本的浏览器或者不同的浏览器之间依然存在差异。因此,需要一些工具或方法来检测特定浏览器对于HTML5和CSS3特性是否支持。 ...
22. **Web Storage**:理解localStorage和sessionStorage的用途,以及它们与cookie的区别。 23. **AJAX与RESTful API**:掌握如何与RESTful API进行交互,实现前后端分离的开发模式。 24. **Promise.all与Promise....
HTML5的Web Storage(localStorage和sessionStorage)或者IndexedDB可以用于本地数据管理,而Service Worker技术则可以实现离线缓存。 8. **性能优化**:MUI框架自身已经做了很多性能优化,如图片懒加载、资源预...