How can I cache external URLs using service worker? : <p>I've been playing with the Google Web Starter Kit (<a href="https://github.com/google/web-starter-kit" rel="noreferrer">https://github.com/google/web-starter-kit</a>) and have got a little progressive web app working but am stuck on one thing: caching static files from external CDNs. E.g. I'm using MDL icons from <a href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="noreferrer">https://fonts.googleapis.com/icon?family=Material+Icons</a> I can't see a way to cache the request as the service worker only responds to URLs within my app domain.</p>

<p>Options I see:
 1. Download the file and put it in a vendor folder. Advantages: easy to set up SW cache. Disadvantages: file won't stay up to date as new icons are added (though that won't really matter as my code will only use the icons available).</p>

<ol start="2">
<li><p>Use the NPM repo: <a href="https://www.npmjs.com/package/material-design-icons" rel="noreferrer">https://www.npmjs.com/package/material-design-icons</a> and use build step to copy CSS file from node_modules. Advantages: will allow auto-updating from NPM. Disadvantages: slightly more complex to set up.</p></li>
<li><p>Some fancy proxy method that would allow me to use the SW to cache an external URL. e.g. myapp.com/loadExternal?url=<a href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="noreferrer">https://fonts.googleapis.com/icon?family=Material+Icons</a></p></li>
</ol>

<p>I'm leaning towards 2 right now but would be cool to know if 3 is possible.</p>
