MP4文件将无法与服务人员一起播放

时间:2018-08-04 14:30:16

标签: caching service-worker progressive-web-apps offline-caching

我已经开始与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.');
        })
    );
});

0 个答案:

没有答案