gpt4 book ai didi

javascript - 努力理解为什么我的服务人员不工作 - 未捕获( promise )TypeError : Request failed

转载 作者:行者123 更新时间:2023-12-02 22:48:21 25 4
gpt4 key购买 nike

我一直按照 https://www.pwabuilder.com 上的说明进行操作使我的网站可以离线使用。在控制台日志中,我收到消息,表明 PWA 已安装,并且已离线缓存,但我在标题中收到错误。

我去过很多 stackoverflow 线程和其他网站,但我所做的一切都不起作用。这不是我的强项,我是一名 UX/UI 设计师,可以编写简单的静态页面,但这略高于我目前的技能水平。

我真的很难弄清楚如何解决这个问题,因为(对我来说)这个错误非常模糊。我假设它是我错过的一些简单的东西。网站网址为https://ovoc.netlify.com/但我还将在下面链接 list 和 Service Worker

list .json

{
"dir": "ltr",
"lang": "en",
"name": "Our voice our community | Get involved in de…",
"scope": "/",
"display": "fullscreen",
"start_url": "https://ovoc.netlify.com/",
"short_name": "OVOC",
"theme_color": "transparent",
"description": "Our voice our community is a project run by BGC Wales to empower young people to engage in community decision making",
"orientation": "any",
"background_color": "transparent",
"related_applications": [],
"prefer_related_applications": false,
"icons": [{
"src": "assets/icons/logo.png",
"sizes": "192x192",
"type": "image/png"
}]
}

这是服务 worker

// This is the "Offline copy of pages" service worker

const CACHE = "pwabuilder-offline";

// TODO: replace the following with the correct offline fallback page i.e.: const offlineFallbackPage = "index.html";
const offlineFallbackPage = "index.html";

// Install stage sets up the index page (home page) in the cache and opens a new cache
self.addEventListener("install", function (event) {
console.log("[PWA Builder] Install Event processing");

event.waitUntil(
caches.open(CACHE).then(function (cache) {
console.log("[PWA Builder] Cached offline page during install");

if (offlineFallbackPage === "index.html") {
return cache.add(new Response("TODO: Update the value of the offlineFallbackPage constant in the serviceworker."));
}

return cache.add(offlineFallbackPage);
})
);
});

// If any fetch fails, it will look for the request in the cache and serve it from there first
self.addEventListener("fetch", function (event) {
if (event.request.method !== "GET") return;

event.respondWith(
fetch(event.request)
.then(function (response) {
console.log("[PWA Builder] add page to offline cache: " + response.url);

// If request was success, add or update it in the cache
event.waitUntil(updateCache(event.request, response.clone()));

return response;
})
.catch(function (error) {
console.log("[PWA Builder] Network request Failed. Serving content from cache: " + error);
return fromCache(event.request);
})
);
});

function fromCache(request) {
// Check to see if you have it in the cache
// Return response
// If not in the cache, then return error page
return caches.open(CACHE).then(function (cache) {
return cache.match(request).then(function (matching) {
if (!matching || matching.status === 404) {
return Promise.reject("no-match");
}

return matching;
});
});
}

function updateCache(request, response) {
return caches.open(CACHE).then(function (cache) {
return cache.put(request, response);
});
}

我真的很挣扎,我的客户是一个慈善机构,所以我真的很想让这对他们有用,任何帮助将不胜感激!

最佳答案

如果您访问https://ovoc.netlify.com/ ,您应该在 Chrome DevTools 的网络面板中看到以下内容:

network panel screenshott

这表明软件正在请求 URL https://ovoc.netlify.com/[object%20Response] ,它返回 404 响应。

它还告诉您该请求源自 pwabuilder-sw.js:17 ,即 Service Worker 脚本的第 17 行。

该行对应于:

return cache.add(new Response("TODO: Update the value of the offlineFallbackPage constant in the serviceworker."));

这似乎是您需要更新的一些占位符代码,以放入离线页面的实际 URL。

此外,您的<head>的标签包括许多undefined网址:

enter image description here

看起来这些是由 ManUp.js 生成的,因此您应该确保正确配置。

关于javascript - 努力理解为什么我的服务人员不工作 - 未捕获( promise )TypeError : Request failed,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58288247/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com