Javascript 无法安装站点：未检测到匹配的 Service Worker
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/45534076/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Site cannot be installed: no matching service worker detected
提问by Johannes Gnadlinger
Hey I am trying to program my first pwa and got the following problem:
嘿，我正在尝试编写我的第一个 pwa 并遇到以下问题：
when I start my web app I get the following error:
当我启动我的网络应用程序时，我收到以下错误：
Site cannot be installed: no matching service worker detected. You may need to reload the page, or check that the service worker for the current page also controls the start URL from the manifest
无法安装站点：未检测到匹配的 Service Worker。您可能需要重新加载页面，或者检查当前页面的 service worker 是否还控制清单中的起始 URL
I think my manifest url is right because of this link
我认为我的清单网址是正确的，因为这个链接
manifest.json
清单文件
"start_url": ".",
"display": "standalone",
"orientation": "portrait",
"theme_color": "#29BDBB",
"background_color": "#29BDBB"
and I register my sw like this:
我像这样注册我的 sw：
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('./sw.js').then(function(reg) {
console.log('Successfully registered service worker', reg);
}).catch(function(err) {
console.warn('Error whilst registering service worker', err);
});
}
I got my sw from here
我从这里得到了我的 sw
So I am trying to make a simple web app which I can host with firebase.
所以我正在尝试制作一个简单的网络应用程序，我可以使用firebase托管它。
Whats the problem? Thanks for your help
有什么问题？谢谢你的帮助
采纳答案by Ashraf Sabry
Place the service worker script file at the root of your website and set start_urlto /, or place it wherever you want and use the scopeproperty and the Service-Worker-AllowedHTTP header as in my other answer.
将 Service Worker 脚本文件放在您网站的根目录并设置start_url为/，或者将其放在您想要的任何位置，scope并Service-Worker-Allowed像在我的其他答案中一样使用属性和HTTP 标头。
回答by andimiya
The create react app service worker only goes into effect in production, so build it and serve it locally to test that the service worker is working properly.
create react app service worker 只在生产中生效，所以构建它并在本地提供它以测试 service worker 是否正常工作。
Install serve npm first, if it isn't already: npm i serve -g
如果还没有，请先安装 serve npm： npm i serve -g
Then...
然后...
npm run build
npm run build
serve -s build
serve -s build
It's also likely that once the service worker registers successully, but something like beforeinstallpromptmight not get called.
If that's the case, publish the app using a host like firebase, which will serve the site over https, then try the beforeinstallpromptthere.
也有可能一旦服务工作者成功注册，但beforeinstallprompt可能不会调用类似的东西。如果是这种情况，请使用 Firebase 之类的主机发布应用程序，该主机将通过 为站点提供服务https，然后在beforeinstallprompt那里尝试。
回答by Wesley Coetzee
Just in case this happens to anyone else using Angular8+. You may need to change your registration strategy to:
以防万一其他使用 Angular8+ 的人发生这种情况。您可能需要将注册策略更改为：
ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production, registrationStrategy: 'registerImmediately' }),
By default, this is set to registerWhenStable, which is when there are no pending tasks, things like setTimeout(), etc. By changing it to registerImmediately, it will register your service worker as soon as it possibly can.
默认情况下，它设置为registerWhenStable，即没有挂起的任务、事物like setTimeout()等。通过将其更改为registerImmediately，它将尽快注册您的服务工作者。
Just thought I'd share this and add it here, as this lost me a few days trying to work it out.
只是想我会分享这个并在这里添加它，因为这让我失去了几天的时间来解决它。
回答by Rolando Moncada
for my work well updating the library "@angular/service-worker":"^7.2.15" to the version, "@angular/service-worker":"^ 8.2.3"
为了我的工作，将库“@angular/service-worker”：“^7.2.15”更新到版本，“@angular/service-worker”：“^ 8.2.3”
also placing: ServiceWorkerModule.register ('ngsw-worker.js', {enabled: environment.production, registrationStrategy: 'registerImmediately'}),
还放置： ServiceWorkerModule.register ('ngsw-worker.js', {enabled: environment.production, registrationStrategy: 'registerImmediately'}),
