cssやjsや画像の変更が適用されない…。原因はCloudFlareだった!

私にとってはつい昨日の出来事だが、君達にとっては多分、明日の出来事だ

 

昨日、phpテンプレートのファイルを修正したり、画像を圧縮して置き換えたりしたものの、

何度も更新をしても何故か変更が適用されないことに気付く。。

 

キャッシュの問題…?と思った瞬間にふと、ふとよぎる。

 

そういえば、一昨日cloudFlareを導入したんだった…。

 

 

cloudFlareとは?

 

サーバーの負荷を和らげ、Webページの表示速度を速めてくれるものです!

上記の記事を参考に!

 

cloudFlareのおかげで4時間キャッシュが残り続ける

 

サイト表示高速化のために、初期設定だと4時間キャッシュが残り続けているようです。

 

なので、

①サイトの編集時には「development Mode」にしてから作業をする事

②最後に「purge Cache」を押し、キャッシュをクリアする事

こちらの2点で解決できます!

 

「development Mode」で解決!

 

development mode 手順①

 

①まずは、cloudFlareのサイトにログイン!

②その後、「websites」をクリックし、上記画像を参考にdevelopment modeにしたいサイトの歯車のマークにオンマウスし、「Development Mode」をクリック!

 

以上!

 

しかも、この開発モードは3時間後に自動的にオフになって再びCloudFlareを利用している状態になるため、後で設定を戻す必要はありません。

 

そして、最後に「Purge Cache」でキャッシュをクリア!

 

cloudflare purgecache 手順①

 

 

①上記と同様に、サイトにログイン後、「purge cache」したいサイトの歯車マークの上にオンマウス!

その後、CloudFlare Settingsをクリック!

 

cloudflare purgecache 手順②

②その後、下にスクールし、「Purge Cache」ボタンをクリック!

 

以上!

 

 

これできっと、即座に変更が適用されるようになるかと思います!

 

ある意味諸刃の剣的なCloudFlareですが、

付き合い方を知ればなんてこともありません!