我在客户端使用原型。
我需要在不重新加载的情况下更改页面上的图片。所以在我的.js文件中我改变了图片的src,它运行正常。但我还需要,如果请求相同的图像,它还会请求服务器知道此图像是否已更改,并在需要时重新加载。服务器发送最后修改的头,如果获得if-modified-Since,则检查,并发送新图像或304 Not Modified响应。
第一次请求图像时,服务器回复图像。 第二次给出304 Not Modified。 但是当我尝试重新加载3-d时,它根本不会触发任何请求。并显示相同的缓存图像。
原型的一些功能,如果在发送NOT MODIFIED repsonse之前它不会请求。还是其他任何原因?
有没有办法强迫它提出请求?
在Firefox和Chrome中测试
答案 0 :(得分:0)
这是一个常见问题,您需要添加随机更改为图像的额外ID - 这样它会更新内容。
我一直在进行验证码图像验证,需要将图像更新为它在后端实际执行的操作。在缓存图像之前,会话值会有所不同。
所以在HTML中我添加了一个变量,然后我随机生成一个数字并更改值,因此理论上没有缓存。
Image?a=5291
if static image image.jpg?id=[blah]
您应该能够找到JavaScript随机数生成器并将其添加到任何图像中,id =可以是您喜欢的任何内容,因为它只是为了欺骗服务器和浏览器缓存。
无论如何也一直在写图像内容替换
<img id=reli src yourimg.jpg?a=5829>
//--------------------------------------------------------------------------|
// Javascript to update image content without reloading page
// http://www.pro.org.uk
// Feel free to re-use leaving this intact
// contact me: http://www.pro.org.uk/classified/Directory?act=contact
//--------------------------------------------------------------------------|
function ChangeLanguage(lang) {
langu="1&lang="+lang;
if (document.getElementById('reli').src.indexOf("country")>0) {
document.getElementById('reli').src=document.getElementById('reli').src.substring(0,document.getElementById('reli').src.indexOf("country")-1);
} else if (document.getElementById('reli').src.indexOf("lang")>0) {
document.getElementById('reli').src=document.getElementById('reli').src.substring(0,document.getElementById('reli').src.indexOf("lang")-1);
}
document.getElementById('reli').src=document.getElementById('reli').src+langu;
}
function ChangeCountry(country){
cc="1&country="+country;
if (document.getElementById('reli').src.indexOf("lang")>0) {
document.getElementById('reli').src=document.getElementById('reli').src.substring(0,document.getElementById('reli').src.indexOf("lang")-1);
}
document.getElementById('reli').src=document.getElementById('reli').src+cc;
}
答案 1 :(得分:0)
/**
* Refresh the Image
* id: id of the Image element to refresh
* src:URL of the Image Source
*/
function refreshImage(id,src){
/* Generating a Random Integer */
var rnd_int = getRandomInt(1,100000);
/* Set the Source of the Image plus extra Variable,
so the Browser will not use the Cache */
$(id).src= src+'&pictureID='+rnd_int;
/* Done */
return;
}
/**
* Returns a random integer between min and max
* Using Math.round() will give you a non-uniform distribution!
*/
function getRandomInt (min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}