javascript refreshing images every 5 seconds crashes web browser? - javascript

I have a simple javascript code in an html page, refreshing an image every 5 seconds:
function refresh() {
var unique = new Date();
document.images.EdwinImage.src = "http://192.168.0.125:8002/img?width=800&height=480&rnd=" + unique.getTime();
}
This code works fine on desktop browser, but on Android, it works only for some times then the browser closes without an error message and returns to the home screen.
After the crash, I look in the browser settings (via Settings->Applications->Manage Applications) I noticed the browser application has a 55MB cache... which seems to be the problem... even though I don't need the image to be cached since I request a new one every time. Yes, I have the correct html header to disable caching.
Here are the headers I'm using:
<meta http-equiv="Cache-control" content="no-cache">
<meta http-equiv="PRAGMA" content="no-cache">
<meta http-equiv="expires" content="0">
I'm using Android 2.2 on a Archos HT7V2 and the problems happens on all browsers I tried (stock browser, opera mini, dolphin hd).
How can I solve this problem? Or any ideas of what happened ?
Thank you,

Related

How to Clear Browser Cache in Javascript / JQuery or AngularJS [duplicate]

This question already has answers here:
How can I force clients to refresh JavaScript files?
(30 answers)
Closed 4 years ago.
Here we are using Pdf.js extension and Ifram in application,
but we are facing issue with browser cache, its storing in browser but the physical files getting changed by service, and after file content change also its showing previous document details, its not refreshing.
Please provide a solutions to clear cache (Text of webpages you've visited in Google Chrome is removed from your computer. Browsers store elements of webpages to speed up the loading of the webpage during your next visit. — Source) in in Javascript / JQuery or AngularJS
tried with
app.js?123
and
<meta http-equiv="Cache-Control" content="no-cache, no-storeenter code here, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
but not working....???
Versioning the Javascript file is one of the options to force browser to get the updated content of the file. For example:
pdf_v001.js
pdf_v002.js
pdf.js?v=001
pdf.js?v=002
If you have a version control system, you could inject the version number something like this:
<script type="text/javascript" src="pdf_$$REVISION$$.js"></script>
or:
<script type="text/javascript" src="pdf.js?v=$$REVISION$$"></script>
Please refer to this link: How can I force clients to refresh JavaScript files?

How to clear browser cache programatically using JS or HTML [duplicate]

This question already has answers here:
How to programmatically empty browser cache?
(14 answers)
Closed 5 years ago.
I try to clear the chrome browser cache using Add-ons. I am developing as a site using JSP with java, I need to clear the browser cache for the security reason. I tried many ways to clear the cache but none seems to work. Any ideas?
Please let me know..
Cache.delete()
can be used for new chrome, firefox and opera.
try it please in js File
There's no way a browser will let you clear its cache. It would be a huge security issue if that were possible. This could be very easily abused - the minute a browser supports such a "feature" will be the minute I uninstall it from my computer.
What you can do is to tell it not to cache your page, by sending the appropriate headers or using these meta tags.
Source: https://stackoverflow.com/a/8155121/5437621
call window.location.reload(true) for a ctrl+F5 from script.
In the new version of browsers Cache.delete()
in meta tag
<meta http-equiv='cache-control' content='no-cache'>
<meta http-equiv='expires' content='0'>
<meta http-equiv='pragma' content='no-cache'>
in jQuery
$('html[manifest=saveappoffline.appcache]').attr('content', '');

Default to any html file in the folder

Hi and thank you for your time in advance,
My question is I have a folder /folder-name/ on my server and we change the index.html file in here regularly but for some older browsers and clients they never get the updated information because the old information is cached in their old browser. So I have used this tactic:
How to control web page caching, across all browsers?
But it doesn't work all the time. My idea was to change the file to something different (using date so its unique) and whenever anyone goest to that folder it just defaults to show whatever HTML file is in there. This way the browser would refresh the cache thinking it is a new page each time.
So when the user goes to www.domain.com/folder-name/ it just loads whatever HTML file is in there.
Thanks again for your time.
UPATE:
This is the page: http://www.avrs.com/DMVseminars/
And what happens is certain users (older IE browsers) are caching the schedule and people call in saying they are seeing a schedule 6 months ago. I can't recreate the issue but we get about 5-10 calls a month.
Try adding these tags to your page's <head>. I use these on a site i developed a few years ago and haven't had any cacheing issues reported.
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
<meta http-equiv="pragma" content="no-cache" />
Reference
Hmmm...
There is a clever fix for this. Have an iframe spanning you whole page, and have it point to your main index.html file.
Like so:
<iframe
href = 'html/index.html'
style = 'width:100%;height:100%;border:none;outline:none;'
></iframe>
Good luck! I hope this works!

Correct way to avoid browser cache with GruntJS

I'm trying to find a good way to release a new version of a single page javascript app without asking clients to refresh their page or clear caches when a new version is deployed
I'm currently revving images / css / js files in my javascript app, so it contains references like scripts/671df76d.main.js and that's great.
So in my webapp v0.1 index.html I have something like this:
<script data-main=“scripts/d7ba3e7b.main” src=“bower_components/requirejs/require.js”></script>
while in a new v0.2 version I have this:
<script data-main=“scripts/671df76d.main” src=“bower_components/requirejs/require.js”></script>
I also experimented with meta tags that might influence caching.
<meta http-equiv="cache-control" content="max-age=0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
<meta http-equiv="pragma" content="no-cache" />
But I never found a good solution. Sometimes the updates are shown without requiring a manual refresh from the user, sometimes old content is still being shown. The only way to get the user to see the new content is to ask him to refresh the page.
As users are always visiting the webapp through the index.html, I noticed that sometimes the latest version is picked up (v0.2 with 671df76d.main), but other times after deployment the browser still loads up a previous version.
I'm just wondering how I can guarantee a browser won't have cached my index.html with an old scripts/d7ba3e7b.main.js
It makes sense that the browser can have a cached version the index.html , so it would still refer to old/stale revved javascript sources (obviously something you don't want).
In that sense the fact that you rev your resources is useless.
Am I correct in saying that simply revving up resources inside the index.html is not sufficient and that some additional stuff is needed
html meta tags
htaccess files
webserver configs
What would be a proper way to do this ? Again, the goal being to allow users to see your new version without having to ask them to refresh / clear cache.

iPhone Web App disable cache

I have built an iPhone webapp using PHP. The main (and only) page includes the apple-mobile-web-app-capable and apple-touch-fullscreen meta tags so that it can run fullscreen once added to the homescreen. However, it seems every time I launch the app from the homescreen, the cache version of the page is used instead of refreshing the page (and of course, I need the page to be updated on startup, and cannot use Ajax here - need to dynamically authenticate the user with SSO phpCAS). I did not use any manifest file and tried adding meta tags about cache without success. Does anybody know how to fix this?
Thanks
What meta tags have you tried?
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
<META HTTP-EQUIV="PRAGMA" CONTENT="NO-CACHE">
should tell Safari not to cache, but I have not tried them.
You could use javascript to load your "real" startup page from the cached page using any of the standard techniques to make the URL unique, such as adding a random number.
That might even work for the main startup page, but I doubt it. Worth a try, though.
I suggest the cached page load a new page only if it is on the springboard:
UNTESTED suggestion:
window.onload = function () {
if (navigator.standalone) {
document.location.href = 'http://your.com/whatever.php?randomjunk=1234') }
}
so if the page is in the browser it can give instructions on saving to the home screen and if it is run from the home screen it will load the real page.
I know when you include a manifest file the main page is cached automatically, but I didn't think it happened when just using ...web-app-capable. Have you tried using a cache manifest file and listing your page under "Network:" to explicitly exclude it from this method of caching? If it isn't this it must be to do with the header and the meta information there.

Categories