Skip to content

Commit 06ebcd1

Browse files
committed
docs: add service worker
1 parent fd073ca commit 06ebcd1

File tree

1 file changed

+26
-0
lines changed

1 file changed

+26
-0
lines changed

docs/service-worker.md

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
# Service Worker
2+
3+
Service Worker 是一个后台运行的脚本,充当一个代理服务器,拦截用户发出的网络请求,比如加载脚本和图片。Service Worker 可以修改用户的请求,或者直接向用户发出回应,不用联系服务器,这使得用户可以在离线情况下使用网络应用。它还可以在本地缓存资源文件,直接从缓存加载文件,因此可以加快访问速度。
4+
5+
为了节省内存,Service worker 在不使用的时候是休眠的。它也不会保存数据,所以重新启动的时候,为了拿到数据,最好把数据放在 IndexedDb 里面。
6+
7+
Service Worker 是事件驱动的。
8+
9+
下面是拦截请求的例子。
10+
11+
```javascript
12+
self.addEventListener('fetch', (event) => {
13+
event.waitUntil(
14+
if (event.request.url.includes('/product') {
15+
let productId = event.data.productId
16+
let productCount = getProductData(productId)
17+
indexedDB.open('store', 1, (db) => {
18+
let productStore = db.createObjectStore('products', { keyPath: 'id' })
19+
productStore.put({ id: productId, count: ++productCount })
20+
})
21+
})
22+
)
23+
})
24+
```
25+
26+
Service Worker 不能直接操作 DOM。

0 commit comments

Comments
 (0)