Blazor WASM - Error: Failed to start platform - error sometimes shows once after deploy

Viewed 362

I have a Blazor WASM application that mostly works. However, often after deploying new version, and sometimes rarely without reason application fails to load itself.

Refreshing page makes the error dissapear and page mostly works until next version is deployed.

I got this result from web console: console errors

I am not sure what could be causing this issue, seems like some kind of caching problem, but I was unable to pinpoint, nor solve it.

1 Answers

I have managed to solve my post-deployment integrity errors by adding a little bit of brute force approach. It might not be best solution, but works ok for my case.

First, in service.worker.js I marked file index.html not to be cached:

const offlineAssetsExclude = [/^service-worker\.js$/, /^index\.html$/];

Then I included service-worker-assets.js to loaded scripts. I need it to get access to assetsManifest.version that is automaticaly generated every build. I then compare it with version saved in localstorage, purge all application caches, save new version to localstorage and force reload.

Note that this approach will force full application download whenever new version is detected, thus avoiding integrity errors, but at cost of potentialy redownloading files that did not need it.

<script src="service-worker-assets.js?s=v1.12"></script>
<script>
    if (localStorage.getItem('currentVersion') != self.assetsManifest.version) {
        window.caches.keys().then(function (keyList) {
            keyList.forEach(key => window.caches.delete(key));
        });
        localStorage.setItem('currentVersion', self.assetsManifest.version)
        document.location.reload(true);
    }
</script>

Also notice ?s=v1.12 suffix added to asset list file. This value has to be incremented during every deployment. It ensures that browser is not caching old file and we have most fresh version.

Since I am paranoid, I added the same suffix to many other files that I do not want to stay cached after deployment

<link href="Project.Client.styles.css?s=v1.12" rel="stylesheet" />
...
<script src="javascript/site.js?s=v1.12"></script>
<script src="_framework/blazor.webassembly.js?s=v1.12"></script>
Related