修正したはずの内容がブラウザに反映されていない。クライアントとわれわれのブラウザで表示されている内容が異なる。この現象はブラウザのキャッシュ（cache）によって発生し、クライアントとのコミュニケーション時に問題になることが度々ある。
これを回避するには、app.css?ver=1.0.1のようにパラメーターを付与し、作業する度にバージョンも更新する必要がある。この手法で解決はするが、ちょっとした修正の確認を他の人に依頼する際もバージョンを更新しなくてはならず手間だ。
また、ファイル数が多くなった場合に手動での運用は現実的でなくなるため、これまでの対応としては、「画面が更新されない場合はキャッシュをクリアしてご確認ください」、と依頼するか、ページ数が少ない、もしくはインクルードされている場合に限りパラメータを付与するような対応になっていた。
これは以前から問題に感じており、数年前に解決を試みたときは、結果実装できずに終わっていた。しかし、今回あらためてこの問題がエンジニア陣の情報共有ミーティングで議題にあがったため再度挑戦したところ、Node.jsを用いて短時間で実装できた。head内で呼ばれているファイルくらいであれば、更新されるたびにパラメータを自動更新できる。リアルタイムの監視が不要な場合は単発での処理が可能だ。
今回実装できた理由としては、以前、業務とは別で社内から「ファイルの監視・編集」を行う必要がある要望がでた際に、今回と似た実装を経験しており、そのノウハウを応用できたからだ。
普段はUIを操作するJavaScriptを記述しているため、扱う対象がファイルに変わるだけで難しく感じたが、実際は実装の難易度の問題ではなく、単に知識量が足りなかっただけだろう。
今回のように1度でも経験しておくと知識になり解決できる課題が増えるので広い分野に手を付けておくことは大事だと思う。
