我幾乎完全設置為具有應用程序shell體系結構的pwa，使用像前端(但使用mithril作為渲染引擎)的反應，并使用express node.js后端和ssr，但努力在最后一個問題上過去。Workbox.js registerNavigationRoute找不到/加載html文件

更新：我們也快速使用緩存和作為我們的cdn。它在開發中都是禁用的，但是也許有些標題是偷偷摸摸的，并與事情搞砸了？

我正在使用registerNavigationRoute注冊我的html文件，該文件也通過預緩存和工作箱構建緩存。我的服務人員注冊罰款第一負載或硬刷新的時候，但是當我嘗試做一個常規刷新我收到此錯誤信息

The FetchEvent for "http://localhost:8000/article/35474-a-fear-of-heights-

doesn-t-stop-this-dad-from-seeing-a-thrilling-view" resulted in a network

error response: an object that was not a Response was passed to

respondWith().

Promise resolved (async)

self.addEventListener @ router.js:140

和對周圍線router.js的140文件我看到這則消息

message: 'The router is managing a route with a response.',

所以我想我的節點路線是擰它嗎？我不完全確定，但任何幫助將不勝感激！

這里是我的構建設置

gulp.task "serviceworker", ->

options =

globDirectory: "./dist/app/"

swSrc: "./dist/app/workbox.js"

swDest: "./dist/app/service-worker.js"

globPatterns: [

"shell.html"

"head.js"

"client.js"

"ads.client.js"

"css\/inline.css"

"css\/main.css"

"icons\/*.png"

"favicons\/*.png"

"fonts\/{oswald,pt-sans,icomoon}*.woff2"

]

options.dontCacheBustUrlsMatching = /icomoon\.woff2$/

unless debug

options.dontCacheBustUrlsMatching = /(icomoon\.woff2|\.(js|css))$/

workboxbuild.injectManifest(options).then() ->

console.log "Service workers generated."

.catch (err) ->

console.log "[ERROR] This happened: #{err}"

，這里是我的導航路線

workboxSW.router.registerNavigationRoute("shell.html", {

cacheName: "inverse-shell",

whitelist: [

/^\/$/,

/^\/(article|channel)/,

/^\/(science|mind-and-body|culture|innovation|entertainment)$/

],

blacklist: [

/^\/(sitemap|feed|amp|inews)/,

/^\/(user|about|archive|browse|search)/,

/^\/(newsletter|privacy-policy|terms-of-service|dmca)$/

]

});

+0

你能分享一個鏈接到PWA的公開訪問版本嗎？如果沒有，你可以分享你正在使用的工作工作站的配置，以及你正在部署的最終的'sw.js'文件嗎？ –

+0

嘿@JeffPosnick，對不起！我打太早發布！問題是完全更新瓦特/示例和錯誤消息 –

+0

也@JeffPosnick這仍在開發中，所以沒有公共鏈接，但我很高興發送任何文件你想要檢查出你的方式。非常感謝！ –

總結

以上是生活随笔為你收集整理的html文件显示不了box,Workbox.js registerNavigationRoute找不到/加载html文件的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。