因此,我一直在努力在localhost上注册一个Service Worker,以便在开发网站时测试其功能。根据服务工作者的MDN指南,它指出服务工作者的代码只能在HTTPS连接上注册,但也认为localhost是本地开发的安全来源[https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers#setting_up_to_play_with_service_workers]。但是,当我尝试注册它时,我得到错误
DOMException: The operation is insecure. main.min.js:1:310
<anonymous> http://localhost:3000/js/main.min.js:1
然后,我尝试使用mkcert创建的cert来HTTPS我的localhost连接,并使用nginx反向代理应用cert。在得到该设置后,我让https://localhost:8080/
工作并为网站提供服务,但我仍然得到上述错误,但列出了https://localhost:8080/js/main.min.js:1
。
所以现在我不知道如何让这个注册为当地的发展工作。我在火狐上,如果这增加了任何额外的帮助。
服务器工作进程注册代码:
if ('serviceWorker' in navigator)
try {
const registration = await navigator.serviceWorker.register('/js/serviceWorker.min.js', { scope: '/' })
if (registration.installing)
console.log('Service Worker is installing')
else if (registration.waiting)
console.log('Service Worker is installed and waiting')
else if (registration.active)
console.log('Service Worker is active')
}
catch (error) {
console.error(error)
}
else
console.log('Service Workers are not supported here. :(')
Nginx配置:
worker_processes 1;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
listen 8080 ssl;
server_name localhost;
ssl_certificate /Users/soul/localhost.pem;
ssl_certificate_key /Users/soul/localhost-key.pem;
ssl_session_cache shared:SSL:1m;
ssl_session_timeout 5m;
ssl_ciphers HIGH:!aNULL:!MD5;
ssl_prefer_server_ciphers on;
location / {
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header Accept-Encoding "";
proxy_pass http://localhost:3000;
}
}
}
1条答案
按热度按时间vuktfyat1#
在另一个浏览器Safari中测试了这个问题后,我发现了我做错了什么,因为他们给了我一个更好的错误信息。在我的注册代码中,我执行的是
{ scope: '/' }
,但由于文件来自/js
,因此无法正常工作。从.register
方法中删除该片段使其工作!而且我不需要https我的本地主机。