个人中心
文章发布
退出
作者热门文章
- c - 在位数组中找到第一个零
- linux - Unix 显示有关匹配两种模式之一的文件的信息
- 正则表达式替换多个文件
- linux - 隐藏来自 xtrace 的命令
25
4
我希望缓存动态链接页面的内容。我有一个注册了 service worker 的简单 index.html，我想将它设置为当你到达此页面时动态缓存链接指向的内容(这个想法是第二个页面不会包含在静态安装事件)。
基本上我正在设计一个页面，该页面将包含指向我希望存储在缓存中的推荐/相关页面的链接。当用户单击指向推荐的相关页面的链接时，我希望它从缓存中加载。
index.html:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="script.js"></script>
</head>
<body>
<h1>Hello Plunker!</h1>
<h3>I want to cache</h3>
<a href="page2.html">this link to my second page!</a>
<script>
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/sw.js').then(function(reg) {
// registration worked
console.log('Registration succeeded. Scope is ' + reg.scope);
}).catch(function(error) {
// registration failed
console.log('Registration failed with ' + error);
});
}
</script>
</body>
</html>
page2.html:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="script2.js"></script>
</head>
<body>
<h1>This is my second page!</h1>
<h3>I want everything from this page to be stored in the cache.</h3>
</body>
</html>
这里是 plunkr:https://plnkr.co/edit/YIAacgkuboyRBkv10hfl?p=catalogue
如何设置我的 fetch 事件以动态缓存第二页的内容，而无需将 page2.html 显式放入我的静态安装事件中？
最佳答案
根据您更新的问题，您可以使用 Client.postMessage() 来完成.
在你的客户端/html/脚本中
<a href="/url/cache-this" class="precache"></a>
<script>
if ('serviceWorker' in navigator) {
// ensure service worker is ready, you can also put this into DOM 'ready' or 'load' event
navigator.serviceWorker.ready.then(function (reg) {
var data = {
action: "precache",
url: $('.precache').attr('href') // if you had more than an url need to be cached, do a loop to collect all data
};
// NOTE: the 'action' is optional, but it is nice to separate your message type, in case you have a lot of communication between DOM and service worker.
// message to SW a stringified string of data.
navigator.serviceWorker.controller.postMessage(JSON.stringify(data));
});
}
</script>
在你的服务 worker 中。
self.addEventListener('message', event => {
if (event.data) {
let data = JSON.parse(event.data); // parse the message back to JSON
if (data.action == "precache") { // check the action
self.toolbox.precache([data.url]); // here you can use sw-toolbox or anything to cache your stuff.
}
}
});
编辑:修正错别字
关于javascript - 使用 service worker 缓存指向另一个页面的链接，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38150491/
25
4
0
有人能给我解释一下我下面程序中的一点吗我编写的以下程序是为了理解 int * const * var 的含义； #include "iostream" using namespace std ; in
我正在摆弄 C 中的指针，但仍然不确定一些非常基础的知识。我想出了以下示例代码: #include int main(void) { int num = 42; /
以下代码产生警告: const char * mystr = "\r\nHello"; void send_str(char * str); void main(void){ send_str
我正在尝试在我的 Linux 计算机上升级 cmake。这是我使用的命令。 删除旧的 cmake: sudo apt purge --auto-remove cmake 从 https://cmake
我试图借助 char 指针来追踪 union 第一个字节的值。我假设 byte1 的输出应该是 ff，但实际上是 ffffffff。如果我错了请纠正我。 #include #include #in
我正在使用微 Controller 进行一些 ADC 测量。当我尝试使用 -O2 优化编译以下代码时遇到问题，当代码中存在 PrintVal() 函数时，MCU 卡住。我做了一些调试，结果发现，当我添
#include #include using namespace std; int main () { vector qwerty; qwerty.push_back(5);
我有我的 woking setup.py 文件；其中包含以下行: home = os.environ["HOME"] # home = /home/dr in my machine; distu
这段代码 #include #include static_assert(std::is_same_v::value_type, volatile int>); 在最新的 GCC 和 clang
我对 C 中的前向声明有疑问。 代码 typedef struct yhash_s t_yhash;// forward declaration struct yhash_s { size_t
我想提取成员指针指向的成员的类型。 template void demo(myClass& instance, void* ptr) { instance.*member = *reinter
我正在尝试使用指针将一段 C 代码转换为 Swift 3。这是 C 代码中的相关部分。 Float32 sampleArray[256] = { // Array is 256 Float value
您可能知道，VLA's haves pros and cons 和它们在 C11 中是可选的。 我想使 VLA 成为可选项的主要原因是:“堆栈可能会爆炸”: int arr[n]; /* where
这段代码有什么错误？为什么我不能按照我尝试的方式取消引用该元素。 #include typedef struct { int value; struct node * left;
有什么方法可以在 JavaScript 中创建\返回指向变量的指针吗？ 比如，在 PHP 中: function func() { ..... return &$result; } 我
如果您想使用方法的指针作为参数，则需要将该方法键入作为对象的函数，就像这样好 : type TAcceptor = function(filename:string):boolean of objec
很简单的问题: 我对 C++ 中的智能指针有点陌生。我想我得到了所有权的东西，但我不知道如何访问他们实际指向的内容。当我尝试使用对象的成员函数/变量时，我只是得到了 unique_ptr 类的函数，这
我得到了一个点的方位 Angular 、指南针方向和一个可以将箭头设置到某个方向的 api(0 是顶部，90 是右侧，180 是底部，360 是顶部) 如果我希望箭头指向我采用方位 Angular 形
我正在尝试找到一种方法，从单元格中获取位于当前工作表左侧(托盘下方)的工作表单元格中的数据。 我知道如何通过调用其他工作表 =Sheet1!A1 但现在我需要一些最好的解释 =Sheet[-1]!A1
所以我在 MATLAB 中有一个 for 循环，其中向量 x 将通过一个函数，比如 cos(x).^2，或者不同的选择，比如 sin(x).^2 + 9.*x。用户将在 for 循环之前选择他想使用的
我是一名优秀的程序员,十分优秀！