service worker swallows requests for files added to public/ #3008

chee · 2017-08-26T17:41:53Z

Is this a bug report?

i can't tell, i suppose not.

Which terms did you search for in User Guide?

"service worker"

explanation

on my blog, the posts are stored in a file called posts.json, which i keep in public/.
the route for printing out a handsome html list of posts data is /posts.

the posts themselves are built from markdown files that live in, for example,
public/posts/an-example-slug.md. the url for the react rendered version of that
post is /posts/an-example-slug.

a cute feature of that has been that if you would like to view the source of one of
the posts, you can just add .md to the end of the url and there it
appears in all its monospace fancy.

i was working on some feature changes last night and this morning, and i've
upgraded react-scripts and have my setup working nicely with the service worker.
except now the service worker jumps in between me and my public/ file request.

i'm just now realising it is also eating requests for my feed.rss and manifest.json and i'm beginning to wonder if i have done something terribly wrong.

can you think of anything i can do without ejecting?
i suppose i can generate my own service worker based on the lodash template.

steps to reproduce

create-react-app service-work-me
cd service-work-me
echo '<!doctype html><title>oh no</title>' > public/404.html
echo '["some", "json"]' > public/mushroom.json
npm  run build
npm i -g serve
serve -s build

then:

open chrome to http://localhost:5000 and wait for the service worker to install
go to http://localhost:5000/404.html and see the default spinny logo app
go to http://localhost:5000/mushroom.json and see the default spinny logo app

(it sends down the contents of index.html, then the js kicks in)

but in a browser that does not support service workers, http://localhost:5000/404.html and http://localhost:5000/mushroom.json display their own content.

perhaps this is expected or necessary behaviour because you don't know what is and isn't a route in the app.

though serve and Express will try to serve the file in the directory first, won't they?.

as it seems this would require configuration of the navigateFallbackWhitelist, the recommendation will probably be to eject.

though there is a precedent for convention here, the service worker ignores firebase urls.

i will make mine ignore routes that have file extensions, as i will still want to be able to link people to files hosted there even if they've been on the site before.

gaearon · 2017-08-26T22:52:38Z

Thanks for repro steps! Leaving this to @jeffposnick to comment on.

jeffposnick · 2017-08-27T08:37:35Z

I believe that this is fundamentally the same topic as #2894 (comment)

It's reasonable to expect that anything you navigate to that exists as a static file in public/ will Just Work, and after looking at the docs for https://github.com/goldhand/sw-precache-webpack-plugin#configuration, I think I see how we can get that set up, despite the fact that public/* doesn't get picked up in the Webpack build.

@goldhand, it would be great if you could confirm, but I believe modifying the SWPrecacheWebpackPlugin config to add in

{
  staticFileGlobs: ['./public/**/*'],
  mergeStaticsConfig: true,
  stripPrefix: 'public/',
}

alongside the other options should do the trick.

I can't test that out at the moment, but I could in a day or so, unless anyone else does first.

chee · 2017-08-28T15:00:10Z

you're quite right, @jeffposnick, this is the same topic.

adding that config doesn't quite do the trick. those files are now included in the precache, with the perhaps surprising effect that they will all be downloaded and cached during the first visit to the site, but they are still not available by a direct navigate.

though this seems to be because the public prefix was not stripped off

chee · 2017-08-28T15:00:33Z

@jeffposnick's config does do the trick, with stripPrefix changed from public/ to ./public

{
  staticFileGlobs: ['./public/**/*'],
  mergeStaticsConfig: true,
  stripPrefix: './public',
}

jeffposnick · 2017-08-28T20:31:51Z

Great, glad to hear that works.

I think that would be safe to add to the default config, but it would be awesome to get a confirmation when @goldhand is around, because these are options that are specific to his Webpack plugin.

I'm also not in a position to file a PR for a bit while traveling, so perhaps someone else will want to step in there...

chee · 2017-08-28T23:43:11Z

thanks for working on this while you're traveling, @jeffposnick !

i've filed a PR with your changes, with a note that it's waiting for confirmation from @goldhand.

someone may also like to fix the language in the comment.

goldhand · 2017-08-31T22:10:25Z

Sorry for the delay @chee, your changes are 👍

gaearon · 2017-09-01T05:21:06Z

Instead of precaching everything in public, can instead force requests to it always go to network? Somehow.

chee · 2017-09-01T07:26:19Z

@goldhand no problem ! thank you

@gaearon there's some discussion of that here: #3024 (comment)

in summary: that's what i would prefer, it would be much simpler if sw-precache took a navigateFallbackBlacklist as well as a navigateFallbackWhitelist.

i think the surprise in having every file you've put in public/ be downloaded and cached for the rest of time on the first access to the site is probably equal to the surprise of not being able to navigate to them at all.

jeffposnick · 2017-09-05T14:15:06Z

Thanks for taking the lead on this, @chee. I'll chime in on the open PR regarding alternatives to precaching the entirety of public/ by default.

aaronshaf · 2017-11-04T17:27:52Z

I am having problems accessing /sitemap.xml. It was built to the public directory, and resulted in being in the build directory, but accessing /sitemap.xml in my browser results in showing index.html via the service worker.

jeffposnick · 2017-11-06T19:55:27Z

@aaronshaf, what you describe is related to this PR and to #3248.

Once #3248 is fixed and deployed, you should no longer see index.html in response to navigation requests for other URLs.

gaearon · 2018-01-10T12:04:38Z

Fixed by #3419.

vivekiyer114 · 2018-11-22T08:41:40Z

Here's a quick fix for this.

// navigateFallback: publicUrl + '/index.html'

I just commented the navigateFallback function.
Please let me know if there any demerits for this.

Timer added the issue: question > PWA label Aug 26, 2017

chee mentioned this issue Aug 28, 2017

Disable sw-precache plugin's navigateFallback #3024

Closed

jeffposnick mentioned this issue Oct 4, 2017

Why was service worker merged into create react app? #2398

Closed

jeffposnick mentioned this issue Nov 6, 2017

Remove the navigateFallback behavior from the generated service worker #3419

Merged

jeffposnick mentioned this issue Jan 8, 2018

Service Workers - Consolidated issues list #2554

Closed

6 tasks

gaearon added the issue: bug label Jan 8, 2018

gaearon added this to the 1.0.x milestone Jan 8, 2018

This was referenced Jan 9, 2018

Server-side files being redirected to using client routing due to registerServiceWorker #3608

Closed

Service worker breaks direct link to static assets in public folder #3664

Closed

gaearon closed this as completed Jan 10, 2018

jeffposnick mentioned this issue Mar 21, 2018

Workbox service worker #4169

Merged

etanzapinsky mentioned this issue Nov 29, 2018

Disable navigationFallback and navigationFallbackWhitelist in prod webpack config by default. wmonk/create-react-app-typescript#455

Open

lock bot locked and limited conversation to collaborators Jan 9, 2019

This issue was closed.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

service worker swallows requests for files added to public/ #3008

service worker swallows requests for files added to public/ #3008

chee commented Aug 26, 2017

chee commented Aug 26, 2017

Timer commented Aug 26, 2017

chee commented Aug 26, 2017

chee commented Aug 26, 2017 •

edited

Loading

gaearon commented Aug 26, 2017

jeffposnick commented Aug 27, 2017 •

edited

Loading

chee commented Aug 28, 2017 •

edited

Loading

chee commented Aug 28, 2017 •

edited

Loading

jeffposnick commented Aug 28, 2017

chee commented Aug 28, 2017

goldhand commented Aug 31, 2017

gaearon commented Sep 1, 2017

chee commented Sep 1, 2017

jeffposnick commented Sep 5, 2017

aaronshaf commented Nov 4, 2017

jeffposnick commented Nov 6, 2017

gaearon commented Jan 10, 2018

vivekiyer114 commented Nov 22, 2018 •

edited

Loading

service worker swallows requests for files added to public/ #3008

service worker swallows requests for files added to public/ #3008

Comments

chee commented Aug 26, 2017

Is this a bug report?

Which terms did you search for in User Guide?

explanation

related

chee commented Aug 26, 2017

Timer commented Aug 26, 2017

chee commented Aug 26, 2017

chee commented Aug 26, 2017 • edited Loading

steps to reproduce

gaearon commented Aug 26, 2017

jeffposnick commented Aug 27, 2017 • edited Loading

chee commented Aug 28, 2017 • edited Loading

chee commented Aug 28, 2017 • edited Loading

jeffposnick commented Aug 28, 2017

chee commented Aug 28, 2017

goldhand commented Aug 31, 2017

gaearon commented Sep 1, 2017

chee commented Sep 1, 2017

jeffposnick commented Sep 5, 2017

aaronshaf commented Nov 4, 2017

jeffposnick commented Nov 6, 2017

gaearon commented Jan 10, 2018

vivekiyer114 commented Nov 22, 2018 • edited Loading

chee commented Aug 26, 2017 •

edited

Loading

jeffposnick commented Aug 27, 2017 •

edited

Loading

chee commented Aug 28, 2017 •

edited

Loading

chee commented Aug 28, 2017 •

edited

Loading

vivekiyer114 commented Nov 22, 2018 •

edited

Loading