Set Charset to UTF-8 on html pages for Middleman blog site

StackOverflow https://stackoverflow.com/questions/20938963

Question

I have a Middleman blog hosted on Heroku (http://tomgillard.herokuapp.com) and have been trying to optimise it based on google's PageSpeed recommendations. One recommendation is that I provide a character set on the site's HTML pages.

HTML pages contain the html5 <meta charset="utf-8"> in the <head> but this doesn't seem to be enough os I thought I could set it server side.

Here is my config.ru

require 'rack/contrib'

# Modified version of TryStatic, from rack-contrib
# https://github.com/rack/rack-contrib/blob/master/lib/rack/contrib/try_static.rb

# Serve static files under a `build` directory:
# - `/` will try to serve your `build/index.html` file
# - `/foo` will try to serve `build/foo` or `build/foo.html` in that order
# - missing files will try to serve build/404.html or a tiny default 404 page

module Rack

  class TryStatic

    def initialize(app, options)
      @app = app
      @try = ['', *options.delete(:try)]
      @static = ::Rack::Static.new(lambda { [404, {}, []] }, options)
    end

    def call(env)
      orig_path = env['PATH_INFO']
      found = nil
      @try.each do |path|
        resp = @static.call(env.merge!({'PATH_INFO' => orig_path + path}))
        break if 404 != resp[0] && found = resp
      end
      found or @app.call(env.merge!('PATH_INFO' => orig_path))
    end
  end
end

# Serve GZip files to browsers that support them
use Rack::Deflater

# Custom HTTP Headers
use Rack::ResponseHeaders do |headers|
  headers['Charset'] = 'UTF-8'
end

#Custom Cache Expiry
use Rack::StaticCache, :urls => ["/img", "/css", "/js", "/fonts"], :root => "build"

# Attempt to serve static HTML file
use Rack::TryStatic, :root => "build", :urls => %w[/], :try => ['.html', 'index.html', '/index.html']

# Serve 404 messages:
run lambda{ |env|
  not_found_page = File.expand_path("../build/404.html", __FILE__)
  if File.exist?(not_found_page)
    [ 404, { 'Content-Type'  => 'text/html', 'Charset' => 'UTF-8' },   [File.read(not_found_page)] ]
  else
    [ 404, { 'Content-Type'  => 'text/html', 'Charset' => 'UTF-8' }, ['404 - page not found'] ]
  end
}

I thought I could use Rack::ResponseHeaders from rack-contrib but I don't think I'm using it correctly;

# Custom HTTP Headers
use Rack::ResponseHeaders do |headers|
  headers['Charset'] = 'UTF-8'
end

Like I said, I've searched high and low; consulted docs (Rack, heroku), SO questions, blog posts, github, you name it.

Any help with this is much appreciated.

Cheers, Tom

Was it helpful?

Solution

I had a similar problem and wanted to optimize my site. You just need to manually set your Content-Type header.

Here's my complete config.ru which achieves a 98/100 on Google PageSpeed (it complains about not embedding my css in the page):

# encoding: utf-8
ENV['BUNDLE_GEMFILE'] ||= File.expand_path('../Gemfile', __FILE__)
require 'bundler/setup' if File.exist?(ENV['BUNDLE_GEMFILE'])
require 'rack/contrib'

require File.expand_path("../rack_try_static", __FILE__)

use Rack::ResponseHeaders do |headers|
  headers['Content-Type'] = 'text/html; charset=utf-8' if headers['Content-Type'] == 'text/html'
end
use Rack::Deflater
use Rack::StaticCache, urls: ["/images", "/stylesheets", "/javascripts", "/fonts"], root: "build"
use ::Rack::TryStatic,
  root: "build",
  urls: ["/"],
  try: [".html", "index.html", "/index.html"]

run lambda { [404, {"Content-Type" => "text/plain"}, ["File not found!"]] }

You'll also need to add rack-contrib to your Gemfile for Rack::StaticCache:

gem 'rack-contrib'

You'll also want my rack_try_static.

Edit: Note the current implementation of Rack::StaticCache removes Last-Modified and Etag headers and will break on assets ending with a - followed by a number. I have PRs open for both of these (83 and 84).

OTHER TIPS

This no longer applies as I have moved my blog from heroku to github pages. Thanks for looking.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top