Enforce the Current JavaScript File in ASP.NET

There is not much more annoying that fixing a bug in a JavaScript file and then find problems in production because the browsers of your users cached the old file. While the first reaction is to disable all caching, there is a better way in ASP.NET: append the file version to the JavaScript file name.

We usually reference JavaScript files in this way:

1
<script src="~/js/site.js"></script>

This creates a link that looks like this:

1
<script src="/js/site.js"></script>

We can append the version number of our application by adding asp-append-version="true" to our script tag:

1
<script src="~/js/site.js" asp-append-version="true"></script>

Our link now looks like this:

1
<script src="/js/site.js?v=hRQyftXiu1lLX2P9Ly9xa4gHJgLeR1uGN5qegUobtGo"></script>

If we change the version number of our application, ASP.NET will automatically update the link to the JavaScript file. That forces the browser to fetch the current file from the server and our caching problems are a thing of the past. All that while the caching stays active and will speed things up until we make the next release.