Webページの更新が反映されない！？確認すべきポイントと解決方法を紹介

2022年1月26日 2022年1月31日

こんにちは！CODE CLUB965のKです！

ソースコードを変更したのに、「Webページが更新されない！」という経験をしたことはありませんか？

今回は、Webページを更新したのに反映されないときの確認すべきポイントを紹介します。

今のところ経験をしたことがない方も、今後必ず経験するときがくるので今回の記事の内容は覚えておくと良いと思います。

Webページが更新されないワケ

「変更したのに画面が変わらない・・・。」、とても不思議ですが、大抵の場合、理由はキャッシュです。

キャッシュとは、画面表示の高速化のために、Webブラウザが持っている機能のことです。

同じページを複数回表示するにあたり、毎回、サーバーからデータを取得していたのでは、画面を表示するのに時間がかかってしまいます。

そこで、キャッシュの仕組みがあります。

サイトに一度アクセスをしてデータを取得したら、それを保存しておきます。
そして、再度同じサイトにアクセスしたら、サーバーからデータを取得するのではなく、保存していたデータを使って画面を表示するようになります。

サーバーと通信をせずに、元々持っていたデータを使って画面を表示するので、当然、画面表示の時間は短くなります。

このようにして、画面表示を高速化する仕組みがキャッシュです。

しかし、困った面もあり、それが「サイトを更新したのに、画面が変わらない」という場面です。

これは、キャッシュが機能してしまい、サイトに最新の情報を取得していないために起こる事象です。

動作確認においては、二通りの手段があります。

一つ目が、キャッシュされたデータを削除する方法です。
キャッシュされたデータがなくなるので、ブラウザは最新のデータをサーバーから取得します。

結果、最新のデータでサイトを表示することができます。

キャッシュの削除は、大抵のブラウザの「設定」から実施できます。

二つ目の方法は、ブラウザのスーパーリロードをすることです。

スーパーリロードをすることで、キャッシュを使わずに画面を表示することができます。

スーパーリロードはどのWebブラウザでも機能が提供されています。

例えば、MacのChromeでは、「command + shift + R」でスーパーリロードができます。

WindowsのChromeでは、「shift + F5」です。

どのWebブラウザでも提供されている機能なので、必要に応じて実施方法を調べて、実施してみてください。

今回は、キャッシュについて書きました。

自分で動作確認をする分には、キャッシュを削除したり、スーパーリロードをすれば良いので、更新されない問題は解決できますが、一般ユーザーは解決ができないですよね。
まさか、ユーザーに「キャッシュを削除して下さい」と言うわけにもいかないですよね。笑

しかし、そこは開発の仕方で、キャッシュ問題をクリアすることもできます。
実は既に記事にしていますので興味がある方はご覧ください！

それでは、また！

Follow me!