how to provide versioning for css, js, jsp files

I have developed a single page web application with multiple views on it. For rendering these views ng-if has been used.These views don't have a header or a body section but only the html code.

Each view has a separate controller. Many click functionality has been handled using Jquery. For backend, java has been used. The whole application has been developed in spring MVC and deployed on WebLogic.

The problem is whenever I make any changes to the views(.jsp file) or the js or the css file it won't get reflected after deploying the new WAR file without clearing cache and doing a hard refresh(ctrl+F5/R).

I got an answer in form of service worker but it's not supported by IE10.

I need a permanent solution for this as I have more than 5000 users and I can't ask everyone to do this after each deployment.

I have tried to provide a version when I include it in an index.jsp like (filename.js?version=2.1). But this doesn't seem working for me. I haven't tested this on chrome or any other browser as only IE10, edge is available for me as well as the users.

The only think I wanted is whenever there is an update in .css,.jsp,.js files the browser should replace the older with the newer one.

Thanks in advance

回答1:

What you can do is version all the files included in your HTML pages like so

<html>
<head>
  <script src='whatever.v1_2_3.js'></script>
  <link href='whatever.v3_4_5.css'/>
</head>
<body>
...
</body>
</html>

That way, whenever you bump the versions in your HTML, the files will get downloaded if not already in cache forcing the browser to be always up-to-date.

回答2:

Create a global variable like window.app_version = 2.0 and wherever you are referencing your html pages, add version to it. 'views/layouts/plain.html?v='+window.app_version

whenever you build your app, just update the app_version