How to refresh cached image ONCE

**webbugtrack@gmail.com** · Jul 18 '08, 05:25 PM

Re: How to refresh cached image ONCE

you can try this...

var elem = document.getEle mentById("imgs_ id_tag");
var oldSrc = elem.src;
elem.src = oldSrc + '?rnd=' + new Date().getTime( );

This basically says "set the src to the exact same thing, with an
aditional 'random' parameter (current date/time as a number)"

HTH

**Jorge** · Jul 18 '08, 05:25 PM

Re: How to refresh cached image ONCE

On Jul 18, 7:06 pm, "C. (http://symcbean.blogsp ot.com/)"
<colin.mckin... @gmail.comwrote :

Hi all,
>
I have an application which generates image graphs. These cache nicely
at the client, however if the user submits more data, I'd like to
force a reload of the image from the server.
>
I had a google, but all I could find were suggestions to use a varying
query in the URL. This is not a solution to my problem because if I
change the page to do that then ALL the graphs will be reloaded every
time.
>
I tried
>
document.getEle mentById("imgs_ id_tag").src.re load():
>
and
>
document.getEle mentById("imgs_ id_tag").reload ():
>
But just got errors.
>
(If I open JUST the image URL in a browser, I get the cached version,
if I then click on refresh, it goes back to the server to get a new
copy - which is what I want).
>
Any suggestions?
>

image.src+= "?"+Math.random ();

--Jorge

**Stanislav** · Jul 18 '08, 05:25 PM

Re: How to refresh cached image ONCE

On 18 Jul., 19:06, "C. (http://symcbean.blogsp ot.com/)"
<colin.mckin... @gmail.comwrote :

Hi all,
>
I have an application which generates image graphs. These cache nicely
at the client, however if the user submits more data, I'd like to
force a reload of the image from the server.
>
I had a google, but all I could find were suggestions to use a varying
query in the URL. This is not a solution to my problem because if I
change the page to do that then ALL the graphs will be reloaded every
time.
>
I tried
>
document.getEle mentById("imgs_ id_tag").src.re load():
>
and
>
document.getEle mentById("imgs_ id_tag").reload ():
>
But just got errors.
>
(If I open JUST the image URL in a browser, I get the cached version,
if I then click on refresh, it goes back to the server to get a new
copy - which is what I want).
>
Any suggestions?
>
TIA
>
C.

Hi,

You should send right http headers to the client.

More about this: http://developer.yahoo.com/performance/rules.html
under Add an Expires or a Cache-Control Header

;)

Best,
Stanislav

**Thomas 'PointedEars' Lahn** · Jul 18 '08, 05:55 PM

Re: How to refresh cached image ONCE

webbugtrack@gma il.com wrote:

you can try this...
>
var elem = document.getEle mentById("imgs_ id_tag");

The `images' collection should be used instead:

var elem = document.images["imgs_id_ta g"];

var oldSrc = elem.src;

What for?

elem.src = oldSrc + '?rnd=' + new Date().getTime( );
>
This basically says "set the src to the exact same thing, with an
aditional 'random' parameter (current date/time as a number)"

Because it is not considered the same thing by the user agent, it will fill
up its cache (if enabled), leaving less space for other, maybe more
important data.

Also, a random value alone is not sufficient; it must be a value that is
unique over a longer period of time, like the timestamp that you suggested.

Cache-controlling HTTP headers are the correct approach instead.

Please do a little research before you post something here.

<http://jibbering.com/faq/>

PointedEars
--
Use any version of Microsoft Frontpage to create your site.
(This won't prevent people from viewing your source, but no one
will want to steal it.)
-- from <http://www.vortex-webdesign.com/help/hidesource.htm>

**Jorge** · Jul 18 '08, 07:25 PM

Re: How to refresh cached image ONCE

On Jul 18, 7:50 pm, Thomas 'PointedEars' Lahn <PointedE...@we b.de>
wrote:

>
Also, a random value alone is not sufficient;
>

Yes it is, Thomas, remember that the OP said that he wanted to reload
the image *once*.

it must be a value that is
unique over a longer period of time, like the timestamp that you suggested.
>

The probability of obtaining the same ramdom number twice in a row is
about 1/(2^(8*8)) === 1/184467440737095 51615
And keeps being almost null even after tens or hundreds of
extractions.

If you want to experiment how long that period of time can be, try
this : it will hang your browser until Math.random() repeats a certain
value :-)

javascript:n= 0, a= Math.random();w hile(a !== Math.random()){ n+
+};alert(n);

--Jorge.

**Jorge** · Jul 18 '08, 07:55 PM

Re: How to refresh cached image ONCE

On Jul 18, 7:50 pm, Thomas 'PointedEars' Lahn <PointedE...@we b.de>
wrote:

>
Cache-controlling HTTP headers are the correct approach instead.
>

Right. Cache-control headers ought to be explicitly setup just for
these images. Agreed.

But the OP was looking for a client-side solution, and that's not.

And the proposed solution will get the image reloaded regardless of
the (cache control) headers sent/received.

Please do a little research before you post something here.
>

Grrr.

--Jorge.

**Jorge** · Jul 18 '08, 08:25 PM

Re: How to refresh cached image ONCE

On Jul 18, 9:16 pm, Jorge <jo...@jorgecha morro.comwrote:

>
javascript:n= 0, a= Math.random();w hile(a !== Math.random()){ n+
+};alert(n);
>

On my Mac it took 2,147,483,645 iterations to get "a" repeated.

--Jorge.

**Thomas 'PointedEars' Lahn** · Jul 19 '08, 01:55 AM

Re: How to refresh cached image ONCE

Jorge wrote:

Thomas 'PointedEars' Lahn wrote:

>Cache-controlling HTTP headers are the correct approach instead.

>
Right. Cache-control headers ought to be explicitly setup just for
these images. Agreed.
>
But the OP was looking for a client-side solution, and that's not.

| I have an application which generates image graphs. These cache nicely
| at the client, however if the user submits more data, I'd like to
| force a reload of the image from the server.

Not a single word about a client-side only solution.

And the proposed solution will get the image reloaded regardless of
the (cache control) headers sent/received.

The server must send an appropriate expiry value and ETag in the headers,
and the client must refresh the images often enough. If the expiry date was
met, the ETag changed or the resource was not in the cache in the first
place, it would be downloaded (again) from the server; if not, the cache
would be used. ISTM anything else would require a server-push communication
like Comet.

>Please do a little research before you post something here.

>
Grrr.

Now I have given you a reason for that.

PointedEars
--
realism: HTML 4.01 Strict
evangelism: XHTML 1.0 Strict
madness: XHTML 1.1 as application/xhtml+xml
-- Bjoern Hoehrmann

**Jorge** · Jul 19 '08, 08:05 AM

Re: How to refresh cached image ONCE

On Jul 19, 3:48 am, Thomas 'PointedEars' Lahn <PointedE...@we b.de>
wrote:

Jorge wrote:

Thomas 'PointedEars' Lahn wrote:

Cache-controlling HTTP headers are the correct approach instead.

>

Right. Cache-control headers ought to be explicitly setup just for
these images. Agreed.

>

But the OP was looking for a client-side solution, and that's not.

>
| I have an application which generates image graphs. These cache nicely
| at the client, however if the user submits more data, I'd like to
| force a reload of the image from the server.
>
Not a single word about a client-side only solution.
>

Does this look like server-side scripting to you : (?)

"I tried document.getEle mentById("imgs_ id_tag").src.re load(): "
"and document.getEle mentById("imgs_ id_tag").reload (): "

(...)
ISTM anything else would require a server-push communication
like Comet.
>

Duh !

--Jorge.

**Thomas 'PointedEars' Lahn** · Jul 19 '08, 09:45 AM

Re: How to refresh cached image ONCE

Jorge wrote:

Thomas 'PointedEars' Lahn wrote:

>Jorge wrote:

>>Thomas 'PointedEars' Lahn wrote:
>>>Cache-controlling HTTP headers are the correct approach instead.
>>Right. Cache-control headers ought to be explicitly setup just for
>>these images. Agreed.
>>But the OP was looking for a client-side solution, and that's not.

>| I have an application which generates image graphs. These cache nicely
>| at the client, however if the user submits more data, I'd like to
>| force a reload of the image from the server.
>>
>Not a single word about a client-side only solution.

>
Does this look like server-side scripting to you : (?)
>
"I tried document.getEle mentById("imgs_ id_tag").src.re load(): "
"and document.getEle mentById("imgs_ id_tag").reload (): "

I have noticed that before. So the OP had a problem with their client-side
script for refreshing the image. That does not mean in any way that the
solution must be client-side only.

>(...)
>ISTM anything else would require a server-push communication
>like Comet.

>
Duh !

Tough luck.

PointedEars
--
Use any version of Microsoft Frontpage to create your site.
(This won't prevent people from viewing your source, but no one
will want to steal it.)
-- from <http://www.vortex-webdesign.com/help/hidesource.htm>

**C. (http://symcbean.blogspot.com/)** · Jul 19 '08, 10:25 AM

Re: How to refresh cached image ONCE

On Jul 19, 10:44 am, Thomas 'PointedEars' Lahn <PointedE...@we b.de>
wrote:

Jorge wrote:

Thomas 'PointedEars' Lahn wrote:

Jorge wrote:
>Thomas 'PointedEars' Lahn wrote:
>>Cache-controlling HTTP headers are the correct approach instead.
>Right. Cache-control headers ought to be explicitly setup just for
>these images. Agreed.
>But the OP was looking for a client-side solution, and that's not.
| I have an application which generates image graphs. These cache nicely
| at the client, however if the user submits more data, I'd like to
| force a reload of the image from the server.

>

Not a single word about a client-side only solution.

>

Does this look like server-side scripting to you : (?)

>

"I tried document.getEle mentById("imgs_ id_tag").src.re load(): "
"and document.getEle mentById("imgs_ id_tag").reload (): "

>
I have noticed that before. So the OP had a problem with their client-side
script for refreshing the image. That does not mean in any way that the
solution must be client-side only.
>

(...)
ISTM anything else would require a server-push communication
like Comet.

>

Thanks guys - unfortunately it doesn't really solve my proble - I
guess I didn't make it clear enough.

I really want the image to be cached client side unless the data used
to create the image (server-side) changes. I can't really get every
client who has a cached copy to update their cache. Using a dirrent
URI each time by appending a random value just makes the browser think
it is a different image - undermining the caching which is working
fine in most cases:

had a google, but all I could find were suggestions to use a varying
query in the URL. This is not a solution to my problem because if I
change the page to do that then ALL the graphs will be reloaded every
time.

However, I think it may be possible to do for the client who just
uploaded the data - since, if they click the 'Refresh' button in the
browser it carries out an unconditional reload of the content. I'm
wanting to emulate this from Javascript.

C.

**Thomas 'PointedEars' Lahn** · Jul 19 '08, 10:45 AM

Re: How to refresh cached image ONCE

C. (http://symcbean.blogspot.com/) wrote:

I really want the image to be cached client side unless the data used to
create the image (server-side) changes.

That is what cache-controlling headers are for: <http://mnot.net/cache-docs>

I can't really get every client who has a cached copy to update their
cache.

Why not?

Using a dirrent URI each time by appending a random value just makes the
browser think it is a different image - undermining the caching which is
working fine in most cases:

This is updating the cache in a sense, only that it is filled with mostly
useless information then. You hardly want that.

>had a google, but all I could find were suggestions to use a varying
>query in the URL. This is not a solution to my problem because if I
>change the page to do that then ALL the graphs will be reloaded every
>time.

>
However, I think it may be possible to do for the client who just
uploaded the data - since, if they click the 'Refresh' button in the
browser it carries out an unconditional reload of the content. I'm
wanting to emulate this from Javascript.

Have you already tried executing

img.src = img.src;

or

var oldsrc = img.src;
img.src = "";
img.src = oldsrc;

in a repetitive setTimeout() while using cache-controlling headers?

PointedEars
--
Use any version of Microsoft Frontpage to create your site.
(This won't prevent people from viewing your source, but no one
will want to steal it.)
-- from <http://www.vortex-webdesign.com/help/hidesource.htm>

**Dr J R Stockton** · Jul 19 '08, 05:55 PM

Re: How to refresh cached image ONCE

In comp.lang.javas cript message <29d0c3f4-9a1e-4301-81b6-6dc5da5436b9@y3
8g2000hsy.googl egroups.com>, Fri, 18 Jul 2008 12:16:30, Jorge
<jorge@jorgecha morro.composted :

>On Jul 18, 7:50 pm, Thomas 'PointedEars' Lahn <PointedE...@we b.de>
>wrote:

>>
>Also, a random value alone is not sufficient;
>>

>
>Yes it is, Thomas, remember that the OP said that he wanted to reload
>the image *once*.
>

>it must be a value that is
>unique over a longer period of time, like the timestamp that you suggested.
>>

>
>The probability of obtaining the same ramdom number twice in a row is
>about 1/(2^(8*8)) === 1/184467440737095 51615
>And keeps being almost null even after tens or hundreds of
>extractions.

No, for two reasons. The generator is not necessarily 64-bit or even
53-bit. In my js-randm.htm, "MSIE 6 and 7 show 53 bits; Firefox 2.0.0.3
shows 52 bits; Opera 9.21 shows 31 bits; Safari 3.1 shows 31 bits."
And, as the generator is only pseudo-random, it should not repeat until
after a full cycle.

What does that page report (for various browsers?) on your Mac?

--
(c) John Stockton, nr London, UK. ?@merlyn.demon. co.uk Turnpike v6.05.
Web <URL:http://www.merlyn.demo n.co.uk/- w. FAQish topics, links, acronyms
PAS EXE etc : <URL:http://www.merlyn.demo n.co.uk/programs/- see 00index.htm
Dates - miscdate.htm moredate.htm js-dates.htm pas-time.htm critdate.htm etc.

**Dr J R Stockton** · Jul 19 '08, 05:55 PM

Re: How to refresh cached image ONCE

In comp.lang.javas cript message <4880D7CF.90009 04@PointedEars. de>, Fri,
18 Jul 2008 19:50:07, Thomas 'PointedEars' Lahn <PointedEars@we b.de>
posted:

>

>elem.src = oldSrc + '?rnd=' + new Date().getTime( );
>>
>This basically says "set the src to the exact same thing, with an
>aditional 'random' parameter (current date/time as a number)"

>Also, a random value alone is not sufficient; it must be a value that is
>unique over a longer period of time, like the timestamp that you suggested.

In most browser instances, Math.random can be shown to give 53 bits of
pseudo-randomness, although the initial value's randomness depends on
the quality of the initialisation.

Machines connected to the Internet generally resynchronise from time to
time with an Internet or server clock. Nearly 50% of computers will
need to be set back in time, and in the case of those which cannot be
slowed or stopped but must jump back it will be necessary to repeat a
certain amount of internal-clock time. So new Date().getTime( ) may
give the same value after an interval as it did before. That will not
often happen, but ISTM likely to happen more often than the repeat of a
good RNG, let alone of a a PRNG which will cycle through all possible
values before repeating.

Recommending adjusting HTTP headers as opposed to adjusting the 'URL' is
not helpful to those whose servers do not allow header control.
Professional servers should allow it; those available to many of the
amateurs who read this group may very well not do so.

>Please do a little research before you post something here.

Please think before you post something here.

--
(c) John Stockton, nr London, UK. ?@merlyn.demon. co.uk Turnpike v6.05.
Web <URL:http://www.merlyn.demo n.co.uk/- w. FAQish topics, links, acronyms
PAS EXE etc : <URL:http://www.merlyn.demo n.co.uk/programs/- see 00index.htm
Dates - miscdate.htm moredate.htm js-dates.htm pas-time.htm critdate.htm etc.

How to refresh cached image ONCE

How to refresh cached image ONCE

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment