Question 199306 in Reactjs Question posted in
The new location for the React Documentation can be found here.

ReactJS project changes not reflecting in previously opened browsers after deployment

I have recently updated a new feature in my React JS project and deployed it to my production server. However, I’m experiencing an issue where the changes are only reflecting in certain browsers.

Specifically, if I open my website in a browser for the first time after the deployment, the changes are successfully displayed. However, if I had previously opened the website in the same browser and then try to access the updated page, the changes are not being reflected. I have tried hard refreshing the page and clearing all browser history, but the issue persists.

To deploy the project, I followed these steps:

  1. Ran the command npm run build to generate a production-ready build.
  2. Used the scp command to push the code into the production server.
  3. Updated the NGINX server’s project configuration to point to the newly created build folder as the root directory.

I hard refreshed cleared all the history, tried deployed various builds by slightly modifying the code. but still no use.

Tags:

2

Answers


  1. 0

    You can change the value of the query parameter (v=1) every time you deploy a new version of your app, or use some automated tool to generate a unique value based on the file content or timestamp.

    <script src="main.js?v=1"></script>
    Login or Signup to reply.
  2. 0

    This situation might happen for multiple reasons but caching the Html and Js files in the server or client usually is the main problem.

    • you can use the meta tag in your main HTML to control the cache:
      <meta http-equiv="Cache-control" content="no-cache">
    • make sure you use wisely from the ServiceWorker, it has a life cycle and preaches almost every file in cache storage. (you can find it in browser developer mode -> application tab). and even if you unregister the service worker it’s not removed in some cases.
    • make sure you don’t cache HTML and Js files in your server.

    At the end make sure you build and publish correctly. wish you luck

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search