服务工作者未可靠地拦截获取事件

Question

我有一个用flask和nginx实现的webapp（在docker环境中）我想添加服务人员所以我读了here如何设置配置，使作用域为根目录（'/'）

启动应用程序时，我可以看到我的服务工作者已注册，安装和激活。这会按预期重复发生。但是我在可靠地拦截获取命令方面遇到问题。

使用chrome devtools，如果我在安装过程中设置了断点，请等待并继续，那么有时，GET操作会路由到服务工作者（我可以从服务工作者的fetch事件监听器中看到控制台打印输出）。当我达到这种状态时，所有提取事件都会被拦截，如预期的那样>

但是如果我删除断点并正常运行程序，则服务工作者将不会截取获取事件。

我读到here，服务工作人员的范围可能导致路由丢失。但是在这种情况下，未命中是系统性的，即永远不会拦截不在范围内的路径

这不是我的情况，因为在某些情况下，我的服务人员确实会拦截提取调用。

我的设置在下面。

谢谢，Avner

# the file structure
/usr/src/app/web/
├── V1
│   ├── js
│   │   └── mlj
│   │   └── ...
│   │       ├── main.js
│   ├── ...
├── project
│   ├── sites
│   │   └── ...
│   │   └── views.py
└── sw1.js

------------------------------------------------------------

# the file that registers the service worker 
cat main.js
...
    navigator.serviceWorker.register("../../../sw1.js", {scope: '/'})
        .then(regisration => console.log('SW Registered1'))
        .catch(console.error);

------------------------------------------------------------

# the service worker 
cat sw1.js
const version = 1;

self.addEventListener('install', function(event) {
    console.log ('SW v%s installed at', version, new Date().toLocaleTimeString());
});


self.addEventListener('activate', function(event) {
    console.log ('SW v%s activated at', version, new Date().toLocaleTimeString());
});


self.addEventListener('fetch', function(event) {
    console.log ('SW v%s fetched at', version, new Date().toLocaleTimeString());
    if(!navigator.onLine) {
        event.respondWith(new Response('<h1> Offline :( </h1>', {headers: {'Content-Type': 'text/html'}}));
    }
    else {
        console.log (event.request.url);
        event.respondWith(fetch(event.request));
    }
});


------------------------------------------------------------

# the route to the service worker in the flask python file
cat web/project/sites/views.py
...
from flask import current_app, send_from_directory
...
@sites_blueprint.route('/sw1.js', methods=['GET'])
def sw():
    # /usr/src/app
    root_dir = os.path.dirname(os.getcwd())

    filename = 'sw1.js'

    # /usr/src/app/web
    dir1 = os.path.join(root_dir, 'web')

    return send_from_directory(dir1, filename)
    

我有一个用flask和nginx实现的webapp（在docker环境中，我想添加一个服务工作者，所以我在这里阅读了如何设置配置，使作用域为根目录（'...

Answer 1

我发现here在Chrome开发者工具的“网络”标签上，如果选中了“禁用缓存”，则请求将进入网络，而不是Service Worker，即Service Worker不会获取数据事件。

通过取消选中按钮禁用缓存