Nginx and HTML5 Video in Firefox

Recently I moved my site to a new VPS run by me, the whole process went smoothly and after removing a few server specific .htaccess commands the site was up and running again.

I noticed however that the HTML5 video files that I have been using on a trial basis had stopped working with a big X in the middle of the video frame, but only in Firefox.

This indicates many possible problems with the video, some of which I could immediately dismiss as the file worked fine and other browsers such as Chrome had no issues playing it.

I remembered that it’s important to make sure the mime types are set correctly in apache, easily done with a modification of the .htaccess file in the site’s root directory, however I already had them in place, after trying different things I finally realised that nginx was serving the files directly so I did the following steps:

Open up the Nginx mime type configuration file, eg: /etc/nginx/mime.types
Paste these lines after the last video mime type, in my case it was avi:

    video/ogg                             ogm;
    video/ogg                             ogv;
    video/ogg                             ogg;

Restart nginx, it should then serve ogg video correctly to Firefox users.