How to configure a website using Flutter Web to not cache data?

788

It's a decision for your team, but you wouldn't be fine working with versioned URLS? That is the easiest trick I know for cache invalidation. In the index.html file you can pass a unique VERSION_CODE to your main javascript bundle file before requesting it like

<script src="main.dart.js?VERSION_CODE=7672" type="application/javascript"></script>

And then everytime before doing a flutter build web you need to update the VERSION_CODE of your index.html file, thus invalidating the client side when they request your bundle. You can automate this, but there's no way to pass environment variables to flutter build web step.

Share:
788
Filipe Piletti Plucenio
Author by

Filipe Piletti Plucenio

I work as a software developer since 2010, I have usually worked with Microsoft technologies. Visual Studio and Microsoft SQL Server are the tools I'm most familiar with, C # is the strongest skill. I am currently a Xamarin developer.

Updated on December 27, 2022

Comments

  • Filipe Piletti Plucenio
    Filipe Piletti Plucenio 11 months

    I am creating a website using Flutter Web. The website is in production and we release one version a week. Some users have trouble getting the new version of the web application. I would like to set my website to not cache data.

    I added these tags, but to no succes:

      <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
      <meta http-equiv="Pragma" content="no-cache">
      <meta http-equiv="Expires" content="0">
    
    • Deadron
      Deadron almost 3 years
      Are you using a CDN or edge provider? Generally you should favor setting the HTTP response header for Caching instead of the meta tags.
  • Filipe Piletti Plucenio
    Filipe Piletti Plucenio almost 3 years
    I have tried this solution but I was not successful. It is necessary to update the browser a few times for it to work correctly.