Javascript 无法联系到React Service Worker

我正在学习PWAs，并试图在React应用程序上应用我关于缓存策略的新知识，但尽管我已将src/index.js中的行更改为

serviceWorker.register（）

，并且这起作用，但最近创建的文件public/service worker.js没有被访问

为了尝试，我在src/serviceworner.js上创建了一个“自定义注册函数”：

导出函数customRegister（）{
if（导航器中的“serviceWorker”）{
navigator.serviceWorker.register（process.env.PUBLIC_URL+'/service worker.js'）
。然后（reg=>{
reg.onupdatefound=（）=>{
常量安装=注册安装；
installation.onstatechange=（）=>{
如果（installation.state===“已激活”）{
log（“%cActivated SW”，“字体大小：1.2rem；颜色：绿色；字体重量：粗体”）；
}
}
}
})
.catch（错误=>{
log（“%cError while registing SW:”，“font size:1.2rem；color:red；font-weight:bold”）；
console.log（错误）；
});
}
}

尽管服务工作者已注册，但这是我在

src/index.js

上更改为

serviceWorker.customRegister（）时的结果：


但我只是添加了这些函数（一次添加一个），这些函数都不起作用：

self.oninstall=（）=>{
console.log（“软件安装”）；
};

或

self.addEventListener（'install'，（）=>{
console.log（“软件安装”）；
});

我试过不同的密码，但运气不好。有什么建议吗？
不知道为什么，但即使我删除了service-worker.js，serviceWorker.js也注册了软件，没有触发任何错误

我发现正确注册软件的唯一方法是在serviceWorker.js上更改软件名称：

window.addEventListener（'load'，（）=>{
const swUrl=`${process.env.PUBLIC_URL}/sw.js`；
...
}

编辑：
我想这是预期的结果，因为React service worker是为生产而设计的，正如上面所说的

这是我在src/sw register.js上创建的函数：

导出函数LocalRegister（）{
const swPath=`${process.env.PUBLIC_URL}/sw.js`；
if（导航器中的“serviceWorker”）{
window.onload=（）=>{
navigator.serviceWorker.register（swPath）
。然后（注册=>{
registration.onupdatefound=（）=>{
const installation=registration.installation；
installation.onstatechange=（）=>{
如果（installation.state===“已激活”）{
log（“%cSW已激活”，“字体大小：1.2rem；颜色：绿色；字体重量：粗体”）；
}
}
}
})
.catch（错误=>{
log（“%cError while registing SW:”，“font size:1.2rem；color:red；font-weight:bold”）；
console.log（错误）；
});
}
}
}

然后我就在src/index.js上提到了这个：

从“React”导入React；
从“react dom”导入react dom；
从“./App”导入应用程序；
//将*作为serviceWorker从“/serviceWorker”导入；
从“/sw register”导入*作为serviceWorker；
ReactDOM.render（，document.getElementById（'root'））；
LocalRegister（）；
self指的是什么？而且我认为最好使用react service worker，因为它是由“Facebook”编写的，我相信这个脚本经过多次测试
self
指的是
ServiceWorkerGlobalScope
。我想这很好，但正如我已经说过的，我正在“学习”，所以我认为我需要使用“自己的”策略。