cache-control: no-storeが効かないケースがある

Firefoxで以下の場合にcache-control: no-storeが効かない。

  • htmlが1.cssを呼び出し、1.cssは2.cssをimportしている
  • 1.cssにはmax-ageなどを指定してキャッシュさせる
  • 2.cssにはno-storeを指定してキャッシュさせない

こうすると1.cssのキャッシュが有効な間は、2.cssのno-storeが効かずサーバにリクエストが走らない。

sinatraで以下のようにサーブする。

require 'sinatra'

get '/' do
  erb :index
end

get '/1.css' do
  content_type 'text/css'
  cache_control :public, :max_age => 30
  "@import url(2.css); html { font-family: sans-serif; }"
end

get '/2.css' do
  content_type 'text/css'
  cache_control :no_store

  r = rand(256)
  g = rand(256)
  b = rand(256)
  "html { color: rgb(#{r},#{g},#{b}); }"
end

これがFirefoxアクセスログ、1.cssのキャッシュが生きている間はページをリロードしてもno-storeが指定されている2.cssへリクエストが走っていない

こちらはChromeアクセスログ、ページをリロードする毎に2.cssへリクエストが走っている

chromeの挙動が正しいように思うが、こんなエッジケース想定されていないだろうし実際のところは分らない。ただ、一般的にCSSファイル毎にcache-controlを変えたりしないので問題になることはないと思われる。