Reputation: 1221
I am new in web deploying. Now I have to manage windows server and every month I need to deploy new version of applications.
I have trouble with javascript. In almost every version of web applications is changed some javascript file (all javascript files are bundled in one minify javascript file).
Most of users use google chrome. Trouble is browser cacheds styles a javascript files. After deploy new version is loaded in browser old version of javascript file.
Does exists any solution how to resolve this problem programmatically in application or some solution after deploy? In best case withou user colaboration (for example refresh cache by CTRL+R)? What is the best practice?
Our application is developed as .NET CORE 2 Razor Pages web application.
Thanks for advice
Upvotes: 0
Views: 210
Reputation: 30035
Use the tag helpers for script and style files, which take an additional attribute append-version
, which appends a new query string value each time there are changes in the files.
<link href="/styles/site.css" append-version="true" />
<script src="/scripts/site.js" append-version="true"></script>
Upvotes: 1
Reputation: 305
you can make sure that any updates you’ve made to your bundle files will take place immediately for all users with using versioned names like:
<link rel="stylesheet" href="style.css?v=1.1">
The browser will view a file name of style.css
as different from a file name of style.css?v=1.1
. It also works for script files as well:
<script src="main.bundle.js?version=1.0.1"></script>
But then If you have one giant file, and change one line of code, the user must download that entire file again. Think of a solution, to creating more smaller files, like with splitting out npm
packages used in your solution from your own code, to have better release-flow.
Upvotes: 1
Reputation: 512
If you are using normal html, css, js project then you can add versioning in your js and css libraries and update your index.html with updated version.
Or if you are using node js, react js, angular js then you can use index.ejs instead of index.html and you can add hash code with your js and css libraries like
script1.1ebecec8538d52c8f844.js
script2.2e765bd6680f0c925e8a.js
style1.1ebecec8538d52c8f844.css
style2.2e765bd6680f0c925e8a.css
Or you can also use CI/CD for npm project.
Upvotes: 1
Reputation: 127
If this is about .css and .js changes, one way is to to "cache busting" is by appending something like "_versionNo" to the file name for each release. For example:
script_1.0.css // This is the URL for release 1.0
script_1.1.css // This is the URL for release 1.1
script_1.2.css // etc.
Or alternatively do it after the file name:
script.css?v=1.0 // This is the URL for release 1.0
script.css?v=1.1 // This is the URL for release 1.1
script.css?v=1.2 // etc.
Please check link Link
Upvotes: 0