javascriptによる画像ポーリング

Question

javascriptを使用して画像をポーリングする必要があり、画像がその位置に見つかったらアクションを実行する必要があります。これは私がこの作業のために書いたコードです。

/*----Image handling script starts here----*/ 
var beacon = new Image(); 
beacon.onload = function() { 
    console.log('Image found'); 
    console.log(this.width,this.height); 
    window.clearInterval(timer); 
}; 
beacon.onerror = function(){  
    console.log('Image not found'); 
} 
var timer = window.setInterval(function(){ 
    console.log('sending the request again'); 
    beacon.src = "http://www.google.co.in/logos/2010/lennon10-hp.gif"; 
},2000); 
/*----Image handling script ends here----*/ 

問題は、1つのGET要求後に、応答がキャッシュされ、srcを設定するたびにリクエストが送信されないという問題です。 NETタブを調べると、最初のsrcセットでのみリクエストが送信され、レスポンスがキャッシュされます。

私のコードがsrcを設定するたびに、画像の新規要求を送信する必要があります。回避策はありますか？

Answer 1

毎回異なるクエリ文字列でイメージを要求します。ブラウザはそれを一意のURLとして扱い、キャッシュにはそのURLを持ちません。イメージを要求するときに、Webサーバーがクエリ文字列内の何かを無視する可能性があるため、おそらくこれで取り除くことができます。次のように100要求を作成する必要があります：

for (var i=0; i<100; i++) 
{ 
    beacon.src = "http://www.google.co.in/logos/2010/lennon10-hp.gif?" + i; 
} 

Answer 2

現在のEPOCH時間を変数に含めるように変更します。

beacon.src = "http://www.google.co.in/logos/2010/lennon10-hp.gif?" + 
    date.getTime(); 

あなたがイメージを要求するたびに限り、ブラウザに関しては、イメージが異なるため、キャッシュを逃します（または潜在的にすることができる）、クエリ文字列内の各時間を別の変数を使用して

、そしてそこうまくいけば、が停止しないように、あなたが求める時間の量に制限はありません...