Quick and dirty fix for the infamous Safari blank-page bug

For those of you who don't know yet, Safari has a nasty bug that can lead to any page on your website becoming eventually invisible if your server correctly responds with a 304 under some circumstances.

Go ahead, google it, you'll find the entire test case and you'll see a lot of people complaining about it since last year. There were a few Safari updates in all that time, but for some reason Apple seems to have done nothing about it... yet...

I had no idea about it until recently when I've noticed odd things happening while working on interiordelight.ro.

Naturally, since it's a portfolio website, we have quite a few pages that don't change between subsequent requests, and Express.js is smart enough to respond with 304 when necessary. Which is fair and civilised, but if you're using Safari and press Cmd+R a few times, you'll end up looking at a blank page, with no other way of repairing than clearing the cache and restarting the browser. And you can't ask your visitors to do that.

Here's the quick & dirty workaround you can apply site-wide in an Express.js - based application, in CoffeeScript:

app.all '*', (req, res, next) ->
  agent = req.headers['user-agent']
  if agent.indexOf('Safari') > -1 and agent.indexOf('Chrome') is -1 and agent.indexOf('OPR') is -1
    res.header 'Cache-Control', 'no-cache, no-store, must-revalidate'
    res.header 'Pragma', 'no-cache'
    res.header 'Expires', 0
  next()

Basically the above code will punish Safari browsers by instructing them by any means not to cache the content.

I'm sorry to do something like this because I really like Safari's speed, but there's not much else we can do until Apple developers do their jobs as they were supposed to...