Abruf der CORS-Anfrage in Service Worker

Question

Ich mache etwas Entwicklung über Service Worker. Unser Vorschlag ist sehr einfach, loggen Sie einfach jede Anfrage aus unserer app.js. Ich folge dem Leitfaden von der Google-Website. Ich brauche nur einen Listener für 'Holen' Ereignis.

Meine App und API sind in den verschiedenen Hosts.

Mein Service Worker-Code ist wie:

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; 
    }()); 
}); 

Mein app.js ist sehr einfach jetzt:

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

Diese Version Code funktioniert gut, bis ich die URL auf einen anderen Server zu ändern (nicht GitHub eins).

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)); 

Diese neue Server-URL unterstützt CORS bereits. Aber wenn ich Anforderung im Service Worker-Code abrufen, ist der Fehler passiert.

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 

Wenn ich den Service Worker-Code zu entfernen, rufen API holen direkt, es funktioniert gut. Ich kann das Ergebnis auf meinen Server holen. Der einzige Unterschied zwischen zwei Versionen ist der Server. Ich denke, es hat etwas mit CORS zu tun. Die Github API handhabt CORS sehr gut, aber wir tun es nicht.

Wie fetch API im Service Worker zu verwenden, damit es funktioniert wie in der normalen javascript?

Ich verstehe nicht, warum der Code im Javascript-Thread gut funktioniert, aber nicht im Service Worker arbeiten kann.

Ich versuche, den Standard-Abrufmodus auf "Nein" zu ändern, es funktioniert nicht.

Answer 1

Ergebnis finden. Mein Server ist ein selbstsignierter https-Server. Service Worker kann CORS nicht auf den selbstsignierten HTTPS-Server zugreifen.