PreloadJS和服务工作人员

我想用PreloadJS使用服务人员。我缓存了所需的图像，然后使用caches.match()函数加载它们。PreloadJS和服务工作人员

当我尝试用jQuery它工作正常加载图像，但装载有preloadJS它提供了以下错误

的FetchEvent为“someurl”导致网络错误响应：“不透明”响应用于请求的类型不是非Cors

虽然如果我加载任何其他图像没有缓存，PreloadJS正确加载该图像。只有当我使用caches.match时，问题才会发生。

这可能是什么原因？

使用jquery

加载图像使用preloadjs

var preload = new createjs.LoadQueue({ crossOrigin: "Anonymous" }); 

function loadImageUsingPreload() { 

    preload.on('complete', completed); 

    preload.loadFile({ id: 'someid', src: 'someurl', crossOrigin: true }) 

}; 

function completed() { 
    var image = preload.getResult("shd"); 
    document.body.append(image); 
};

加载图像

function loadImageUsingJquery() { 
    jQuery("#image").attr('src', 'someurl'); 
};

服务人员取事件

self.addEventListener('fetch', function(event) { 
    event.respondWith(
    caches.match(event.request).then(function(response) { 

     if (!response) { 
     console.log('fetching...' + event.request.url); 
     return fetch(event.request); 
     }; 
     console.log("response", response); 
     return response; 
    })); 
});

响应对象当我加载使用PreloadJS或jQuery的：

响应{类型： “不透明”，网址： “”，重定向：假，状态：0，OK：假的，...}

来源

2017-08-28 formatkaka

你检查了这个问题吗？ https://stackoverflow.com/questions/35626269/how-to-use-service-worker-to-cache-cross-domain-resources-if-the-response-is-404 –

发现了错误，在cache.put我

其实如果来源不相同，则将请求对象的模式修改为'no-cors'。

现在，在提取事件期间，事件的请求对象具有属性'cors'，因为它是一个跨源请求。

这个mode的值的差异导致了获取错误。

服务人员安装事件：

var request = new Request(value); 
var url = new URL(request.url); 

if (url.origin != location.origin) { 
    request = new Request(value, { mode: 'no-cors' }); 
} 

return fetch(request).then(function(response) { 
    var cachedCopy = response.clone(); 
    return cache.put(request, cachedCopy); 
});

我把它改为：

var request = new Request(value); 
var url = new URL(request.url); 

return fetch(request).then(function(response) { 
    var cachedCopy = response.clone(); 
    return cache.put(request, cachedCopy); 
});

我必须使用保存CDN的第一种方法，因为第二种方法是不适合他们，反之亦然工作为我的图像托管在云端。

我会发现原因，当我找到为什么发生这种情况。

来源

2017-09-02 12:57:11 formatkaka

PreloadJS和服务工作人员

回答

相关问题