在服务工作者提取CORS请求失败

问题描述：

我正在做一些关于服务工作者的发展。我们的建议非常简单，只需记录来自我们app.js的每个请求即可。我遵循Google网站的指南。我只需要一个侦听器来获取'fetch'事件。在服务工作者提取CORS请求失败

我的应用程序和API位于不同的主机中。

我的服务人员的代码是这样的：

self.addEventListener('fetch', (event) => { 
    console.log(event.request); 
    event.respondWith(async function() { 
    const response = await fetch(event.requet); 
    // we will do something here. 
    return response; 
    }()); 
});

我app.js现在很简单：

const url = 'https://api.github.com/users/CrisLi' 
    fetch(url) 
    .then((response) => response.json()) 
    .then((json) => console.log(json)) 
    .catch((error) => console.log(error));

这个版本的代码工作得很好，直到我改变请求URL到另一台服务器（不GitHub之一）。

const url = 'https://172.16.50.91:8080/BNfSZIiGMs37unHZXtnSFv5?access_token=WUMzMgAAAV63ciKxAACowFVEVXNvNEhudXVzS3FidXBsNTVSeGE1IAAAAANUODNfd0VWcXBMVTJsSWVWakJVWTBNNVpqbGlPR1V5Wmpr' 
    fetch(url) 
    .then((response) => response.json()) 
    .then((json) => console.log(json)) 
    .catch((error) => console.log(error));

这个新的服务器URL已经支持CORS了。但是如果我在Service Worker代码中获取请求，则会发生错误。

The FetchEvent for "https://172.16.50.91:8080/BNfSZIiGMs37unHZXtnSFv5?access_token=WUMzMgAAAV63ciKxAACowFVEVXNvNEhudXVzS3FidXBsNTVSeGE1IAAAAANUODNfd0VWcXBMVTJsSWVWakJVWTBNNVpqbGlPR1V5Wmpr" resulted in a network error response: the promise was rejected. 
Promise rejected (async) 
self.addEventListener @ service-worker.js:62 
Uncaught (in promise) TypeError: Failed to fetch 
(index):25 GET https://172.16.50.91:8080/BNfSZIiGMs37unHZXtnSFv5?access_token=WUMzMgAAAV63ciKxAACowFVEVXNvNEhudXVzS3FidXBsNTVSeGE1IAAAAANUODNfd0VWcXBMVTJsSWVWakJVWTBNNVpqbGlPR1V5Wmpr net::ERR_FAILED 
TypeError: Failed to fetch

如果删除了服务人员的代码，直接调用API获取，它工作正常。我可以将结果提取到我的服务器。 2版本代码之间的唯一区别是服务器。我认为这与CORS有关。 Github API非常好地处理CORS，但我们没有。

如何在Service Worker中使用fetch API使其像在普通的javascript中一样工作？

我不明白为什么javascript线程中的代码工作正常，但无法在服务工作器中工作。

我尝试将默认获取请求模式更改为'no-cors'，但它不起作用。

答

查找结果。我的服务器是一个自签名的https服务器。服务工作者无法CORS访问自签名的https服务器。

在服务工作者提取CORS请求失败

相关推荐