0

If the source code or function is changed in the SPA project, you must deploy it to the server again.

If the service is deployed, it will continue to load the cached js value unless refreshed. How do I fix this?

zero86
  • 172
  • 9
  • what server are you using. typically a server would rebuild the entire project after it detects changes so that shouldnt be an issue. – Hadi Pawar Apr 13 '20 at 13:54
  • This is expected behaviour and until user will not refreshes his page, new changes will not be loaded – Zohaib Ijaz Apr 13 '20 at 14:02
  • What exactly is your setup? This is already done in CRA and Vue CLI in a way that answers describe. – Estus Flask Apr 13 '20 at 15:21
  • [@Hadi Pawar](https://stackoverflow.com/users/7396313/hadi-pawar) i use a nginx – zero86 Apr 16 '20 at 17:04
  • [@Estus Flask](https://stackoverflow.com/users/3731501/estus-flask) I am using CRA(create-react-app). – zero86 Apr 16 '20 at 17:09
  • @ZohaibIjaz I have documented the issue here: https://stackoverflow.com/questions/62099943/forcing-refresh-of-cached-js-in-spa-reactjs-that-changes-between-requests-usin Are you saying the user MUST refresh and this in the ONLY way? – logixplayer May 30 '20 at 19:17
  • @logixplayer Yes, if a page has a heading text `ABC` and user has open that page, now if you deploy new build with heading text `XYZ`, it will be reflect in user's open page/app unless user will reload that page. Even with lazy loading/code splitting, that chunk has been retrieved and will not be fetching on route change unless user refreshes the page/app. You can't push your change to all clients/apps opened in browsers. You should apply caching on all content except `index.html` so it will be fetched everytime and other content will be come from cache if index.html is referring to same file – Zohaib Ijaz May 31 '20 at 15:13
  • @logixplayer When new build will update chunks path name like `src="chunk.1d23s.js", if that is not cached by browser, browser will fetch it from server/CDN – Zohaib Ijaz May 31 '20 at 15:15

1 Answers1

-1

Say all of your SPA code are two files: vendor.js and app.js. To miss the cache when updated, typically what is done is compute hashes of the contents and put it in the file name: vendor.<truncated md5 hash>.js and app.<truncated md5 hash>.js. Each time you build the project (assuming you changed at least one line) it gets a new hash, therefore a new filename, and miss the cache.

Jonathan Rosa
  • 992
  • 7
  • 22
  • This does not answer the question. The question states: "If the service is deployed, it will continue to load the cached js value unless REFRESHED. How do I fix this?" Your answer expects a refresh and then yes, the hashing format of the JS should work. BUT, the question is how is the cache refreshed WITHOUT a refresh? – logixplayer May 30 '20 at 18:52