Repository navigation
sw-precache config incorrectly serves favicon.ico (with index.html) #2894
Description
Is this a bug report?
Yes
Can you also reproduce the problem with npm 4.x?
Yes
Which terms did you search for in User Guide?
Environment
node -v: v6.10.3npm -v: 4.6.1yarn --version(if you use Yarn): Not usednpm ls react-scripts(if you haven’t ejected): react-scripts@1.0.10
Then, specify:
- Operating system: Linux SVP1321M2EB 4.4.0-53-generic Recursively copy the template folder #74-Ubuntu SMP Fri Dec 2 15:59:10 UTC 2016 x86_64 x86_64 x86_64 GNU/Linux
- Browser and version (if relevant): Google Chrome Version 59.0.3071.86 (Official Build) (64-bit)
Steps to Reproduce
- create-react-app favicon-sw-repro
- cd favicon-sw-repro
- npm run build
- npm install -g serve
- serve -s build
- Go to http://localhost:5000/ in a browser that support service workers. I used Google Chrome
- Then go to http://localhost:5000/favicon.ico in the same browser
Expected Behavior
favicon.ico is served, either by the service-worker or by serve directly
Actual Behavior
index.html is served.
(If you Shift+F5 to bypass service-worker, the correct favicon.ico is served)
Reproducible Demo
This is not a MCVE (although the step-by-step above is) but if you want to see the issue live you can visit
https://sequencediagram.io/ (to install service worker) and then https://sequencediagram.io/favicon.ico
Other info
As far as I know, favicon.ico is not a special case in service workers i.e. a proper service worker should handle favicon.ico properly.
Btw, thanks for create-react-app, it is awesome!
Activity
Timer commentedon Aug 3, 2017
/cc @jeffposnick
jeffposnick commentedon Aug 3, 2017
Visiting http://localhost:5000/favicon.ico, by entering in that URL in a browser's location bar, triggers a navigation request. The service worker that
create-react-appgenerates has special logic in place to respond to navigation requests with the contents ofindex.html, which is the expected behavior for a single-page app.I'm assuming that you navigated to http://localhost:5000/favicon.ico just as a way of checking whether the resource exists and was being served properly. If you'd like to do that, then you can make a non-navigation request for that URL, which will match the behavior of your browser when it requests the URL in order to display the appropriate tab icon.
Enselic commentedon Aug 3, 2017
Thanks for the quick and informative reply, that made the current behavior make more sense.
My original problem was that I added another page.html to public/ that the SW hijacked. To MCVE my problem I reported for favicon.ico. If the solution would have been to make the SW ignore everything from public/ (except index.html of course) it would have worked for me.
However, I totally buy that there is no problem for favicon.ico so, and that multi-HTML builds are out of scope for create-react-app, so I think I will serve page.html from a subdomain to bypass the SW. (I don't want to eject because I like a clean source tree)
Closing the issue since I don't except any action on your part.
Timer commentedon Aug 3, 2017
Thanks for the informative response, @jeffposnick! Will keep this in mind in the future. 😄
Acknowledgements: Bypass SW, use licence-webpack-plugin
Webhooks - refine progressive web app manifest
Unregister service worker - it handles api requests, unknown assets, ...