服务工作者 - chrome mobile,仅在隐身模式下工作

时间:2016-10-06 14:43:10

标签: javascript google-chrome service-worker

我正在尝试使用服务工作者使我的网站脱机工作。 我的sw.js:

var cacheName = 'v40aswedsdfsadg';
var url = "https://spreadsheets.google.com/feeds/list/1LEGGLbrp3hqsN_CyZQMpmrUs5QTajjgjXyCgfwwIDQk/1/public/values?alt=json";
var cacheFiles = [
    './',
    './index.html',
    './js/app.js',
    './css/app.css',
    './vendor/jQuery/dist/jquery.min.js',
    './vendor/angular/angular.min.js',
    './vendor/lodash/dist/lodash.min.js',
    './vendor/gs2json.js',
    url
];

self.addEventListener('install',function(e){
    console.log('[SW] install');
    e.waitUntil(
        caches.open(cacheName).then(function(cache){
            console.log('[SW] add cache');
            return cache.addAll(cacheFiles);
        })
    );
});
self.addEventListener('activate',function(e){
    console.log('[SW] activate');
    e.waitUntil(
        caches.keys().then(function(cacheNames){
            return Promise.all(
                cacheNames.map(function(thisCacheName){
                    if(thisCacheName!==cacheName){
                        console.log('[SW] delete cache: '+thisCacheName+'->'+cacheName);
                        return caches.delete(thisCacheName);
                    }
                }));
        })
    );
});
self.addEventListener('fetch', function(event) {
    console.log('[SW] fetch: '+event.request.url);
    event.respondWith(
        caches.match(event.request)
            .then(function(response) {
                // Cache hit - return response
                if (response) {
                    console.log('[SW] Loaded "'+response.url+'" from cache');
                    return response;
                }
                var fetchRequest = event.request.clone();

                return fetch(fetchRequest).then(
                    function(response) {
                        console.log('[SW] fetch: '+response.url);

                        if(!response || response.status !== 200) {
                            console.log('[SW] fetch failed: ',!response, response.status!==200);
                            alert('fail');
                            return response;
                        }

                        var responseToCache = response.clone();

                        caches.open(cacheName)
                            .then(function(cache) {
                                console.log('[SW] put response to cache');
                                cache.put(event.request, responseToCache);
                            });
                        return response;
                    }
                );
            })
    );
});

使用chrome时效果很好。

它不适用于chrome mobile:   - 我没有脱机错误(这意味着服务工作者工作)   - 来自https的数据将不会加载   - 第一次加载工作正常(从url获取数据时)   - 秒和任何下一个加载不起作用(空白页=没有加载数据)

在隐身模式下(从缓存中获取数据)可以在移动设备上运行。

任何可以帮我解决这个问题的人?

编辑: 刚刚在移动版Firefox上测试它,它也可以工作。这似乎是移动铬的问题..

0 个答案:

没有答案