私はReactJSを使用してプロジェクトに取り組んでおり、create-react-app
アプリを作成します。プロジェクトをビルドした後、サーバーを使用してbuild
フォルダーを提供します。また、アプリを更新しても、静的ファイル(js、css)をキャッシュするため、ユーザーのブラウザーは引き続き古いバージョンのアプリを使用します。では、ブラウザが静的ファイルをキャッシュしないようにする方法はありますか?ありがとうございました !
TLDR:HTTPヘッダーを介してキャッシュ命令を送信する必要があります。
Cache-Control
ヘッダーには、キャッシュの動作、有効期限、および検証を制御するいくつかのディレクティブがあります。
キャッシュ動作: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cache-Control
Cache-Control:パブリックリソースは任意のキャッシュでキャッシュできます
Cache-Control:プライベートリソースはブラウザでのみキャッシュできます
Cache-Control:no-store常にサーバーからリソースを要求するようにブラウザーを設定します
Cache-Control:no-cacheこれは、ブラウザーにファイルをキャッシュするように指示しますが、サーバーに確認して最新バージョンがあることを確認するまでファイルを使用しません。この検証はETagヘッダーで行われます。 ( https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/ETag )
Create反応アプリはService Workerを提供し、これはクライアント側のさまざまなファイルをキャッシュします。必要に応じて、Service Workerの登録を解除できます。ただし、PWAのようにアプリをオフラインモードで提供することはできません。