Flaskで静的ファイル(javascript、css)のファイル更新で反映されない
先日作成した動画再生アプリ作成しました。
elsammit-beginnerblg.hatenablog.com
この際Flaskを用いたのですが、javascriptやcssを変更しても表示上変更されずに苦労したので、対策を備忘録として残しておこうと思います。
■現象
javascriptやcssを変更しても表示上変化しない。
ブラウザキャッシュが原因で、ブラウザキャッシュをクリアすれば変更後の状態が反映される。
ファイル変更後の動作確認時毎回ブラウザキャッシュしなければならなくなるのでとても面倒。
■対処方法
どうやらHTML内でcssをリンクする際に、
style.css?v=12
のように更新日時やバージョンを付け加えればキャッシュがクリアされ、
変更が反映されるようです。
しかし、、、
いちいち手動で設定するのが面倒だな。。。
と思い調べてみたところ、下記を発見！！
内容としてはファイル更新した旨を示す情報をファイルに埋め込むことで対応するようです。
具体的には下記のようなコードをFlaskのコードに埋め込めばOKのよう。
@app.context_processor
def override_url_for():
return dict(url_for=dated_url_for)
def dated_url_for(endpoint, **values):
if endpoint == 'static':
filename = values.get('filename', None)
if filename:
file_path = os.path.join(app.root_path,
endpoint, filename)
values['q'] = int(os.stat(file_path).st_mtime)
return url_for(endpoint, **values)早速入れ込んで動作検証実施。
確かにこちらのコードで問題なくcssやjavascriptの変更に追従して表示も変わっていたことを確認！！
無事に解決。
