Nilesh D Kapadia

Jekyll and WEBrick with HTML5 audio

I am working on a site that uses Jekyll and also HTML5 audio. When running the server locally (which uses WEBrick), I had issues with playing OGG files using HTML5 audio (MP3 files would play at least in Safari, OGG files would not play in Firefox). Though the GET request to the server was being received, the browser simply wouldn’t play the music files.

It turns out that certain MIME types are required, at least for OGG files. OGG files should be audio/ogg and MP3 files should be audio/mpeg. WEBrick’s default configuration did not include these mime types, and Jekyll did not add them.

To configure this for Jekyll, I edited the jekyll’s startup script like this:

  mime_types = WEBrick::HTTPUtils::DefaultMimeTypes
  mime_types.store 'js', 'application/javascript'

# START mime type edit
  mime_types.store 'mp3', 'audio/mpeg'
  mime_types.store 'ogg', 'audio/ogg'
#  mime_types = WEBrick::HTTPUtils::load_mime_types('/etc/apache2/mime.types')
# END mime type edit

  s = HTTPServer.new(

This adds the mime types for MP3 and OGG files to the default mime types. Alternatively, you could use the commented-out line that uses load_mime_types to load Apache’s mime.types file. Note that this will completely ignore WEBrick’s defaults and use whatever is in Apache’s mime.types file (or whatever file you point it to). The version of that file in my Apache2 installation did have the necessary mime types.