- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
在服务 worker 中,我的获取处理程序如下所示:
self.addEventListener('fetch', function (event) {
event.respondWith(
caches.match(event.request).then(function (response) {
return response || fetch(event.request); //<-- is this the browser's default fetch handling?
})
);
});
方法 event.respondWith() 迫使我自己处理所有请求,包括 xhr 请求,这不是我喜欢做的。我只希望缓存的资源在可用时返回,让浏览器使用浏览器的默认提取处理来处理其余资源。
fetch(event.request)
我有两个问题:
只有在打开 devtools 时它才会生成 error。同时获取地址栏中可见的初始 URL https://test.de/x/#/page
。它在初始安装和每次重新加载时都会发生:
Uncaught (in promise) TypeError: Failed to execute 'fetch' on 'ServiceWorkerGlobalScope': 'only-if-cached' can be set only with 'same-origin' mode`
我不明白为什么,因为我没有设置任何东西
它似乎违反了 HTTP 协议(protocol),因为它试图请求一个带有 anchor 的 URL:
Console: {"lineNumber":0, "message":"The FetchEvent for \"https://test.de/x/#/page\" resulted in a network error response: the promise was rejected.", "message_level":2, "sourceIdentifier":1, "sourceURL":""}`
fetch() 与浏览器的默认提取处理有何不同?这些差异是导致这些错误的原因吗?
附加信息和代码:
我的应用程序还利用与服务 worker 并行的好旧的 appCache(为了向后兼容)。我不确定 appcache 是否会在初始页面加载时干扰 service worker 安装。其余代码非常简单:
我在 https://test.de/x/#/page
的 index.html 使用了 appcache 和一个 base-href:
<html manifest="appcache" lang="de">
<head>
<base href="/x/"/>
</head>
...
在正文脚本中注册 Service Worker
window.addEventListener('load', {
navigator.serviceWorker.register('/x/sw.js')
});
安装并激活事件
let MY_CACHE_ID = 'myCache_v1';
let urlsToCache = ['js/main.js'];
self.addEventListener('install', function (event) {
event.waitUntil(
caches.open(MY_CACHE_ID)
.then(function (cache) {
return cache.addAll(
urlsToCache.map(url => new Request(url,
{credentials:'include'}))
)
})
);
});
self.addEventListener('activate', function (event) {
//delete old caches
let cacheWhitelist = [MY_CACHE_ID];
event.waitUntil(
caches.keys().then(function (cacheNames) {
return Promise.all(
cacheNames.map(function (cacheName) {
if (cacheWhitelist.indexOf(cacheName) === -1) {
return caches.delete(cacheName);
}
})
);
})
);
});
最佳答案
fetch(event.request)
应该非常接近默认值。 (你可以通过根本不调用 respondWith()
来获得实际的默认值。它应该大部分是不可观察的,但是有 CSP 和一些引用位。)
鉴于此,我不确定您是如何以 1 结尾的。这应该是不可能的。不幸的是,您没有提供足够的信息来调试正在发生的事情。
至于 2,它将片段传递给 service worker,但不会包含在最终的网络请求中。这与 Fetch 的定义和完成方式相匹配,以便为服务 worker 提供一些有时可能有用的额外上下文。
关于javascript - 如何回退到浏览器在 event.respondWith() 中的默认提取处理?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50062084/
在未指定respondWith 的情况下从 Service Worker 中的 fetch 事件处理程序返回是否有效?在那种情况下会发生什么? fetch 事件是否仍以默认方式正确处理? self.a
是否有必要在 respondWith(本身在 fetch 事件中)中使用 waitUntil? respondWith 是否已经waitUntil 收到已解决的 promise ? 对此的一些讨论是
在服务 worker 中,我的获取处理程序如下所示: self.addEventListener('fetch', function (event) { event.respondWith(
我的 serviceworker 有这样的逻辑,当一个获取事件发生时,首先它获取一个包含一些 bool 值(不是 event.request.url)的端点并根据我调用的值检查该值 事件.respon
我正在使用 Jasmine 2.0.4 和 jasmine-ajax 2.99.0 来尝试测试调用 Web 服务的模块。代码如下: define(['models/data-service',
当使用 jasmine-ajax 库测试 JavaScript 代码时,我可以模拟 ajax 响应。特别是,我可以定义将给予特定 ajax 请求的响应。似乎有(至少)两种不同的方法可以做到这一点: 方
服务 worker “获取”不返回响应对象 我正在尝试使用缓存的内容来回答请求。如果缓存没有所需的内容,我将从服务器获取,将响应放入缓存并返回它。 self.addEventListener('fet
我可以在 Android Chrome、macOS Chrome 以及 Safari 和 Windows Chrome 上使用 service Worker 下载网站以供离线使用。当我尝试将网站下载到
如果用户尝试在离线状态下打开未缓存的页面,我的服务工作线程应运行以下方法 unableToResolve(),但页面会显示: Unable to connect Firefox can’t estab
有时当我运行我的服务器时,控制台会给我一个错误: Failed to load ‘http://localhost:3000/browser-sync/socket.io/?EIO=3&transpo
我是一名优秀的程序员,十分优秀!