ブラウザのキャッシュを使用せずに同じ URL から画像を動的に更新するにはどうすればよいですか?

同じ URL で画像を動的に更新する方法

サイト上の画像がリンクを通じてアクセスされ、更新されるという問題が発生しています。リンクにアクセスするたびに新しい画像が表示されます。ただし、画像をバックグラウンドでロードしてページ上で更新しようとすると、ページのリロード時に更新されても、画像は変更されません。

問題はブラウザのキャッシュにあります。デフォルトでは、ブラウザーは読み込み時間を短縮するために画像をキャッシュします。したがって、画像を更新しようとすると、ブラウザは新しい画像を取得するのではなく、キャッシュされたバージョンを表示するだけです。

解決策: キャッシュブレーカーを使用する

ブラウザを強制するには最新のイメージをダウンロードするには、イメージの URL にキャッシュブレーカーを追加します。これは通常、現在のタイムスタンプを追加して、ブラウザがリクエストを一意の URL として認識できるようにすることで行われます。

JavaScript コード内:

newImage.src = "http://localhost/image.jpg?" + new Date().getTime();

このキャッシュブレーカーを追加すると、ブラウザに強制的にアクセスされます。サーバーから画像を直接取得し、キャッシュを効果的にバイパスします。これにより、画像の最新バージョンが常にページに表示されます。

以上がブラウザのキャッシュを使用せずに同じ URL から画像を動的に更新するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。