0

Firefox doesnt reload images with the same url till refresh.

$("#a").click(function(){$("#img").attr("src","img.php?id=3");});
<img id="img" src="img.php?id=3">

//the two line above are in the same html page.And when the html page is loaded
// in the browser, i open a new tab and go to the php page that includes 
//the line below.

mysql_query("update images set data=$data where id=3");//changing the image here

then i go back to the html page and click #a, in firefox the old image is shown so it doesnt ask mysql if the image with id=2 is changed or not unless the html page is refreshed.But in chrome the new,changed image is shown.it goes and asks mysql again ,doesn't care if the url is still same.

i want chrome to behave like firefox.Tried to set expire,last modified etc. headers for no caching but it worked in a different way.as far as i sensed it is not caching what im looking for.Anyways, this is a really important issue for me i would appreciate any help.

2 Answers2

1

Use this;

<script>
var randomNumber = Math.random();

$("#a").click(function(){$("#img").attr("src","img.php?id=3&rand=" + randomNumber);});
</script>
<img id="img" src="img.php?id=3&rand="<script>document.write(randomNumber)</script>>

This will always generate different url. You dont needt to handle rand at the backend php

Hüseyin BABAL
  • 14,821
  • 4
  • 48
  • 70
0

Browser behavior is unique to individuals' browsers. Some people have set their browsers to save history and thus cache, other have not.

You can encourage or discourage caching by setting the headers on the page as seen here:

http://www.php.net/manual/en/httpresponse.setcachecontrol.php

Note, this is over-ridden by local browser settings.

Also, by creating a url that does not include a querystring eg:

http://www.mydomain.com/myimage3/ vs. http://www.mydomain.com/image.php?id=3

You "may" have better luck encouraging caching in the browser, though that my no longer be the case as it once was.

(frameworks such as zend and codeigniter offer url structures without querystrings in an easier to deploy format)

ssaltman
  • 3,323
  • 1
  • 16
  • 21
  • thanks saltman, i have already tried the headers but they worked differently(just for the first loading, after loading the page, if i click #a it still ask mysql if the image is changed ).But i will try the url without variable like "http://www.mydomain.com/myimage3/" – user2624687 Mar 29 '14 at 01:14
  • ssaltman i tried your suggestion but didn't work chrome still changes the pic, do you have any other suggestion – user2624687 Mar 29 '14 at 08:31
  • There are javascript routines to "pre-load images" but that's a bit out of my skillset. I'm not sure, however, if they would cache the image, but they would make the image load before the rest of the page, which might encourage caching, but probably not. – ssaltman Mar 31 '14 at 14:12