JavaScript を使用して画像を動的に読み込み、キャンバスに描画するアプリがあります。画像は変更される可能性がありますが、キャッシュも活用したいので、最後に変更された http ヘッダーを使用し、画像が変更されていないときに 304 応答を送信しています。それはすべて問題なく、うまく機能しているようです...
しかし、奇妙なことが起こっています (これまでのところ、OSX 上の Chrome と Safari でのみテストされています)。ブラウザが画像のリクエストを送信するのを無視することがあります! スクリプトで を作成するnew Image()
と、onload
関数が起動しますが、ネットワーク インスペクターを使用すると、要求が行われません。リクエストが受信されていないこともサーバー側で確認できます。
キャッシュ レスポンスが空の元のリクエストには、次のヘッダーがあります。
Connection:keep-alive
Content-Length:25937
Content-Type:image/png
ETag:Thu, 10 May 2012 20:48:13 GMT
Last-Modified:Thu, 10 May 2012 20:48:13 GMT
この画像には last-modified ヘッダーがあるため、ブラウザは毎回この画像に対して新しいリクエストを行うべきではありませんか? テストを実行すると、ブラウザは 1 分ごとに新しいリクエストを 1 つしか作成しないようです (同じ画像のコピーをいくつロードしようとしても)... これは予想される動作ですか? 画像が変更されたかどうかを毎回ブラウザに確認させるヘッダーの組み合わせはありますか? それとも、このトリックを実行する JavaScript マジックでしょうか?