Question

我尝试使用我的ServiceWorker缓存iframe的请求（使用sw-toolbox.js）。

但无论我尝试什么，Chrome网络标签告诉我，文件永远不会从ServiceWorker提供。

这是我的service-worker.js：

'use strict';
importScripts('./build/sw-toolbox.js');

self.toolbox.options.cache = {
    name: 'ionic-cache'
};

var static_urls = [
    'https://quiqqer.local/test?app=1',
    'https://quiqqer.local/calendar?app=1'
];

self.toolbox.precache(static_urls);

self.toolbox.router.any('/(.*)', self.toolbox.cacheFirst, {origin: 'https://quiqqer.local'});

self.addEventListener('install', function (event)
{
    self.skipWaiting();
});

self.toolbox.router.default = self.toolbox.cacheFirst;

self.toolbox.precache（）函数正确地向static_urls发出请求，正如我在网络选项卡中看到的那样。

但是来自iframe的所有请求（转到https://quiqqer.local/）似乎都没有通过ServiceWorker进行路由。

我做错了什么？或者是否可以缓存iframe请求？

使用Linux在Chromium上运行。

提前致谢

Answer 1

可能有一个官方的HTML规范提供了一个更规范的答案，但我会从MDN documentation中摘录它：

HTML元素表示嵌套的浏览上下文，有效地将另一个HTML页面嵌入当前页面。 ... 每个浏览上下文都有自己的会话历史记录和活动文档。包含嵌入内容的浏览上下文称为父浏览上下文。

您可以考虑<iframe>中发生的事情，包括加载<iframe> src本身的请求，等同于<iframe>会发生什么在一个单独的选项卡中加载。除非控制父浏览上下文的服务工作者（即您的顶级页面）也恰好在其范围内包含<iframe>的{{1}}，否则该服务工作者将无法控制最初加载src或<iframe>发出的请求。

使用ServiceWorker

1 个答案: