我已经开始与Service Worker一起播放,实际上它们都按我的预期工作,但问题是因为无法播放mp4文件。 我试图以某种方式禁用对mp4文件的缓存,但未成功。 MP4或视频文件存储在其他服务器上,不应缓存。 实际上,通过这种方式,服务工作者仅将我需要保护的所有文件缓存到SW中以获取视频文件或mp4。
"use strict";
var version = 'v1.102::';
var offlineFundamentals = [
'/static_files/css/main.css',
'/static_files/js/mobile.js',
'/static_files/player/jwplayer.js',
'/static_files/player/player_mobile.css'
];
var offlinePage = '';
self.addEventListener("install", function (event) {
console.log('WORKER: install event in progress.');
event.waitUntil(
caches
.open(version + 'fundamentals')
.then(function (cache) {
return cache.addAll(offlineFundamentals);
})
.then(function () {
console.log('WORKER: install completed');
})
);
});
self.addEventListener("fetch", function (event) {
console.log('WORKER: fetch event in progress.');
if (event.request.method !== 'GET') {
console.log('WORKER: fetch event ignored.', event.request.method, event.request.url);
return;
}
event.respondWith(
caches
.match(event.request)
.then(function (cached) {
var networked = fetch(event.request)
.then(fetchedFromNetwork, unableToResolve)
.catch(unableToResolve);
console.log('WORKER: fetch event', cached ? '(cached)' : '(network)', event.request.url);
return cached || networked;
function fetchedFromNetwork(response) {
var cacheCopy = response.clone();
console.log('WORKER: fetch response from network.', event.request.url);
caches
.open(version + 'pages')
.then(function add(cache) {
return cache.put(event.request, cacheCopy);
})
.then(function () {
console.log('WORKER: fetch response stored in cache.', event.request.url);
});
return response;
}
function unableToResolve() {
console.log('WORKER: fetch request failed in both cache and network.');
return new Response(offlinePage, {
status: 503,
statusText: 'Service Unavailable',
headers: new Headers({
'Content-Type': 'text/html'
})
});
}
})
);
});
self.addEventListener("activate", function (event) {
console.log('WORKER: activate event in progress.');
event.waitUntil(
caches
.keys()
.then(function (keys) {
return Promise.all(
keys
.filter(function (key) {
return !key.startsWith(version);
})
.map(function (key) {
return caches.delete(key);
})
);
})
.then(function () {
console.log('WORKER: activate completed.');
})
);
});