Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to prevent the browser from caching a json file

Tags:

So I'm making this little project and I'm having some troubles with catching. One thing that's not working is the browser keeps caching the json file that contains save data and when I update the json somewhere else, the browser goes back to the old version of the json file that it has cached and reads off that. Unfortunately I dont want that. I dont want the browser to cache the file at all so that every time it loads up the page, it'll ask the server for the json file and act according to that file instead of whatever file that it has cached. I would however like to be able to cache all the other stuff that's on the page but if that has to be sacrificed for this to work then it's a sacrifice I'm willing to make. I'm envisioning that in JavaScript that there would be a call that says discard the current json file and go ask the server again for it or something like

<script src="mySaveFiles.json" cache="no">  

or something of the sort to help me achieve what I'm talking about... help?

like image 278
Muggy Ate Avatar asked Feb 23 '13 14:02

Muggy Ate


People also ask

Does the browser cache JSON files?

Yes. Caching related headers and (how they are handled) work for all HTTP resources.

How do I stop my browser from caching?

Here's how... When you're in Google Chrome, click on View, then select Developer, then Developer Tools. Alternatively, you can right click on a page in Chrome, then click Inspect. Click on the Network tab, then check the box to Disable cache.

How do I keep Chrome from caching?

You can right-click on an item it displays in the Chrome cache and choose "Save Selected Items" or choose to open an item in a browser from the ChromeCacheView File menu.

How do I disable cache in API?

Just use the Cache-Control: no-cache header. Implement it as delegating-Handler and make sure your header is applied (with MS Owin Implementation hook up on OnSendingHeaders() .


2 Answers

The easiest way is to append the source string with some random parameter, which gets ignored on the server side

<script src="mySaveFiles.json?nocache=123" ></script> 

One solution would be to generate the script element using JavaScript and append the current time like this:

var el = document.createElement( script ); el.src = 'mySaveFiles.json?nocache=' + (new Date()).getTime(); document.head.appendChild( el ); 

That way, the browser will never cache the JSON-file as it appears to be a different file (due to the parameter) in every call.

like image 139
Sirko Avatar answered Sep 22 '22 00:09

Sirko


One of my favorites is just htaccess (if this is possible for you, I can't see that)

Disable cache for multiple extensions

<FilesMatch ".(pl|php|cgi|spl|scgi|fcgi|json)$">     Header unset Cache-Control </FilesMatch> 

Disable cache for just 1 extension

<Files .json>     Header unset Cache-Control </Files> 

I found it here: http://www.queness.com/post/5421/17-useful-htaccess-tricks-and-tips

like image 37
Ron van der Heijden Avatar answered Sep 18 '22 00:09

Ron van der Heijden