Search code examples
reactjsbrowser-cache

react-cache-buster always says There is no new version


Followed the simple instructions for react-cache-buster. The build generates a meta.json file with the version number in the root. I have my app wrapped in the CacheBuster provider as instructed. All seems correct. To test I started with version 0.1.0, deployed, then bumped to 0.1.2 and deployed. Yet when I load the site it always says 'There is no new version. No cache refresh needed.' I have not tried the manual check yet, will do that next. What else do I need to do to have it detect a version change and reload on startup?

export const App = () => {
  return (
    <>
      <CacheBuster
        currentVersion={version}
        isEnabled={true}
        isVerboseMode={true}
      >
      <RouterProvider 
        router={router}
      />
      </CacheBuster>
    </>
  );

Solution

  • Use a fetch Interceptor to attach a timestamp to your url, like

    request: function(url, config) {
      if (url === "/meta.json") {
        url = `${url}?ver=${Date.now()})`;
      }
      return [url, config];
    },
    

    https://www.npmjs.com/package/fetch-intercept