web-dev-qa-db-ja.com

Webサイト開発のためにChromeキャッシュを無効にする

サイトの外観を変更しているのですが(CSSの変更)、迷惑な永続キャッシュのためにChromeで結果を見ることができません。私は試した Shift+更新しますが、動作しません。

一時的にキャッシュを無効にしたり、何らかの方法でページを更新したりして変更を確認できますか。

1532
tomermes

Chrome DevToolsはキャッシュを無効にできます。

  1. 右クリックを選択し、Inspect Elementを選択してDevToolsを開きます。または、次の キーボードショートカット :を使用します
    • F12
    • Command+Option+i Mac
    • Control+Shift+i WindowsまたはLinux
  2. クリックツールバーのNetworkでネットワークペインを開きます。
  3. チェック上部のDisable cacheチェックボックス。

screenshot of development tools panel

Tweet from @ ChromiumDev のように、この設定はdevtoolsが開いている間のみアクティブであることに留意してください。

これにより、allリソースがリロードされることに注意してください。一部のリソースでのみキャッシュを無効にしたい場合、 HTTPヘッダーを変更 サーバーがファイルと一緒に送信することができます。

Disable cacheチェックボックスを使用したくない場合、更新ボタン[DevToolsを開いた状態]を長押しすると、同様の効果を持つHard ReloadまたはEmpty Cache and Hard Reloadのオプションを含むメニューが表示されます。 オプションの違い について読んでください。次のショートカットが利用可能です:

  • Command+Option+R Mac
  • Control+Shift+R WindowsまたはLinux

long press

1928
Steve

enter image description here

キャッシュを1時間に30回クリアする必要がある場合、キャッシュをクリアするのは面倒です。そのため、ページの読み込みごとにキャッシュをクリアするClassic Cache KillerというChrome拡張機能をインストールしました。

Chrome Store Link(無料)(今マルウェアなし!)

これで、モックjson、javascript、css、html、およびデータが更新されますevery time on every page load

Ineverキャッシュをクリアする必要があるかどうか心配する必要はありません。

Chromeには約20個のキャッシュクリーナーがありますが、これは軽量で労力がかからないように見えました。更新では、Cache Killerが「常にオン」のままになるようになりました。

注:私はプラグインの作者を決して知りません。ちょうど便利だと思いました。

244
dano

Picture of reload menu

  1. を押してChromeデベロッパーコンソールを開きます F12 そして(コンソールを開いた状態で):

  2. ブラウザ上部のリロードボタンを右クリック(または左クリックしたまま)して、[キャッシュを空にしてハードリロード]を選択します。

これは "Hard Reload"を超えてキャッシュを完全に空にするため、JavaScriptなどでダウンロードしたものはキャッシュの使用を避けられます。あなたは設定や何かを台無しにする必要はありません、それは迅速なワンショットソリューションです。

195
JackArbiter

Chromeでページキャッシュを無効にするためのオプションがさらに2つあります

1.レジストリのChromeキャッシュを無効にする

レジストリを開く([スタート] - > [コマンド] - > [Regedit])

を検索します。HKEY_CLASSES_ROOT\ChromeHTML\Shell\open\command

... chrom.exeの後の部分を次の値に変更します。–disable-application-cache –media-cache-size=1 –disk-cache-size=1 — "%1"

例:"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" -disable-application-cache –media-cache-size=1 –disk-cache-size=1 — "%1"

重要: 

  • 後にスペースとハイフンがあります... chrome.exe " 

  • そのままchrome.exeへのパスをそのままに 

  • 行をコピーする場合は、引用符が実際の引用符であるかどうかを必ず確認してください。 

2.ショートカットのプロパティを変更してChromeキャッシュを無効にする

Chromeアイコンを右クリックして、コンテキストメニューから[プロパティ]を選択します。パスに次の値を追加します。–disk-cache-size=1

例: "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" –disk-cache-size=1

重要: 

  • 後にスペースとハイフンがあります... chrome.exe " 

  • そのままchrome.exeへのパスをそのままに

39
user2653348

Chromeの設定を編集したくない場合は、シークレットモードを使用しても同じ結果が得られます。

24
Karl Morrison
  1. F12 DevToolsを開く方法
  2. F1 DevToolsの設定を開く方法
  3. 以下のようにチェックキャッシュを無効にします(DevToolsが開いている間)

これは現在初期設定タブにあります。下にスクロールする必要があるかもしれません。この質問がされてから、このチェックボックスは少なくとも数回移動されました。最後に確認しましたが、一番下の中央の列にありました。薄い画面で開いていて、[設定]の下に2つの列がある場合は、右上近くにある可能性があります。この記事が変更またはコメントされた場合は、この投稿を更新してください。投稿を更新します。

enter image description here

21
Tony L.

キャッシュを無効にするオプション(開発者ツールウィンドウの右下にあるボタンからアクセスできます - [ツール] - [開発者ツール]、または Ctrl + Shift + I)、開発者ツールのネットワークペインで、右クリックしてポップアップメニューから[キャッシュをクリア]を選択できます。

21
Tim Keating

"F5"を押す代わりにを押すだけです。

"Ctrl + F5"

17
Arvand

Canary Channel(そしておそらくdevとstableのチャンネルが続くでしょう)では、これは全体的に "General"セクションの下の左側の2番目のオプションとして見つけられます。

Disable Cache in Chrome Canary Channel

それに加えて、Ctrl + Shift + Nでシークレットモードに切り替えるオプションが常にあります。それでも残念ながらあなたのセッションも終了します。 

17
Bruiser

明確にするために、Chromeのキャッシュを無効にするチェックボックス(ここではv17ですが、v15以降だと思います)はメイン設定のUIにはありません。開発者ツール設定のUIにあります。

  1. ブラウザウィンドウのレンチアイコンメニュー(設定メニュー)から「ツール」→「開発者ツール」を選択します。

  2. 表示される開発者ツールのUIで、右下にある歯車のアイコンをクリックします。

  3. [ネットワーク]セクションの[キャッシュを無効にする]チェックボックスをオンにします。

14
Mason

を使う Ctrl+Shift+R リフレッシュするのはいいことでしたが、必要なものがすべて手に入りませんでした。 jsやcssに格納されているデータなど、まだ更新されないものもあります。解決策を見つけた:a クロムウェブ開発者のためのGoogleのツールバー 。ツールバーをインストールしたら、オプションを選択して「ページをリセット」します。

14
tomermes

クロムでキャッシュを無効にするのは、開発ツールを開いているときだけ機能する

13
jamiethepiper

バグが修正されるまでは、 Clear Cache Chromeプラグインを使用することができ、またキーボードショートカットを設定することもできます。

それをインストールした後、右クリックしてオプションに行きます。

enter image description here

Automatically reload active tab after clearing dataを確認してください。

enter image description here

期間としてEverythingを選択します。

enter image description here

そして、Menu => Tools => Extensionsの順に進みます。

enter image description here

下部にあるキーボードショートカットをクリックします。

enter image description here

キーボードショートカットを設定します。 Ctrl + Shift +R

enter image description here

12

実際に帯域幅を使用しても構わない場合は、キャッシュを無効にすることが複数の理由でより安全であり、多くのセキュリティサイトで推奨されています。

Chromiumは、決定を下してユーザーに設定を強制するのに十分傲慢であるべきではありません。

UNIXでは、--disk-cache-dir =/dev/nullを使用してキャッシュを無効にできます。

これは予期しないクラッシュである可能性がありますが、もしそうなら、それは明らかにもっと深刻なバグを指し示します。

8
Kevin Chadwick

これは誰かに役立つかもしれません。 

私はNginxをクレイジーキャッシングのために装備しました。したがって、ネットワークツールでキャッシュを無効にしたり、明示的にキャッシュをクリアしたりすることはできません。

非常に単純でありながら退屈な回避策は、新しいIncognito Tabを開くだけです。驚いたことに、それは常に動作します!

シークレットモードでのハードリフレッシュは、私が同じモードでリロードしたいときはいつでもトリックを行います。

6
Rexford

ページがキャッシュされないようにページ名を変更するブックマークレットはどうでしょうか。 Chromeでは、新しいブックマークを作成してからコードをURLに貼り付けます。ブックマークをクリックすると、ページがタイムスタンプ付きでリロードされ、キャッシュが無効になります。

javascript:(function(){var idx = location.href.indexOf('?');var d = new Date();var str = location.href.substr(0,idx) + '?version=' + d.getTime();location.href=str; void 0;})();
5
mbokil

捕まったばかりですが、必ずしもChromeが原因ではありません。

私はjQueryを使ってAJAXリクエストをしています。リクエストでcache属性をtrueに設定しました。

   $.ajax({
        type: 'GET',
        cache: true,
        ....

これを false に設定すると問題が解決しますが、これは理想的ではありません。

このデータがどこに保存されているのか私にはわかりませんが、クロムがサーバーにリクエストを送信することは決してありません。

4
DynamicDan

より良い、より速い方法があります(Chromeバージョン59.x.x)。 

(URLフィールドの左側の)reload-iconを右クリックしてドロップダウンメニューを表示し、3番目のオプション 'empty cache and hard reload'を選択します。

このオプションは、開発者ツールが開いているときにのみ利用可能です。キャッシュが空になっていません。

4
Luftwaffle

Clear Cache という名前のchrome Webストアで利用可能なchrome拡張子があります。

私は毎日それを使っていて、それはとても便利なツールだと思います。あなたはそれをリロードボタンとして使用することができ、キャッシュをクリアすることができます、そしてもしあなたがクッキー、ロケールの保存、フォームデータなども好きならまたこれが起こるドメインを定義することができます。あなたがとにかくあなたがとにかく押さなければならないリロードボタンだけでこのたわごとをすべてクリアすることができます - あなたの選ばれたドメインで。

とってもとっても素敵!

また、オプションでキーボードショートカットを定義することもできます。

また別の方法はあなたのクロムウィンドウをシークレットモードで起動することです。ここでキャッシュも完全に無効にされるべきです。

3
chris

一時的にキャッシュを無効にしたり、何らかの方法でページを更新したりして変更を確認できますか。

どの「キャッシュ」を参照しているのかは不明です。 ブラウザがコンテンツを永続的にキャッシュできる方法はいくつかあります。 Web Storage それらの1つであること、 Cache-Control もう1つであること。

オフラインサポートを提供するプログレッシブWebアプリ(PWA)を作成するために、 Service Workers と共に使用される Cache を持つブラウザもあります。

PWAのキャッシュをクリアする

self.caches.keys().then(keys => { keys.forEach(key => console.log(key)) })

キャッシュキーの名前を一覧表示するには、次のコマンドを実行します。

self.caches.delete('my-site-cache')

キャッシュキーを名前で削除します(例:my-site-cache)。その後、ページを更新してください。

更新後にコンソールにワーカー関連のエラーが表示された場合は、登録済みワーカーの登録を解除する必要があるかもしれません。

navigator.serviceWorker.getRegistrations()
  .then(registrations => {
    registrations.forEach(registration => {
      registration.unregister()
    }) 
  })
2
Josh Habdas

キャッシュを無効にするもう1つのオプションは、私の3rd Chrome拡張機能である ページサイズインスペクタ です。これは、Devtoolsとまったく同じ方法でキャッシュを無効にします。

さらに、この拡張機能は、ページサイズ、キャッシュ使用量、ネットワーク要求、およびWebページのロード時間を便利な方法ですばやく報告します。そのオープンソースに加えて Github

Screenshot - Page Size Inspector

2
Tomi Mickelsson

ServiceWorkers を使用している場合(例:プログレッシブWebアプリケーションの場合)、開発ツールの[アプリケーション]> [Service Workers]で[更新時に更新]をチェックする必要があります。

enter image description here

2
Bob

何を使用しているのかはわかりませんが、ASP.Netを使用している場合は、次の操作を実行できます。

<link href="@Url.Content("~/Content/Site.css")[email protected]" rel="stylesheet" />

基本的には、実行されるたびに自動的に日付と時刻がファイルの末尾に追加されます。つまり、ファイル名は技術的に異なるため、再度キャッシュされることを心配する必要はありません。

2
MattE

私は同じ問題を抱えていた、私は試してみました:

  • コントロールシフトR
  • F12でキャッシュを無効にする
  • コントロールF5.

それから、 https以外のサイトに.appcacheマニフェストを使用することは推奨されないことを発見しました 。 私はsite.appcacheファイルとそのhtmlタグ内の参照を削除しました。そして、各ページの最新版を見ました。

1
Ole EH Dufour

あなたのサイトがPHPを使っているのであれば、あなたのhtmlページの始めに次の小さなPHPスニペットを置いてください:

   //dev versioning - stop caching
   $Rand = Rand(1, 99999999);

スクリプトやリンク要素内のCSSファイルやJSファイルなどのリソースをロードする場所はどこでも、「?」を追加した後で、生成したランダム値を要求URLに追加します。 PHP経由でURIにアクセスする:

    echo $Rand;

それでおしまい!あなたのサイトをキャッシュしているブラウザはもうありません - どの種類でも。

もちろん、公開する前にコードを削除するか、または$ Randを空の文字列に設定して再度キャッシュできるようにします。

0
Torsten Barthel

上記の他のオプションを使用しましたが、chrome.exeの起動時に次のパラメータを追加するのが最善の方法です。

"C:¥Program Files(x86)¥Google¥Chrome¥Application¥chrome.exe" --disk-cache-size = 1 - media-cache = 1

メディアキャッシュを無効にしないのは良い考えですが、完全を期すためにここにあります。

実際には、キャッシュを完全に無効にし、ディスクの代わりにIOのメモリを使用するオプション(ロード時間が10倍高速になることもあります)を希望します。その問題にはまだその選択肢があります。

0
Ahmed

ChromeのCacheキラーははるかに最良の選択肢です。キャッシュキラーをインストールするためのストアのURLがダウンしているので、ここでCRXファイルをダウンロードすることができます。

https://www.crx4chrome.com/extensions/jpfbieopdmepaolggioebjmedmclkbap/

拡張機能ファイルがダウンロードされたら、Chrome - >その他のツール - >拡張機能を開き、ファイルエクスプローラまたはデスクトップ(ファイルをダウンロードした場所に応じて)からCRXファイルをクロムウィンドウにドラッグして拡張機能をインストールします。

0
BernieSF

キャッシュが無効になっていることを確認したにもかかわらず、ブラウザがディスクからキャッシュデータを読み込む状況にありました(Chromeを使用していました)。私のすべてのcssとjsはサーバーからロードしていましたが、ウェブページはロードしていませんでした。これは私の地元でもプロダクションでも起きていました。

それを修正するには、私のURLに余分なパラメータを追加してブラウザにサーバーからWebページを取得させる必要があります。コントローラでさえ必要ありません。

私はASP.Netを使っていたので、ここに私の例があります

//Controller function
public ActionResult Index()
    {
        return View();
    }
//Link
@Html.Action("Index", "Home", new { ts = DateTime.Now.Ticks.ToString()})

その結果、それはのようなリンクを生成するでしょう: http://www.myweb.com/Home/Index?ts=636558555408282209

これが私の状況と解決策です。うまくいけば、それは誰かを助けることができます。

0
Jansen

バージョン50以降(私が正しく覚えていれば)、 "キャッシュを無効にする"オプションはDevtool設定から削除されました。 [ネットワーク]タブに移動すると、[キャッシュを無効にする]オプションがあります。

0
boi_echos

このコード文字列をあなたに追加してください。

<meta name="robots" content="noarchive">
0

私は(ウィンドウズで)ctrl + shift + deleteを使い、chromeダイアログが表示されたらEnterキーを押します。このシーケンスを実行するたびにクリアする必要があるものでこれを設定できます。開発者は必要ありません。この場合はツールが開きます。

0
santon