Refreshing the page does not update the recent javascript - javascript

I wrote a javascript code inside an codeigniter page but when i refresh the page the previous code is still there. I tried opening it in incognito and it was updated and working. Why is that?

Browser is caching css and js file.
So sometimes when you refresh it load files from previously stored cache.
Reload all fresh file use - ctrl+f5 or ctrl+shift+f5
Read more ---> Wikipedia:Bypass_your_cache

Related

Javascript Redirect still active

I have been recently working on a website for myself, http://retrixsolutions.pw/, and I have a process before which loaded my website and redirected it to another page:
<script type="text/javascript">
document.location = "homepage.html";
</script>
Using this script, it automatically redirected my websites' index.html to homepage.html
I then looked into another website design and decided I liked that one better. I removed the files on my CentOS webserver and then uploaded the new ones. These files do not require me to redirect.
If you go to http://retrixsolutions.pw/ it works, but if you go to http://retrixsolutions.pw/index.html, it redirects to another page even though the script to redirect is completely removed.
I have restarted my webserver, shut it down and then re-uploaded the files but still the index.html file relocates to homepage.html.
Thanks for your help.
Adding on to what JBDouble05 said, another easy way to clear your cache is to hold Shift while clicking the refresh button.
What you'd need to do is make sure your browser is not caching the files. Caching is essentially the browser saving time and effort, and it saves a local copy of the file to its storage, which means that if you boot up that page, it will load the saved file, even if the file online changes. To clear cache, you can refresh the page, hard refresh and clear cache, or use an incognito or private browser (such as Epic)

Updated website through FTP but still showing old content

I am working at a project on my webhost. Until today everything went fine, but now I save the files, they update on the ftp but when I refresh the my webpage the old content shows up, not the updated one.
I checked the FTP, the files are updated with the new content and saved. I checked with the Chrome Dev Tools and I keep getting the old content from the files I work on.
I tried deleting the cache a few times but it only worked temporarily(once), and then again the content not updating.
I work with php, css and javascript files, all having the same problem.
What is wrong?
This is because Cloudflare automatically saves some files (i.e. Javascript's, CSS...). When you're in that kind of problems, in Cloudflare you should go to your page's settings and then "Cache Purge", you purge the cache and then it should work nice.
SOLUTION:
It was because of a CDN I was using, called CloudFlare. I have no idea why, but it kept the old content instead of updating the new one.
Be careful when using CDN's.

Detect if GWT *.nocache.js file loaded properly

In Javascript, what is the preferred way to validate if a GWT *.nocache.js file has loaded properly?
Background
My GWT application loads an *.nocache.js file within a simple shell .html page.
If a user visits the page with a stale auth cookie, the .html file loads perfectly from browser cache, but the *.nocache.js file fails to load, because the user needs a fresh auth token.
Since the .js file fails to load, it fails silently. The user sees a blank .html page with no indication that they need to refresh the page.
(note the particular failure here is that the .js file does not load due to wrong mime type. The auth layer handles stale auth cookies by redirecting to the login page. This page is a text/html document so the browser rejects loading it in a tag. Assume for this question that I cannot change this behavior in the application :)
What's the best way to detect this circumstance and, for example, force a refresh of the page.
Note a hard refresh will force a fetch of the .html page from the server, which will be redirect to the login.
One approach would be to tell the browser to not cache the .html file, but I'd prefer another solution that lets the .html file be cached.
Given that you cannot change things in your application, I will answer just to your question.
You need some javascript in your page.html in order to check whether the gwt script has been loaded after a fixed time:
<head>
<script>
setTimeout(function() {
if (!document.getElementById("my_module_name")) {
window.location.reload();
}
}, 4000)
</script>
<script language="javascript" src="my_module_name.nocache.js"></script>
</head>
In the case you use an iframe based linker (standard, xsiframe), the .nocache.js creates an iframe to load the appropriate permutation, and gives it the name of the module, so checking for the presence of that element after a while is enough to know whether the app was loaded.
You could also check for the presence of especial properties which gwt sets to the window like window.__gwt_activeModules
Typically, a GWT app loads first, then you do authentication. You can use a split point, if you want, to load only the login page. Then, after the authentication is confirmed, you load the other parts of your app.
I have never seen a scenario where authentication is done before a page loads. Maybe you can explain why you did it this way.
As for your question, you need a JavaScript to detect if another JavaScript was successfully loaded, but this solution adds an unnecessary level of complexity.

Keep the console script persistent in Google Chrome

I have a script I want to use in the Google Chrome console. But this script is going to reload the page. A bit like this :
setInterval(function(){location.reload();},3000);
The problem is, once it's reloaded, the script stops and the console is cleared. I tried the option "Preserve log on navigation" : it preserves the log, but the script doesn't restart after reloading.
How should I do ? Thanks :)
There is no way to actually do that. The only possible way I found is to develop a Chrome' extension and place your script on it. Your script will be excecuted every time the target page is loaded, so when you execute the location.refresh() method , the next time the page is loaded your script will be executed all again and so on. If you wish to persist some data between page loads, then you can use localStorage.
Find more information here https://developer.chrome.com/extensions/getstarted
How to inject scripts via extensions ?: https://developer.chrome.com/extensions/content_scriptsremember that the scope of the extensions is isolated from the rest of the page, so you cant directly access JS variables or functions declared in the page itself from an extension BUT you can interact with the DOM. Good luck
I am using a cool Chrome Extension called Resource Override, which allows you to inject a script on specific urls. So all you have to do is put your url (with * on each end), and create a JS file injected into the HEAD, and it will be ran every time. You start from scratch on every page though, so I'm not sure how you can persist data. Maybe in cookies?
Try creating a parent html document that has an iframe whose source is the original html page. Place the javascript in the parent html page and tell it to reload the iframe.

Creating a bookmarklet that always fetches latest external script version and keeps it in cache?

With in-page script tags I normally do:
script src="js/all.2011_02_02.js"
That way the browser fetches the latest version when I update the script source url and keeps it in cache.
Well, how can I accomplish that with a bookmarklet which I canĀ“t edit (unless I ask the user to delete/create new)?
sample bookmarklet:
javascript:(function(){document.body.appendChild(document.createElement('script')).src='http://example.com/js/all.js;})()
Not possible.
But you can do
javascript:(function(){document.body.appendChild(document.createElement('script')).src='http://example.com/js/all.js?'+new Date().getTime();})()
if you do not want the script cached at all

Categories

Resources