如何更改服务工作者sw.js的范围

时间:2018-02-24 11:42:18

标签: reactjs service-worker

我正在使用react / redux和express通过HTTPS连接提供服务器端呈现的应用程序。

位于/ build / assets文件夹中的sw.js文件中的服务工作者代码是

if ('serviceWorker' in navigator) {
    window.addEventListener('load', () => {
        navigator.serviceWorker.register('/assets/sw.js', { scope: '/' }).then((registration) => {
            console.log('SW registered: ', registration);
        }).catch((registrationError) => {
            console.log('SW registration failed: ', registrationError);
        });
    });
}

我的应用程序提供了assets文件夹,但我想将服务工作者的范围更改为root,即/

所以在快递中我添加自定义标题如下:

res.setHeader('Service-Worker-Allowed', '/');

但我仍然收到以下错误:

The path of the provided scope ('/') is not under the max scope allowed ('/assets/'). Adjust the scope, move the Service Worker script, or use the Service-Worker-Allowed HTTP header to allow the scope.

我是否在正确的位置添加标题?我还需要做些什么吗?

如果需要更多信息,请发表评论。

对此解决方案的任何帮助都将受到高度赞赏。

1 个答案:

答案 0 :(得分:3)

在Jeff Posnick的评论之后我找到了解决方案。我发布此信息以防其他人卡住并需要一些帮助。

必须专门在服务工作文件上设置标头,而不是根文档。

在快递中执行此操作:

const options = {
    setHeaders: function (res, path, stat) {
        res.set('Service-Worker-Allowed', '/');
    },
};

app.use(express.static(path.join(process.cwd(), './build/public'), options));