連載
» 2022年02月09日 05時00分 公開

【Google Chrome】素早くキャッシュをクリアしてページを正しく表示させるGoogle Chrome完全ガイド

WebブラウザでWebページが正しく表示されない原因の一つに、Webブラウザのキャッシュが悪影響を及ぼしていることが挙げられます。Windows OS/macOS版Google Chromeで、そのキャッシュを素早く消去しつつページを再読み込みしてトラブルを解消する方法を紹介します。

[島田広道デジタルアドバンテージ]

この記事は会員限定です。会員登録(無料)すると全てご覧いただけます。

「Google Chrome完全ガイド」のインデックス

連載目次

明らかにレイアウトが乱れているWebページ。再読み込みボタンを押しても直らない…… 	ブラウザのキャッシュが悪さしているのかも…… Chromeで素早くキャッシュをクリアしてページを正しく表示させる

Webページの表示がおかしいのはブラウザキャッシュのせい!?

 インターネット上のWebページを見て回っていると、しばしば表示内容が明らかに乱れたページに遭遇することがあります。またWebページ制作に関わっているなら、Webサーバ側で画像などを更新したのにWebブラウザで見ると更新されてない、という経験をしたこともあるでしょう。

 こうしたトラブルの原因の一つとして、Webブラウザのキャッシュ機能が挙げられます。この場合のキャッシュとは、WebブラウザがWebサーバから読み込んだファイル/データをローカルコンピュータのディスクなどに蓄えておき、再利用できるようにすることでページ表示速度を高める機能です。

 しかし、Webサーバとキャッシュの間で同一であるはずのデータが(何らかの問題により)食い違ってしまうと、ページ表示が乱れてしまうことになります。

 本稿ではWindows OS版およびmacOS版Google Chrome(以下、Chrome)を対象として、素早くキャッシュを消去してページの表示の乱れを改善する方法を紹介します。

Chromeの設定画面でキャッシュを消去するのは面倒

 Chromeでキャッシュを消去するには通常、Chromeの設定ページにある[閲覧履歴データの削除]ダイアログを呼び出す必要があります。マウス操作で呼び出すには、メニューボタン−[設定]−[詳細設定]−[プライバシーとセキュリティ]−[閲覧履歴データの削除]、というようにステップ数が多く、面倒です(手順の詳細は本連載の「Google Chromeに蓄えられた閲覧履歴やパスワードを消去・削除する」を参照してください)。

 キーボード操作なら、以下のショートカットで対象のダイアログを呼び出せます:

  • Windows OS: [Shift]+[Ctrl]+[Delete]キー
  • macOS: [shift ⇧]+[command ⌘]+[delete ⌫」キー

 ただし、その後に表示されたダイアログで複数のチェックボックスやプルダウンリストボックスを設定しなければならず、素早くできるとは言い難いものとなっています。そのうえ、うっかり誤って閲覧履歴やCookieまで削除してしまう恐れもあります。

「閲覧履歴データの削除」ダイアログを開いてキャッシュをクリア 1.Windows OSなら[Shift]+[Ctrl]+[Delete]キー、macOSなら[shift]+[command]+[delete]キーを押すと、このダイアログが表示されます 2.このようにタブとプルダウンリスト、チェックボックスを選択 3.[データを削除]ボタンをクリック 「閲覧履歴データの削除」ダイアログを開いてキャッシュをクリア

「ハード再読み込み」ならキャッシュは利用されない?

 ChromeでWebページを開いた後、次のキー押すと「ハード再読み込み」が実行されます。

  • Windows OS: [Shift]+[Ctrl]+[R]キーまたは[Shift]+[F5]キー
  • macOS: [shift ⇧]+[command ⌘]+[R]キー

 これは、対象のWebページに載っている画像あるいは各種ファイル(CSSやJavaScriptなど)を、キャッシュを使わずにWebサーバからダウンロードしつつ、再読み込みをする機能です。つまり、前述のキャッシュ消去をしなくても、キャッシュのトラブルを回避できそうです。

 しかし、この機能でも、対象ページに直接由来していない(間接的に読み込まれる)ファイル/データについては、キャッシュが利用されてしまいます。つまり完全にキャッシュを無視するわけではありません。

キャッシュを消去しつつ「ハード再読み込み」を実行するには

 実は、キャッシュの消去と「ハード再読み込み」を一緒に実行する方法があります。それにはまず、次のキーを押してChrome内蔵の「デベロッパーツール」を起動します。

  • Windows OS: [Shift]+[Ctrl]+[J]キーまたは[F12]キー
  • macOS: [option ⌥]+[command ⌘]+[I]キー

 次に、ブラウザウィンドウのアドレスバー(オムニボックス)左側にある再読み込みボタンを右クリックまたは長押しクリックします。するとメニューが表示されるので、[キャッシュの消去とハード再読み込み]をクリックします。

Copyright© Digital Advantage Corp. All Rights Reserved.

RSSについて

アイティメディアIDについて

メールマガジン登録

@ITのメールマガジンは、 もちろん、すべて無料です。ぜひメールマガジンをご購読ください。