How to add timestamp in src URL in HTML

Question

I am trying to acieve cache busting in index.html. Below is my code

<body>
    <app-root></app-root>
    <script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="<Value>" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="<Value>" crossorigin="anonymous"></script>
    <script src='https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js?v="+ (new Date).getTime()"' integrity="<Value>" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.0.0/crypto-js.min.js"></script>
    <script type="text/javascript" src="https://cdn.rawgit.com/ricmoo/aes-js/e27b99df/index.js"></script>
</body>

I am trying to add date in bootstrap.min.js path but when I check link in Network tab, it shows

https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js?v=%22+%20(new%20Date).getTime()%22

I want to know what should I put in my index.html file so that I will get correct timestamp value.

Ricky Sixx · Answer 1 · 2021-01-23T10:51:22.483

The problem is that (new Date).getTime() in the line

<script src='https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js?v="+ (new Date).getTime()"' integrity="<Value>" crossorigin="anonymous"></script>

is not executed by Javascript, so you are simply appending it as an hardcoded string, and this is why you see that URL.

The correct way to add a timestamp, if you want to do it through Javascript, is this:

<script>document.write("<script type='text/javascript' src='https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js?v=" + Date.now() + "' integrity='<Value>' crossorigin='anonymous'><\/script>");</script>

In this way you are including a script which includes bootstrap.min.js and appends a timestamp to its URL.

See here for a similar question.

The timestamp can also be included from server side, if you prefer. Example for Java/JSP:

<script type="text/javascript" src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js?v=<%= new java.util.Date().getTime() %>" integrity="<Value>" crossorigin="anonymous"></script>

Side note: the value <Value> for your <script>'s integrity attribute is not valid. You should use the value provided by the Bootstrap CDN: see here.

How to add timestamp in src URL in HTML

1 Answers1