silviolleite / django-pwa

Looks like an app, feels like an app, but IS NOT an app.
MIT License
528 stars 115 forks source link

Uncaught (in promise) TypeError: Request failed #44

Open ghost opened 4 years ago

ghost commented 4 years ago

I am getting 404 not found after implementingdjango-pwa app (Static file, offline and the png files defined in the serviceworker.js file). I don't know if the problem is about paths or not. But there is a missing detail in the README.md file that users needs to know. Do you have any idea?

Console log: Uncaught (in promise) TypeError: Request failed serviceworker.js:1

Network:

Request URL: http://127.0.0.1:8000/offline/
Request Method: GET
Status Code: 400 Bad Request
Remote Address: 127.0.0.1:8000
Referrer Policy: no-referrer-when-downgrade
Request URL: http://127.0.0.1:8000/static/css/django-pwa-app.css
Request Method: GET
Status Code: 404 Not Found
Remote Address: 127.0.0.1:8000
Referrer Policy: no-referrer-when-downgrade
Request URL: http://127.0.0.1:8000/static/images/icons/icon-72x72.png
Request Method: GET
Status Code: 404 Not Found
Remote Address: 127.0.0.1:8000
Referrer Policy: no-referrer-when-downgrade
tombroi commented 4 years ago

Am getting the same error, but not on local.

josylad commented 4 years ago

I have the same error too. I am serving static files from AWS.

elyak123 commented 4 years ago

In my case I was serving the files this whitenoise in the format app.db8f2edc0c8a.js with a MD5 hash to enable caching support. Whitenoise does that for the serviceworker and the icons. The manifest.json indicates the names of the files before the hash process. The workaround was to set WHITENOISE_KEEP_ONLY_HASHED_FILES = False in whitenoise.

eezis commented 3 years ago

I ran into this same error. The serviceworker.js registered just fine with localhost but not when served from https://mydomain.com at AWS. The serviceworker.js wants to cache images from static/* ...

var filesToCache = [
    ...
    '/static/css/django-pwa-app.css',
    '/static/images/icons/icon-72x72.png',
    '/static/images/icons/icon-96x96.png',
    ...

When I attempted to load https://mydomain.com/static/images/icons/icon-72x72.png I got a 404, because my settings.py specified staticfiles so that is where python manage.py collectstatic put them:

STATIC_ROOT = os.path.join(BASE_DIR, "staticfiles")
STATICFILES_STORAGE = "django.contrib.staticfiles.storage.StaticFilesStorage"

My error was in the nginx.conf where I was using a starter template and failed to update the starter code to point to the staticfiles directory (and because I actually had a static directory, most static files were loading just fine). I updated the entry as shown below then restarted nginx and I was in business.

location /static {
        # your Django project's static files - amend as required
        # alias /home/ubuntu/sites/ssotd/static;
        alias /home/ubuntu/sites/ssotd/staticfiles;
    }

It might be a good idea to amend the troubleshooting section of the docs to include a "static" load, so; /serviceworker.js, /manifest.json, /offline ... then /static/images/icons/icon-72x72.png

I hope this saves someone time down the line.