Break image caching in browser

2019-08-07 14:08发布

问题:

No code, because this is mostly conceptual:

So I've got a folder of images named thusly:

1.jpg 2.jpg 3.jpg 4.jpg

These images populate a gallery, and as you might assume, the ordering in the gallery is dictated by their names. So, in my php thingamabob, I allow the client to reorder the images. So, say our images depict these things:

1.jpg - "dog" 2.jpg - "cat" 3.jpg - "chicken" 4.jpg - "postmodernism"

My client decides to show "postmodernism" first, so my php thingamabob renames 4.jpg to 1.jpg, while shifting the others 1 2 and 3, to 2 3 4 respectively like so:

1.jpg - "postmodernism" 2.jpg - "dog" 3.jpg - "cat" 4.jpg - "chicken"

Great, so all seems fair and well as I look in the actual folder of the server at each image. 1.jpg exists as an image of "postmodernism" and the rest follow suit. But not so on our browser, which displays the old order. Sure enough the first image link is "1.jpg", but our "postmodern" image seems to defy its metaphysical reality as a file, and the browser displays a dog instead. I guess this is the browser caching the images and not feeling the need to reload them? Can this be broken with a simple client-side script?

回答1:

append random string or time at the end or the image url -

/images/1.jpg?anythinrandonghere

If caching is specific to user or something else then

/images/1.jpg?username