New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Failed to register a ServiceWorker: 404 #12

Closed
mickdekkers opened this Issue May 5, 2017 · 31 comments

Comments

Projects
None yet
@mickdekkers

mickdekkers commented May 5, 2017

I just created a new project using this template (I answered y to everything except eslint), then ran yarn followed by yarn run dev.

When I opened the Chrome console I noticed this error message:

Uncaught (in promise) TypeError: Failed to register a ServiceWorker:
A bad HTTP response code (404) was received when fetching the script.

On Windows 10, Chrome version 58.0.3029.96 (64-bit)

Edit: some additional related errors popped up after a while:

@Gavin-Gong

This comment has been minimized.

Gavin-Gong commented May 6, 2017

Same problem, but service-worker.js don't show this error in production env

@addyosmani

This comment has been minimized.

Collaborator

addyosmani commented May 6, 2017

Thanks for filing an issue!. I haven't been able to repro this yet, but will give it a few retries.

@addyosmani addyosmani added the bug label May 6, 2017

@odick

This comment has been minimized.

odick commented May 7, 2017

from https://github.com/goldhand/sw-precache-webpack-plugin repo
Currently, SWPrecacheWebpackPlugin will not work with Webpack Dev Server

@willbrowningme

This comment has been minimized.

willbrowningme commented May 7, 2017

App needs to be run over https for the ServiceWorker.

"Uncaught (in promise) DOMException: Failed to register a ServiceWorker: An SSL certificate error occurred when fetching the script."

Works fine on server with SSL certificate, got 94 on lighthouse out the box with few edits.

@odick

This comment has been minimized.

odick commented May 8, 2017

I think the problem is not about SSL when we still in development
sw-precache is working on localhost but SWPrecacheWebpackPlugin will not generate it
from https://github.com/goldhand/sw-precache-webpack-plugin repo
Currently, SWPrecacheWebpackPlugin will not work with Webpack Dev Server

If we run the build and test with something like firebase-tool and test with firebase serve command
it will work

@addyosmani

This comment has been minimized.

Collaborator

addyosmani commented May 8, 2017

The workaround I have for this locally is that we just register SW if we detect that you're not running under localhost or a dev server. For the majority of beginners (who aren't going to understand how to switch off SW or debug it easily), just enabling it during the production build seems to be a reasonable call. Does anyone strongly disagree?

@ragingwind created https://www.npmjs.com/package/sw-precache-webpack-dev-plugin which works during dev, but as it notes it works under limited circumstances. I'd personally suggest we try to get folks using precache in prod and consider improving on that in the future.

@ragingwind

This comment has been minimized.

Contributor

ragingwind commented May 9, 2017

FYI, I've also create https://www.npmjs.com/package/sw-precache-webpack-plugin-loader. To use sw-precache to be regardless during develop apps. For some of developers, it would be good that it could be deal with in a document like receipt docs.

Supporting sw-precache in webpack-dev-server is growing as something else to worry about. so I think we need to find a way of supporting it.

@addyosmani

This comment has been minimized.

Collaborator

addyosmani commented May 16, 2017

Could someone confirm if this is still an issue for you after #13 landed?

@ragingwind

This comment has been minimized.

Contributor

ragingwind commented May 16, 2017

@addyosmani I've got an error while app is running by yarn dev on localhost. the exception was caused by missing service-worker.js on localhost. because isLocalhost() returning true regardless of prod/dev build

@ragingwind

This comment has been minimized.

Contributor

ragingwind commented May 16, 2017

I made up simple solution for PoC. ragingwind@d1e665b ragingwind@8035a6a We can use template string in index.html while webpack bundling to enable or disable service-worker.js

@oswaldofreitas

This comment has been minimized.

oswaldofreitas commented May 20, 2017

@addyosmani yes, still got error on dev. +1 for support this (I would like to test my app performance locally before publish)

@CharlesOkwuagwu

This comment has been minimized.

CharlesOkwuagwu commented May 20, 2017

still get this error:

:8080/service-worker.js:1 A bad HTTP response code (404) was received when fetching the script.
:8080/service-worker.js Failed to load resource: net::ERR_INVALID_RESPONSE
(index):77 Error during service worker registration: TypeError: Failed to register a ServiceWorker: A bad HTTP response code (404) was received when fetching the script.
(anonymous) @ (index):77
@kaungmyatlwin

This comment has been minimized.

kaungmyatlwin commented May 22, 2017

In my case I was receiving only 1 error.

Error during service worker registration: TypeError: Failed to register a ServiceWorker: A bad HTTP response code (404) was received when fetching the script.

Build version seems to work fine. Also Lighthouse generates that Service Worker isn't registered while on dev server.

@brunorafael8

This comment has been minimized.

brunorafael8 commented May 22, 2017

Error during service worker registration: TypeError: Failed to register a ServiceWorker: A bad HTTP response code (404) was received when fetching the script.

@zackkrida

This comment has been minimized.

zackkrida commented May 23, 2017

still an issue!

@addyosmani

This comment has been minimized.

Collaborator

addyosmani commented May 23, 2017

I'll take another look at this today. Thanks for confirming the issue is present, folks.

@ragingwind Do you want to try PR'ing in a version of your patch in ragingwind@8035a6a? There may be a cleaner way for us to do the dev/prod injection but it would be nice to play around with it in PR form a little.

@brunorafael8

This comment has been minimized.

brunorafael8 commented May 23, 2017

I solved it, I tested it through firebase tools, and it worked

@ragingwind

This comment has been minimized.

Contributor

ragingwind commented May 24, 2017

@addyosmani I made it, PTAL #21

@addyosmani

This comment has been minimized.

Collaborator

addyosmani commented May 26, 2017

@brunorafael8 @SoullessWaffle @zackkrida @kaungmyatlwin If any of you have a chance, would you mind giving #21 a try and let us know how well it solves the issue? I'd love to figure out if that's sufficient or whether I should keep working on my local fixes for it. Cheers!

@mickdekkers

This comment has been minimized.

mickdekkers commented May 27, 2017

@addyosmani I can confirm there are no errors in the console when using @ragingwind's PR. I don't know enough about PWA yet to determine if it has any other effects. In any case it seems to fix this issue, cheers!

@HugoCrd

This comment has been minimized.

HugoCrd commented May 27, 2017

#21 removes Service worker registration when running in dev mode.
This fixes the error.

We still can't debug Web Service in dev mode (as it's disabled), but as said before, this is an sw-precache-webpack limitation (https://github.com/goldhand/sw-precache-webpack-plugin#webpack-dev-server-support).

@mickdekkers

This comment has been minimized.

mickdekkers commented May 27, 2017

Could this offer a partial solution, or does it still require sw-precache to support memory-fs? goldhand/sw-precache-webpack-plugin#17 (comment)

@rchrdnsh

This comment has been minimized.

rchrdnsh commented May 28, 2017

Just built a vue-pwa today and this issue is still persisting, at least for me.

screen shot 2017-05-28 at 1 59 30 pm

Have not done anything yet, other than set up some basic routes using vue-router and <router-link> tags...

@HugoCrd

This comment has been minimized.

HugoCrd commented May 29, 2017

#21 has not been merged yet ;)

@addyosmani

This comment has been minimized.

Collaborator

addyosmani commented May 30, 2017

#21 should be the fix for this. We'll aim to get it merged shortly. @ragingwind if you get a chance to comment on the latest feedback from Jeff that would be awesome.

@addyosmani

This comment has been minimized.

Collaborator

addyosmani commented May 31, 2017

#21 has now landed. If anyone continues to see issues with this after testing master, please let us know!

@addyosmani addyosmani closed this May 31, 2017

@sabujsen

This comment has been minimized.

sabujsen commented Sep 9, 2017

I think it need https environment to run it..

@khorkash

This comment has been minimized.

khorkash commented Oct 3, 2017

Hello!!! this error for me was occured in angular project, i moved location of sw file to src folder and added in angular-cli.json in assets [..."sw.js"]. that helped me! i wish this info will be useful for you!

@isopen

This comment has been minimized.

isopen commented Jan 25, 2018

Hello everybody!!!

  • See ngsw-config.json
  • You can simply place the worker file(ngsw-worker.js) in the assets folder.
  • ServiceWorkerModule.register('assets/ngsw-worker.js')

For those who believe that the workers work only on https: https://angular.io/guide/service-worker-getting-started (read carefully)

@kevnk

This comment has been minimized.

kevnk commented Apr 6, 2018

I'm getting this error on production when I change my webpack config.output.publicPath so my build will run in a site subdirectory. The production build is trying to load at the root: eg. /service-worker.js instead of /llama-decoder/service-worker.js

See the error: https://www.kevnk.com/llama-decoder/
See the code: https://github.com/kevnk/llama-decoder/ (the gh-pages branch has all the production code)

EDIT: I'm using @vue/cli with PWA option so is this even relevant here?

@gretschann

This comment has been minimized.

gretschann commented Apr 13, 2018

@kevnk this ticket is closed. Try to open a new

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment