Miroirs/devdocs
1
0
Fork 0
mirror of https://github.com/freeCodeCamp/devdocs synced 2024-11-16 19:48:10 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix fetch issues with browser extension resources

Browse source
This commit is contained in:
Jasper van Merle 2019-08-15 03:17:18 +02:00
parent aec4633ded
commit 22f7bcf987
1 changed files with 37 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
views/service-worker.js.erb
View file

@ -11,6 +11,34 @@ const urlsToCache = [
'<%= doc_index_urls.join "',\n '" %>', '<%= doc_index_urls.join "',\n '" %>',
]; ];
<%# Clone a request with the mode set to 'cors' %>
function corsify(request) {
const options = {
mode: 'cors',
};
const keys = [
'body',
'cache',
'credentials',
'headers',
'integrity',
'keepalive',
'method',
'redirect',
'referrer',
'referrerPolicy',
'signal',
'window',
];
for (const key of keys) {
options[key] = request[key];
}
return new Request(request.url, options);
}
<%# Set-up the cache %> <%# Set-up the cache %>
self.addEventListener('install', event => { self.addEventListener('install', event => {
self.skipWaiting(); self.skipWaiting();
@ -36,9 +64,11 @@ self.addEventListener('fetch', event => {
if (cachedResponse) return cachedResponse; if (cachedResponse) return cachedResponse;
try { try {
const response = await fetch(event.request); const response = await fetch(corsify(event.request));
if (!response.ok) { <%# If the status code is 0 it means the response is opaque %>
<%# If the response is opaque it's not possible to read whether it is successful or not, so we assume it is %>
if (!response.ok && response.status !== 0) {
throw new Error(`The HTTP request failed with status code ${response.status}`); throw new Error(`The HTTP request failed with status code ${response.status}`);
} }
@ -46,11 +76,13 @@ self.addEventListener('fetch', event => {
} catch (err) { } catch (err) {
const url = new URL(event.request.url); const url = new URL(event.request.url);
<%# Attempt to return the index page from the cache if the user is visiting a url like devdocs.io/offline or devdocs.io/javascript/global_objects/array/find %>
<%# The index page will make sure the correct documentation or a proper offline page is shown %>
const pathname = url.pathname; const pathname = url.pathname;
const filename = pathname.substr(1 + pathname.lastIndexOf('/')).split(/\#|\?/g)[0]; const filename = pathname.substr(1 + pathname.lastIndexOf('/')).split(/\#|\?/g)[0];
if (url.origin === location.origin && !['.css', '.js', '.json', '.png', '.ico', '.svg', '.xml'].some(ext => filename.endsWith(ext))) { const extensions = ['.html', '.css', '.js', '.json', '.png', '.ico', '.svg', '.xml'];
<%# Attempt to return the index page from the cache if the user is visiting a url like devdocs.io/offline or devdocs.io/javascript/global_objects/array/find %>
<%# The index page will make sure the correct documentation or a proper offline page is shown %>
if (url.origin === location.origin && !extensions.some(ext => filename.endsWith(ext))) {
const cachedIndex = await caches.match('/'); const cachedIndex = await caches.match('/');
if (cachedIndex) return cachedIndex; if (cachedIndex) return cachedIndex;
} }