0
votes

When rebuilding my Flutter Web app after a SDK upgrade, browsers that have visited the previous version of the app are now displaying wrong icons. Problem disappears when clearing browsing data in these browsers (but that's obviously not a solution for all visitors).

My assumption is that main.dart.js is properly refreshed using latest version from server, but MaterialIcons-Regular.otf is still loaded from browser disk cache.

Does this explanation make any sense ?

Is there anything that can be done to avoid this problem ?

Steps to reproduce the issue with the sample app:

  1. create and build a flutter web app with Flutter 2.0.0, and deploy it on a web server
  2. visit the app with a browser Before update
  3. rebuild the app with Flutter 2.2.1, and deploy it
  4. refresh the app in the browser After update
1

1 Answers

0
votes

When the service worker attempts to refresh the icons file, the browser got it from disk cache instead of requesting the server. To avoid it I modified the web server's configuration to add "no cache" headers in responses and force the browser to fetch the file from server when the service worker requests it.

In the Apache Virtualhost's configuration I added:

    Header set Cache-Control "no-cache, no-store, must-revalidate"
    Header set Pragma "no-cache"
    Header set Expires 0