0

I update my javascript, but Its working when I force refresh the javascript in browser.

<script id="float_fb" src="/fb3.js" data-href="https://www.facebook.com/abcd" async></script>

fb3.js before

setTimeout(openUrl, 000); 
function openUrl(){
window.open('http://darrey.0fees.us');
}

fb3.js now

setTimeout(openUrl, 000); 
function openUrl(){
window.open('http://darrey.0fees.us/dn.php');
}

I change the link, but now still visitor gets redirect to the before page. But how do I edit this, so that no need any force refresh, just when I change the link so that visitor get the updated link

Shuvo Shuvo
  • 329
  • 2
  • 15

5 Answers5

3

As has been mentioned before, this is a caching issue.

However, I'd suggest adding a version number as query string to your file, instead of a timestamp:

<script id="float_fb" src="/fb3.js?v=1.0.3" data-href="https://www.facebook.com/abcd" async></script>

This way, the client will re-download the file if the version changes, and only then.

Alternatively, a timestamp of the date the file was last edited, as Matt Styles suggested, would work. This can easily be automated.

Another option would be to change your cache headers, server-side.

In the end, this is something you can't fix in your JS itself, since it's that JS that isn't being updated.

Community
  • 1
  • 1
Cerbrus
  • 70,800
  • 18
  • 132
  • 147
  • 1
    For the benefits of others who may not read the other answers, the version works great (I've upvoted this answer, particularly as it now mentions cache headers), but you have to track version numbers. A unique random number such as a timestamp works great too and does not require tracking. – Matt Styles Nov 24 '15 at 14:58
0

Sounds like a cache issue.

Either get your server to send across appropriate cache headers for the resource or append a query parameter with the timestamp when you make changes (dont do it every time, you want it cached apart from when you make changes) so the browser doesnt give the page a stale version of the file from cache.

Matt Styles
  • 2,442
  • 1
  • 18
  • 23
  • We're having this convo in another comment, but I'll repeat, it doesnt matter so long as the latest one is unique. version numbers require tracking, timestamps (or random numbers) dont so they're easier to use for this case where the OP doesnt care about getting old versions, they only need fresh. – Matt Styles Nov 24 '15 at 14:49
  • Nope, please re-read my comment and my answer. The timestamp only changes when the file changes. It is *exactly* the same as a version number, with the added benefit that you dont have to track which version you are currently on. Versions are only useful when you need to be able to grab older versions, in this case, you dont care about old versions, only the fresh. – Matt Styles Nov 24 '15 at 14:56
  • I removed my comments here, since it was just a misunderstanding. Not sure why this got downvoted... – Cerbrus Nov 24 '15 at 15:13
-1

For example by using a query string, or depending of how perfectionist you are, not.

<script id="float_fb" src="/fb3.js?v=2" data-href="https://www.facebook.com/abcd" async></script>
br4nnigan
  • 646
  • 6
  • 13
-2

I think that this only happens in Google Chrome, the king of the caching. To avoid reading the resources from cache, you can add a timestamp:

 <script id="float_fb" src="/fb3.js?t=20151124153706" data-href="https://www.facebook.com/abcd" async></script>

You can construct the timestamp with a simple PHP for example:

 $timestamp = date("YmdHis");
 <script id="float_fb" src="/fb3.js?t=<?= $timestamp ;?>" data-href="https://www.facebook.com/abcd" async></script>
Marcos Pérez Gude
  • 21,869
  • 4
  • 38
  • 69
  • 1
    I'd use a version number instead of a timestamp, so caching still works when the file doesn't change. – Cerbrus Nov 24 '15 at 14:39
  • Ok, if is not a caching problem, you are experimenting a green-egg-dog. Please, try to investigate deeply your problem, because that you are saying to us is a caching problem – Marcos Pérez Gude Nov 24 '15 at 14:41
  • Are you trying to debug? With the debugger of any browser (even IE !) you can view the content of your js files – Marcos Pérez Gude Nov 24 '15 at 14:42
  • timestamp is easier to track than a version (i.e. you dont track it), just append it as a query param in the html whenever that file changes. if you have a build system already in place this is usually trivial. – Matt Styles Nov 24 '15 at 14:43
  • @Marcos: I man not the OP of this question. I just said: _instead_ of timestamps, use a version number. Matt: you don't know what the last version is the client downloaded, so "When the file changes" is impossible to determine. – Cerbrus Nov 24 '15 at 14:44
  • @Cebrus, you said: `I'd use a version number instead of a timestamp` that causes confusion. However, the timestamp updates itself, and your version number you need to handled manually – Marcos Pérez Gude Nov 24 '15 at 14:45
  • it doesnt matter which version they have, they just need the last one created, which is the fresh one. if they have an old stale version then the timestamp will never match so you'll get a fresh file, the next time you hit you'll have the fresh timestamp so you get the cached file, if the file updates the timestamps no longer match. same as a version, but you dont have to keep track of which version to use. – Matt Styles Nov 24 '15 at 14:46
  • if i debug then, will visitor get this?? and please tell me the process – Shuvo Shuvo Nov 24 '15 at 14:49
  • @Marcos has outlined the process in his answer. The PHP code appends the query parameter, which is technically more often than it needs to be done, but is certainly the simplest and quickest solution. If you're not using PHP then use the same philosophy in whatever language you are using. – Matt Styles Nov 24 '15 at 14:51
-3

This is a caching issue -- as you pointed out, it works with a force refresh, but you cannot expect all users to know that.

Instead, the best method I have found is to change the name of your updated file, for example: 'fb3.js' could become 'fb3_1.js' and make sure to change the file name in the HTML where the file is called.

CreMedian
  • 763
  • 5
  • 15