如何使用Service Worker从一开始就处理读取事件？
我正在尝试构建一个基本的服务人员来处理从我的网站发送的所有AJAX请求。
服务工作者已订阅获取事件。我可以处理所有发送的请求，但在第一次安装service worker时，该请求不起作用。
一旦安装了服务工作者，如果我刷新网页，那么获取事件处理程序就会工作。
我希望我的服务人员从一开始就获取所有请求。有可能吗？
这是我的代码：
指数html
<!DOCTYPE html>
<html>
<body>
<h2>Service Worker Demo Page</h2>
<script type="text/javascript">
if (navigator.serviceWorker) {
navigator.serviceWorker.register('./sw.js')
.then(function (registration) {
console.debug('Registration within scope %s. More details %O', registration.scope, registration);
return fetch('https://www.google.com');
})
.then(console.info)
.catch(console.warn);
}
</script>
</body>
sw.js
self.addEventListener('fetch', function (e) {
console.info('%s request to %s. More details: %o'
, e.request.method
, e.request.url
, e
);
});
共有3个答案
非常感谢所有的答案，最后这是代码。
我不认为这是最好的解决方案，但它是有效的。即使刷新网页，Service Worker也会从一开始就处理所有请求。
HTML:
<!--index.html-->
<!DOCTYPE html>
<html>
<body>
<h2>Service Worker Demo Page</h2>
<script type="text/javascript">
function init() {
fetch('https://www.google.com');
}
function subscribeToSWMessages() {
navigator.serviceWorker.onmessage = function (event) {
console.info("Broadcasted message received: %s", event.data.message);
if (event.data.command == "swActive") {
init();
}
};
}
if (navigator.serviceWorker) {
subscribeToSWMessages();
navigator.serviceWorker.register('./sw.js')
.then(function (registration) {
console.debug('Registration within scope %s. More details %O', registration.scope, registration);
navigator.serviceWorker.controller.postMessage({
"command": "swRegistrationOk",
"message": "Service Worker registration ok"
});
})
.catch(console.warn);
}
</script>
</body>
</html>
服务人员：
// index.js
self.addEventListener('activate', function (event) {
event.waitUntil(self.clients.claim().then(sendActiveSignalToClients));
});
self.addEventListener('fetch', function (e) {
console.info('%s request to %s. More details: %o'
, e.request.method
, e.request.url
, e
);
});
self.addEventListener('message', function (event) {
console.info("Broadcasted message received: %s", event.data.message);
if (event.data.command == "swRegistrationOk") {
event.waitUntil(sendActiveSignalToClients());
}
});
function sendActiveSignalToClients() {
self.clients.matchAll().then(function (clients) {
clients.forEach(function (client) {
client.postMessage({
"command": "swActive",
"message": "Service Worker is active"
});
})
})
}
是的，有可能。
为了捕获最开始的请求，Service Worker必须控制在激活请求后调用这些请求的初始页。不幸的是，默认情况下这是不启用的。您仍然需要调用clients.claim来实现这个预期的行为。
self.onactivate = function(event){
event.waitUntil(self.clients.claim());
};
的默认行为是，必须先刷新网页，然后才能激活其服务工作程序。因此，您（用户）的“非常开始”与服务人员的“非常开始”不同。
但是，您可以使用客户端来覆盖此默认行为。索赔（）。请在MDN上阅读：
// sw.js
self.addEventListener('activate', function(event) {
event.waitUntil(self.clients.claim());
});
注意，对于您的用例，您应该确保在触发任何获取事件之前注册并激活SW。
______
在“service worker lifecycle”博客文章中阅读有关service worker生命周期的更多信息。这里有一些相关的要点。。。
- 在成功完成安装并处于活动状态之前，服务工作人员不会接收到读取和推送之类的事件。
- 默认情况下，页面的读取不会通过服务工作者，除非页面请求本身通过服务工作者。因此，您需要刷新页面以查看服务辅助程序的效果。clients.claim（）可以覆盖此默认值，并控制非受控页面。
-
请告诉我，每次我运行消费者时，如何从一开始就使用Kafka消费者API阅读消息。
-
我想用html制作datalist这里是一个例子 但是当我搜索“go”时，它会显示两个结果 null 我必须在MySQL中存储的5000多条记录上实现这一点。
-
问题内容： 我需要知道如何从python文件中读取行，以便首先读取最后一行并以这种方式继续进行操作，直到光标到达文件的开头为止。有任何想法吗？ 问题答案： 通过至少三种方法可以解决此问题的一般方法，即按行反向反向读取文本文件。 普遍的问题是，由于每行的长度可以不同，因此您无法事先知道文件中每行的起始位置，也不知道其中有多少行。这意味着您需要对问题应用一些逻辑。 通用方法＃1：将整个文件读入内存 使
-
问题内容： 我对此有一个文件模拟：… 我想从存在“ HDK1001”字样的行开始阅读，并在世界“ HDK7564”字样处结束阅读 我尝试使用此代码，但无法执行限制 请帮帮我 问题答案： 试试这个代码。
-
我正在尝试重新实现malloc，我需要理解对齐的目的。据我所知，如果内存对齐，代码将执行得更快，因为处理器不必采取额外步骤来恢复被剪切的内存位。我想我理解64位处理器读取64位逐64位内存。现在，让我们想象一下，我有一个有序的结构（没有填充）：一个char、一个short、一个char和一个int。为什么short会错位？我们有区块中的所有数据！为什么地址必须是2的倍数。整数和其他类型的问题是一样
-
本文向大家介绍如何使用JavaScript处理绑定事件？，包括了如何使用JavaScript处理绑定事件？的使用技巧和注意事项，需要的朋友参考一下 要使用JavaScript处理事件，请在任何元素上对鼠标单击事件使用click。 示例 您可以尝试运行以下代码，以了解如何使用JavaScript处理绑定事件：