HTML5-离线存储，Web Worker

最新推荐文章于 2024-11-16 10:29:03 发布

小菜菜arron

最新推荐文章于 2024-11-16 10:29:03 发布

阅读量566

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/qq_27985659/article/details/53149781

本文详细介绍了HTML5中的离线存储技术及其实现方式，并对Web Worker的工作原理及其使用方法进行了深入探讨。此外，还提到了一些H5的其他小功能，如语言输入和桌面提醒。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.离线存储
搭建离线应用程序
①服务器设置头信息 :
AddType text/cache-manifest .manifest
② html标签加 :
manifest=“xxxxx.manifest”
③写manifest文件 : 离线的清单列表
先写 : CACHE MANIFEST 然后写需要缓存的内容
FALLBACK : 第一个网络地址没获取到，就走第二个缓存的（很少用）
NETWORK ：无论缓存中存在与否，均从网络获取（很少用）

2.Web Worker

JS的单线程（放入UI队列的个数，利用定时器解决）
可以让web应用程序具备后台处理能力，对多线程的支持非常好。
用法：
new Worker(‘后台处理的JS地址’)
利用postMessage传输数据
importScripts(‘导入其他JS文件’)
Worker运行环境（支持的对象）
navgator : appName、appVersion、userAgent、platform
location : 所有属性都是只读的
self : 指向全局 worker 对象
所有的ECMA对象，Object、Array、Date等
XMLHttpRequest构造器
setTimeout和setInterval方法
close()方法，立刻停止worker运行
importScripts方法

3.H5其他小功能
语言输入

桌面提醒

window.webkitNotifications.requestPermission();
statue = window.webkitNotifications.checkPermission();
var notification =window.webkitNotifications.createNotification("[imgurl]","Title","Body");
notification.show();