CODEWITHSUNDEEP
flutterbrowser-cacheflutter-web
Eradicatore
Eradicatore

Reputation: 1629

Prevent caching of pages?

I've noticed while I deploy my flutter web project with nginx, after doing a "flutter build web" that if I don't delete the cache the old files are still in my chrome browser. Is there a way to force a refresh for users automatically if I deploy updates?

Upvotes: 9

Views: 4677

Answers (1)

Mohith7548
Mohith7548

Reputation: 1370

Every browser does caching and is completely normal when you don't immediately see the changes on the client browser. It does take some time for the browser to realize the code has been changed on the server and needs to update its local cache. And is completely depends on the client browser settings and client's connection speed.

But if your situations demand the client to have an updated version of the website in no time, there is a workaround.

The main.dart.js file is something like this below

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>My Flutter App</title>
  </head>
  <body>
    <script src="main.dart.js" type="application/javascript"></script>
  </body>
</html>

In order to force browsers to reload the app each time we want that, add a unique parameter to the main.dart.js script-src (for example a version, though it can be anything, even just a random number after ?). The new index.html will look like:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>My Flutter App</title>
  </head>
  <body>
    <script src="main.dart.js?version=1" type="application/javascript"></script>
  </body>
</html>

Cons:

  • You have to manually add the incremented version number every time you want to deploy. Maybe you can write a script for doing that.

  • It does still take time if the client has slow internet connection. The problem arises when browsers like Chrome show Lite(cached) version of the website untill internet connection is fast enough.

  • Previous versions still persist to live on the client's browser till timeout

Upvotes: 7

Related Questions