回答:
ハックのように感じられるがかなり移植性があるこの問題の一般的で単純な解決策は、ランダムに生成されたクエリ文字列を動的画像の各リクエストに追加することです。
したがって、たとえば-
<img src="image.png" />
なるだろう
<img src="image.png?dummy=8484744" />
または
<img src="image.png?dummy=371662" />
Webサーバーの観点からは同じファイルにアクセスしますが、ブラウザーの観点からはキャッシングを実行できません。
乱数の生成は、ページを提供するときにサーバーで(ページ自体がキャッシュされていないことを確認するだけです...)、またはクライアント(JavaScriptを使用)で発生します。
Webサーバーがこのトリックに対応できるかどうかを確認する必要があります。
ブラウザのキャッシュ戦略は、HTTPヘッダーによって制御できます。ほんのヒントにすぎないことを覚えておいてください。ブラウザーはこのフィールド(およびその他のフィールド)でひどく矛盾しているため、ブラウザーの範囲に望ましい効果を得るには、いくつかのヘッダーが必要になります。
header ("Pragma-directive: no-cache");
header ("Cache-directive: no-cache");
header ("Cache-control: no-cache");
header ("Pragma: no-cache");
header ("Expires: 0");
JavaScriptを使用してブラウザーで動的に実行する必要がある場合、ここに例を示します...
<img id=graph alt=""
src="http://www.kitco.com/images/live/gold.gif"
/>
<script language="javascript" type="text/javascript">
var d = new Date();
document.getElementById("graph").src =
"http://www.kitco.com/images/live/gold.gif?ver=" +
d.getTime();
</script>
ソリューション1は素晴らしいものではありません。それは機能しますが、画像ファイルの最後にランダムなまたはタイムスタンプ付きのハッキングクエリ文字列を追加すると、ページが読み込まれるたびに、画像が変化したかどうかに関係なく、ブラウザーがすべてのバージョンのすべてのバージョンを再ダウンロードしてキャッシュしますサーバー上。
ソリューション2は役に立たない。nocache
画像ファイルにヘッダーを追加することは、実装が非常に難しいだけでなく、将来変更される可能性があると思われる画像を初めてロードするときに、事前にいつ必要になるかを予測する必要があるため、完全に非現実的です。。
絶対的な最善の方法私はこの問題を解決することが分かってきましたが使用することですのetagsを .htaccessファイル内のあなたのイメージディレクトリ内のファイル。次の例では、画像ファイルのヘッダーでブラウザーに一意のハッシュを送信するようにApacheに指示しています。このハッシュは、画像ファイルが変更されたときにのみ変更され、この変更により、次に画像が要求されたときにブラウザが画像を再読み込みします。
<FilesMatch "\.(jpg|jpeg)$">
FileETag MTime Size
</FilesMatch>
私はすべての答えを確認しましたが、最良の答えはそうでした(そうではありません)。
<img src="image.png?cache=none">
最初は。
ただし、cache = noneパラメータ(静的な「none」という単語)を追加しても何も影響はなく、ブラウザはキャッシュからロードされます。
この問題の解決策は:
<img src="image.png?nocache=<?php echo time(); ?>">
基本的にUNIXタイムスタンプを追加してパラメーターを動的にし、キャッシュを作成しない場合、それは機能しました。
しかし、私の問題は少し異なりました:オンザフライで生成されたPHPチャート画像をロードし、$ _ GETパラメーターでページを制御していました。URLのGETパラメータが同じ場合はキャッシュから画像を読み取り、GETパラメータが変更された場合はキャッシュしないようにしたいと考えました。
この問題を解決するには、$ _ GETをハッシュする必要がありましたが、これが配列なので、解決策は次のとおりです。
$chart_hash = md5(implode('-', $_GET));
echo "<img src='/images/mychart.png?hash=$chart_hash'>";
編集:
上記のソリューションは問題なく機能しますが、ファイルが変更されるまでキャッシュバージョンを提供したい場合があります。(上記のソリューションでは、そのイメージのキャッシュを完全に無効にします)したがって、イメージファイルの使用に変更が生じるまで、ブラウザからキャッシュされたイメージを提供するには、次のようにします。
echo "<img src='/images/mychart.png?hash=" . filemtime('mychart.png') . "'>";
filemtime()はファイル変更時刻を取得します。
このトピックは古いものですが、Googleで非常によくランク付けされています。これをヘッダーに入れるとうまくいくことがわかりました。
<meta Http-Equiv="Cache-Control" Content="no-cache">
<meta Http-Equiv="Pragma" Content="no-cache">
<meta Http-Equiv="Expires" Content="0">
<meta Http-Equiv="Pragma-directive: no-cache">
<meta Http-Equiv="Cache-directive: no-cache">
私はこれに対する解決策を探していただけで、上記の答えは私の場合うまくいきませんでした(そしてそれらについてコメントするのに十分な評判がありません)。少なくとも、私のユースケースと私が使用していたブラウザー(OSX上のChrome)では、キャッシュを妨げているように思われたのは、
Cache-Control = 'no-store'
完全を期すために、「no-cache、no-store、must-revalidate」の3つすべてを使用しています。
だから私の場合(PythonでFlaskから動的に生成された画像を提供する)、私はうまくいけばできるだけ多くのブラウザで動作するように次のことをしなければなりません...
def make_uncached_response(inFile):
response = make_response(inFile)
response.headers['Pragma-Directive'] = 'no-cache'
response.headers['Cache-Directive'] = 'no-cache'
response.headers['Cache-Control'] = 'no-cache, no-store, must-revalidate'
response.headers['Pragma'] = 'no-cache'
response.headers['Expires'] = '0'
return response
画像ソースを変更することが解決策です。画像にタイムスタンプまたは乱数を追加することで、実際にこれを行うことができます。
たとえば画像が表すデータのチェックサムを追加することをお勧めします。これにより、可能な場合はキャッシュが有効になります。
束に別のソリューション1を追加しましょう。
最後に一意の文字列を追加するのが最適なソリューションです。
example.jpg?646413154
以下のソリューションは、このメソッドを拡張し、キャッシング機能を提供し、イメージが更新されたときに新しいバージョンをフェッチします。
画像が更新されると、filemtimeが変更されます。
<?php
$filename = "path/to/images/example.jpg";
$filemtime = filemtime($filename);
?>
次に画像を出力します。
<img src="images/example.jpg?<?php echo $filemtime; ?>" >
私はこの問題を抱えており、このように克服しています。
var newtags='<div class="addedimage"><h5>preview image</h5><img src="'+one+'?nocache='+Math.floor(Math.random() * 1000)+'"></div>';
これを使用して同様の問題を解決しました...(外部プロバイダーからの)画像カウンターを表示します。常に正しく更新されませんでした。そして、ランダムなパラメータが追加された後、すべてうまくいきます:)
少なくとも1分ごとに更新されるように、日付文字列を追加しました。
サンプルコード(PHP):
$output .= "<img src=\"http://xy.somecounter.com/?id=1234567890&".date(ymdHi)."\" alt=\"somecounter.com\" style=\"border:none;\">";
その結果、次のsrc
ようなリンクになります。
http://xy.somecounter.com/?id=1234567890&1207241014
たとえば、http://example.com/image.jpgのようにハードコードされた画像URL がある場合、phpを使用して画像にヘッダーを追加できます。
まず、Apacheでjpgをphpとして処理する必要があります。ここを参照: PHPを拡張子file.php.jpgで実行することは可能ですか?
ファイル(imagecreatefromjpeg)をファイルからロードし、以前の回答のヘッダーを追加します。ヘッダーを追加するには、php関数ヘッダーを使用します。
次に、imagejpeg関数を使用して画像を出力します。
phpにjpg画像を処理させるのは非常に安全ではないことに注意してください。また、私がこのソリューションをテストしていないため、機能させるかどうかはあなた次第であることに注意してください。
単純な、1つのヘッダーの場所を送信します。
私のサイトには1つの画像が含まれており、画像をアップロードした後、変更はありません。次のコードを追加します。
<?php header("Location: pagelocalimage.php"); ?>
仕事は私のためです。