wepback public path make index.html cache not working.

[lili21]

• I'm submitting a bug report
• I'm submitting a feature request
• I'm submitting a support request

webpack version:
2.2.1

sw-precache-webpack-plugin version:
0.9.2

Please tell us about your environment:
OSX 10.12.4

Browser: [Chrome 58.0.3029.110 (64-bit)]

Current behavior:

// webpack.config.js
...
output: {
  publichPath: 'https://cdn.com/'
},
...
plugins: [
  new SWPrecacheWebpackPlugin({
    filename: 'sw.js',
    staticFileGlobsIgnorePatterns: [/\.map$/]
  })
]

//sw.js
...
var precacheConfig = [
  ['https://cdn.com/index.html', '1927d0eabd7c5d5d786731cf24b2675b']
...

That https://cdn.com/index.html make the index.html cache won't work. Cause the request url won't match.

Expected/desired behavior:
index.html can be cached properly.

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem along with your:

• Webpack configuration:

// webpack.config.js
...
output: {
  publichPath: 'https://cdn.com/'
},
...
plugins: [
  new SWPrecacheWebpackPlugin({
    filename: 'sw.js',
    staticFileGlobsIgnorePatterns: [/\.map$/]
  })
]

• Generated service worker (not minified):

//sw.js
...
var precacheConfig = [
  ['https://cdn.com/index.html', '1927d0eabd7c5d5d786731cf24b2675b']
...

[goldhand]

So index.html is not caching as you would like? Is it generated by webpack (using a loader like html-webpack-plugin)?

[lili21]

no and yes.
user visit https://example.com/, the request url will be https://example.com/, and service worker will check https://example.com/ and https://eample.com/index.html , apparently, none of this will match https://cdn.com/index.html. so no, index.html is not caching as I would like, it not caching at all.

yes, it is generated by html-webpack-plugin.

[jeffposnick]

Related: react/create-react-app#2432

(I'm not sure this is a supported use case.)

[lili21]

I thought only service worker need to be same origin. right ?

[darrylsepeda]

I got the same issue with @lili21. All of my files is cached, but my webpack public path is directed to the other URL as explained by @lili21. So I can't refresh my page while offline because my index file is pointed to cdn.

I've read @jeffposnick reference, but still can't find any solution. What he actually did is comparing the public path and the origin then if it is different, dissable the Service Worker.

It is useless. My goal is to make this SW works no matter if the public path and the origin is different. Is there any way to overwrite the SW generated by sw-precache-webpack-plugin? so my index file can be cache correctly (not using webpack public path).

I've tried to overwrite my service worker generated by sw-precache-webpack-plugin manually from http://cdn.com/index.html to index.html and the offline mode works well, but I can't make it that way since it won't be efficient if we should maintain our service worker file manually everytime someone re-build our app.

[goldhand]

@darrylsepeda to clarify: Your index.html is hosted at the same url as your website example.com/index.html and your other assets and webpack.public_path are cdn.com/assets/

Since index.html is at example.com (and not cdn.com) service worker is not caching the index.html correctly.

[darrylsepeda]

@goldhand yes, thats right. And if we change the cdn.com/index.html to index.html in service worker that generated by sw-precache-webpack-plugin, the index.html is cached by service worker correctly.

I thought we can add if file index.html, then don't add the webpack public path. So the service worker will have:

var precacheConfig = [
  ['/index.html', 'http://cdn.com/bla.1927d0eabd7c5d5d786731cf24b2675b.js']

[goldhand]

Seems like a legitimate feature request, will think about an api for this unless you have a suggestion @darrylsepeda

[darrylsepeda]

@goldhand please kindly check my code? I tried to edit the part when sw-precache-webpack concat webpack public path with the filename. #88

[darrylsepeda]

My solution still wrong.. I'm still trying to solve it