Subresource Integrity and Service Worker

Service Worker

Service Worker provides the ability to hijack network request and manipulate it. By default, when Subresource Integrity is enabled, resource will fail to load if hash does not match. This will cause the web app to perform incorrectly. In helping with Service Worker, the strategy can be made so that when resource on CDN fail to load, the backup resource, which located on own server for example, can be used instead.

This demo page illustrates how it works: On initial view, you should see both script and stylesheet fail to load, as the hash isn't correct. However, when Service Worker successfully installed, it will attempt to use the backup resource instead when catching the request error. And you should then see everything loaded correctly.

If you enable Bypass for network configuration in DevTool of Chrome, you will see both resources fail again.

Please notice that for Chrome, Service Worker is only able to catch error of mismatching integrity when resoure is dynamically inserted into DOM tree by JavaScript. To see how browser behaves when resources are in DOM tree by default, please check next demo page.

Status of resources loading

Back