时间戳

首页 > 解决方案 > Firefox无法注册Service Worker，操作不安全

javascript - Firefox无法注册Service Worker，操作不安全

问题描述

我目前正在将 chrome 扩展移植到 Firefox，当我尝试注册服务工作者时，我得到：DOMException：操作不安全

我尝试寻找 cookie 设置，但是，它没有设置为“保留直到浏览器关闭”。我还尝试将证书添加到 localhost

我尝试通过 usong 注册它

if ('serviceWorker' in navigator) {
  navigator.serviceWorker.register('./firebase-messaging-sw.js', { scope: '/' }).then(function(reg) {

    if(reg.installing) {
      console.log('Service worker installing');
    } else if(reg.waiting) {
      console.log('Service worker installed');
    } else if(reg.active) {
      console.log('Service worker active');
    }
  }).catch(function(error) {
    console.log('Registration failed with ' + error);
  });
}

并使用

const runtime = require('serviceworker-webpack-plugin/lib/runtime');

if ('serviceWorker' in navigator) {
    const registration = runtime.register();
}

标签： javascriptfirefox-addonservice-worker

解决方案

当我尝试将文件添加到项目目录之外的缓存时，我遇到了这个问题。有趣的是，我能够使用以前注册的缓存抓取文件，但无法重新注册或重新安装。

解决方案是调整Service-Worker-Allowed提供文件时设置的标题ServiceWorker.js。以前它只设置为项目 URL/文件夹，但需要对其进行扩展，以使其包含要缓存的文件的所有父文件夹。

如果您对如何设置此标头感到困惑，我使用了一个 PHP 文件作为 ServiceWorker 文件；这允许我设置必要的标头，然后将 ServiceWorker 文件放在我的服务器上的任何位置（尽管在下面的示例中，脚本与 PHP 文件位于同一文件夹中）。

索引.php

<?php
header("Service-Worker-Allowed: https://www.yoursite.com/");
header("Content-Type: application/javascript");

echo file_get_contents("ServiceWorker.js");
?>

然后，如果您的文件在ServiceWorker文件夹中，您可以使用类似的方式注册它。

navigator.serviceWorker.register(
    'ServiceWorker/',
    {scope:"https://www.yoursite.com/"})
.then(function(reg){},function(err){});

推荐阅读