[解決済み] ウェブブラウザに画像をキャッシュさせない方法
質問
背景
私は、非常にシンプルな CGI ベースの (Perl) コンテンツ管理ツールを書いて、2 つのプロボノ Web サイトで使用しています。これは、Web サイト管理者にイベント用の HTML フォームを提供し、管理者はフィールド (日付、場所、タイトル、説明、リンクなど) に入力してそれを保存します。そのフォームに、イベントに関連する画像をアップロードできるようにしています。フォームを表示するHTMLページでは、アップロードされた画像のプレビューも表示しています(HTMLのimgタグ)。
問題点
問題は、管理者が画像を変更したいときに起こります。彼はただ "参照" ボタンを押して、新しい画像を選び、ok を押すだけでよいのです。そして、これは問題なく動作します。
画像がアップロードされると、私のバックエンド CGI はアップロードを処理し、フォームを適切に再ロードします。
問題は、表示されている画像 が表示されないことです。 が更新されないことです。データベースが正しい画像を保持しているにもかかわらず、古い画像が表示されたままです。私は、画像がウェブブラウザにキャッシュされていることに原因を絞りました。管理者が Firefox/Explorer/Safari で RELOAD ボタンを押すと、すべてがうまくリフレッシュされ、新しい画像が表示されます。
私の解決策 - 動作しない
HTTP Expires 命令に非常に過去の日付を記述することで、キャッシュを制御しようとしています。
Expires: Mon, 15 Sep 2003 1:00:00 GMT
私は管理者側であり、ページの読み込みに多少時間がかかっても、常に期限切れであるため、気にしないことを忘れないでください。
しかし、これもうまくいきません。
注意事項
画像をアップロードする場合、ファイル名はデータベースに保存されません。ファイル名は 画像.jpg (という名前に変更されます(使用するときに簡単にわかるように)。既存の画像を新しい画像に置き換える場合、名前も変わりません。画像ファイルの中身が変わるだけです。
ウェブサーバーはホスティングサービス/ISPが提供するものです。Apacheを使用しています。
質問
ウェブブラウザにこのページからのキャッシュをさせないようにする方法はありますか?
私は、実際にデータベースでファイル名を保存するオプションと格闘しています。この方法では、画像が変更された場合、IMG タグの src も変更されます。しかし、これはサイト全体に多くの変更を加える必要があり、より良い解決策があるのなら、それを行うことは避けたいと思います。また、アップロードされた新しい画像が同じ名前である場合、これはまだ機能しません(画像が少しフォトショップで加工されて再アップロードされた場合)。
どのように解決するのですか?
Armin Ronacherのアイデアは正しいです。問題は、ランダムな文字列が衝突する可能性があることです。私なら
<img src="picture.jpg?1222259157.415" alt="">
ここで "1222259157.415" はサーバーの現在の時刻です。
Javascriptで時刻を生成するには
performance.now()
またはPythonで
time.time()
関連
-
[解決済み] 横型リストアイテム
-
[解決済み] HTMLで複数選択を許さないリストボックスを作るには?
-
[解決済み] Webフォームのフィールド/入力タグでブラウザのオートコンプリートを無効にするにはどうすればよいですか?
-
[解決済み] 画面サイズ、現在のウェブページ、ブラウザウィンドウのサイズを取得する
-
[解決済み] AndroidのListViewで画像を遅延ロードする方法
-
[解決済み] inline/inline-block要素間のスペースを削除するにはどうすればよいですか?
-
[解決済み] HTML5でfloat入力タイプはありますか?
-
[解決済み] HTMLでBase64画像を表示する方法
-
[解決済み】全てのブラウザで、Webページのキャッシュを制御するには?
-
[解決済み】ブラウザで強制的にキャッシュをクリアする方法
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] 同じURLの画像を新しいものに更新する
-
iframeフレームワークの使用
-
document.forms 使用方法
-
[解決済み] HTMLにおける'"'エンティティの使用法
-
[解決済み] <html xmlns="http://www.w3.org/1999/xhtml">」は何をするものですか?
-
[解決済み] input type="file "ボタンのスタイリング
-
[解決済み] HTMLで複数選択を許さないリストボックスを作るには?
-
[解決済み] インラインCSSでa:hoverを記述するには?
-
[解決済み] 特定のクラスや属性を持たない要素を選択するCSSセレクタは書けますか?
-
[解決済み】ブラウザで強制的にキャッシュをクリアする方法