SCALE — Build Lab

Cache-Control ヘッダ

必須 セキュリティ

デプロイ後も古いHTMLが表示される問題を防ぐ。public/_headers で設定。

なぜ必要?

新版デプロイしたのに、ユーザーが旧版を見続ける = 改修が反映されない。

どう実装する?

public/_headers で /index.html を no-cache、/_assets/ を long-cache。

コード例
plain
# public/_headers
/
  Cache-Control: public, max-age=0, must-revalidate
/index.html
  Cache-Control: public, max-age=0, must-revalidate
/_assets/*
  Cache-Control: public, max-age=31536000, immutable
/*.js
  Cache-Control: public, max-age=31536000, immutable
/*.css
  Cache-Control: public, max-age=31536000, immutable

Cache-Control ヘッダ

:LiTarget: 何のために?

新版デプロイしたのに、ユーザーが旧版を見続ける = 改修が反映されない。

:LiSparkle: どう実装する?

public/_headers で /index.html を no-cache、/_assets/ を long-cache。

:LiCode: コード例

# public/_headers
/
  Cache-Control: public, max-age=0, must-revalidate
/index.html
  Cache-Control: public, max-age=0, must-revalidate
/_assets/*
  Cache-Control: public, max-age=31536000, immutable
/*.js
  Cache-Control: public, max-age=31536000, immutable
/*.css
  Cache-Control: public, max-age=31536000, immutable