PJCHENder 未整理筆記

[PWA] Advanced Cache

2018-03-13

[PWA] Advanced Cache

@(JavaScript)[WebAPIs, PWA, Progressive Web Apps - The Complete Guide]

keywords: cache, web stroage, waitUntil(), fetch, fetchEvent.respondWith()

目錄

[TOC]

Offering Cache on Demand

當使用者按下「儲存」、「離線閱讀」等行為時,才將該 request 存到 cache 中:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// src/js/feed.js

myButton.addEventListener('click', onSaveButtonClicked)

function onSaveButtonClicked () {
// 檢查
if ('caches' in window) {
caches.open('user-request')
.then(cache => {
cache.addAll([
'/src/images/sf-boat.jpg',
'https://httpbin.org/get'
])
})
}
}

掃描二維條碼,分享此文章