たった4操作でChromeで特定ページのキャッシュを一時的に無効にする方法 - 適宜覚書-Fragments

たった4操作でChromeで特定ページのキャッシュを一時的に無効にする方法

      2016/05/18

Webブラウザは、一旦開いたWebコンテンツを次回開くときに無駄なく迅速に開けるよう一時ファイル(キャッシュ)を保存します。非常に便利な機能で、これがあるおかげでネットワークやPCのリソースを効率的に使い、快適なWeb閲覧が出来ています。

しかし、一方で困ったところもあります。そのコンテンツが頻繁に内容が更新されたりする場合、或いは全く新規に読み込みたい場合、古いキャッシュを使うのでは困ってしまいます。大抵の場合問題になるようなことはありません。でも、例えばWebページの挙動を見るために素のキャッシュの無い状態を使いたい場合なんかはキャッシュを使わないようにしたいですね。

簡単に出来ます!それもたった4操作でChromeで特定ページのキャッシュを一時的に無効にすることが出来ます。

たった4操作でChromeで特定ページのキャッシュを一時的に無効にする方法

素のChromeの機能で出来ます。

  1. F12キーを押下してデベロッパーツールを開きます。(Ctrl+Shift+IやCtrl+Shift+JでもOK)
    Chromeデベロッパーツール

    Chromeデベロッパーツール

  2. F1キーを押下し、オプション画面を開きます。
    デベロッパーツールのオプション

    デベロッパーツールのオプション

  3. 「Disable Cache(while DevTools is open)のチェックボックスをオンにします。
    デベロッパーツールを開いている間キャッシュ無効

    デベロッパーツールを開いている間キャッシュ無効

  4. F5キーでそのページを更新します。すると、キャッシュ無しの状態でそのページを読み込みます。

この機能はデベロッパーツールが開いている間だけ一時的に有効です。

一時的なキャッシュ無効を止めるには

  1. F12キーを押下して、デベロッパーツールを閉じます。これで機能は無効になります。
  2. F5キーを押下すると再読み込みをしてキャッシュを保存します。

ちなみに先ほど設定したチェックボックスはオンのままなので、次回以降はF12でデベロッパーツールを開いて、F5で再読み込みするだけでまた一時的なキャッシュ無効状態に出来ます。逆に言えば、チェックボックスをオンにしたことを忘れてしまって「あれあれ?キャッシュされないぞ?なんでだー!!」なんてことになるのが困るのであればチェックを外してからデベロッパーツールを閉じてください

実はたった3操作でも出来るキャッシュ消去

先程の操作は無効化です。デベロッパーツールを開いている限りはキャッシュしません。そこまでしないでも、とりあえず当座のキャッシュ消去出来ればいい…という場合はたった3操作です。

  1. F12キーを押下してデベロッパーツールを開きます。(Ctrl+Shift+IやCtrl+Shift+JでもOK)
  2. 再読み込みボタンを右クリックする。
  3. 表示されるメニューで「キャッシュの消去とハード再読み込み」を選択します。
    キャッシュの消去とハード再読み込み

    キャッシュの消去とハード再読み込み

終わりに

デベロッパーツールは本当に色々出来ますね。オプション画面には他にも色々気になるオプションがありますよね。キャッシュ無効のすぐ下にはJavascriptの無効化があったり…(こちらは、デベロッパーツールを開いている時だけではないので設定する際要注意です)。

まあCtrl+Shift+Nを使ってシークレットモードにしたら1操作でキャッシュ無効になるんで手数だけなら、こっちの方が早いという身もふたもないことに書き終わった後で気付いたのですが、多分これ使いようだと思うんですよね。

適宜覚書-Fragmentsは、筆者が興味をもった様々な情報やネタを筆者が忘れても後で思い出せるよう覚書として公開するBlogです。Google Chrome拡張、Facebook、Google、Twitter、Windows、各種Webアプリなどを扱うことが多いです。この覚書が、もし何かお役立ちになれば幸いです。

 - Tips, ツール , , ,