Question: handling multiple CDN domains?

[mikefowler]

I'm playing with sw-precache via the Webpack plugin, and am looking for thoughts about how to handle a CDN with multiple subdomains.

Current setup:

new SWPrecacheWebpackPlugin({
  cacheId: 'my-cache',
  filepath: 'public/service-worker.js',
  maximumFileSizeToCacheInBytes: 4194304,
  stripPrefix: 'public/static/',
  replacePrefix: 'https://a1.our-cdn.com/static/',
  staticFileGlobs: [
    '**/packages/core.bundle-*.js',
  ],
}),

This works pretty well, but it doesn't allow us to account for the fact that our static assets are served from one of three CDN subdomains (i.e. a1.our-cdn.com, a2.our-cdn.com, etc). A possible route for this type of setup is that we precache the asset by randomly picking one of the subdomains, and then any subsequent requests for that asset name, regardless of subdomain, serves the cached asset.

Looking for any thoughts on this setup and how we might leverage sw-precache for it.

[jeffposnick]

Hello @mikefowler!

That's an interesting use case. I feel like stripPrefix/replacePrefix could use a revamp (see #164 (comment)). Perhaps opening it up so that you can choose a prefix dynamically at service worker startup time would help satisfy your use case?

In the meantime, if you know that all of your subdomains should have equal uptime (you don't plan on temporarily rotating them offline or whatnot), then hardcoding one of them would be the recommended approach.

[zmandel]

I have a similar issue, but I propose a different approach: the options could allow for multiple "remap urls", so you can remap multiple files, not just limited by replacing a single prefix.
In my case, I have many .js libraries from different CDNs. Copies are also in my local directory so that sw-precache can find them, then I use "sed" to manually search and replace those URLs in my html and in the service worker generated code. Works great, but it seems the search and replace could be part of sw-precache, and it would also cover this issue.

[yuxizhe]

don't you have Access-Control-Allow-Origin problem?