sw.js
3.17 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
/* eslint-env worker */
/* global FetchEvent */
self.workbox.skipWaiting();
self.workbox.clientsClaim();
const isDev = self.location.search.indexOf('dev') >= 0;
const staticDomian = isDev ? /^http:\/\/localhost:5001/i : /^https:\/\/(.*)cdn\.yoho\.cn/i;
const webDomian = isDev ? /^http:\/\/localhost:6001/i : /^https:\/\/m.yohobuy.com/;
const precaches = [
{
url: '/offline.html',
rivision: 'offline-rivision-0.0.1'
},
{
url: '//cdn.yoho.cn/pwa/404.png',
rivision: '404-rivision-0.0.1'
}].concat(self.__precacheManifest || []);
self.workbox.precaching.precacheAndRoute(precaches);
/**
* 需要缓存的路径
*/
const CACHED_PATH = [
'boys',
'girls',
'kids',
'lifestyle',
'cate',
'list',
'search',
'product',
'shop',
'guang',
'offline.html'
];
// 自定义缓存
self.workbox.routing.registerRoute(args => {
if (/sockjs-node\/info/.test(args.url.href)) {
return false;
}
if (self.__precacheManifest.find(precahce => args.url.href.indexOf(precahce.url) >= 0)) {
return false;
}
if (staticDomian.test(args.url.href)) {
return true;
}
return false;
}, self.workbox.strategies.staleWhileRevalidate({
cacheName: 'statics',
plugins: [
new self.workbox.expiration.Plugin({
maxEntries: 1000,
maxAgeSeconds: 7 * 24 * 60 * 60 // 7 day
})
]
}));
// 所有网络走 worker,异常时增加离线页面
self.workbox.routing.registerRoute(args => {
let routeRegExp = new RegExp(`^\/(${CACHED_PATH.join('|')})`);
if (webDomian.test(args.url.href) &&
(routeRegExp.test(args.url.pathname) ||
args.url.pathname === '/')) {
return true;
}
if (args.event.request.headers.get('x-requested-with') === 'XMLHttpRequest') {
return false;
}
return false;
}, args => {
return self.workbox.strategies.networkFirst({
cacheName: 'page',
plugins: [
new self.workbox.expiration.Plugin({
maxEntries: 300,
maxAgeSeconds: 12 * 60 * 60 // 7 day
})
]
}).handle(args).then(res => {
if (res || args.event.request.mode !== 'navigate') {
return res;
}
// navigate 请求失败后,返回网络异常页面
return caches.match('offline.html');
});
});
/**
* webp 处理
* 匹配非 webp 的 cdn 图片资源,缓存其 webp 格式
*/
self.workbox.routing.registerRoute(args => {
let useWebp = false;
let supportWebp = /image\/webp/i.test(args.event.request.headers.get('Accept'));
if (!supportWebp) {
return useWebp;
}
if (/^https?:\/\/(.*)static\.yhbimg\.com(.*)(png|jpg|jpeg)\?(imageView|imageMogr)(.*)/.test(args.url.href) &&
/^(?!.*format\/).*/.test(args.url.href)) {
useWebp = true;
}
return useWebp;
}, args => {
// 重新构造 fetch 请求
args.event = new FetchEvent(args.event.type, {
request: new Request(args.event.request.url + '/format/webp'),
clientId: args.event.clientId,
isReload: args.event.isReload
});
return self.workbox.strategies.networkOnly().handle(args);
});