Davecz
Davecz

Reputation: 1221

Deploy web application

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

Answers (4)

Mike Brind
Mike Brind

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

Nima Bastani
Nima Bastani

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

Mohit Prakash
Mohit Prakash

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

hsyn.ozkara
hsyn.ozkara

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

Related Questions