How do I solve following HTML5 video error: HTTP "Content-Type" of "text/plain" is not supported

Problem:

When trying to play a video using the HTML5 tag in a web page being programmed, the video plays fine when running the file locally in Firefox. However, when running the web page using Apache, an error like the following comes up in the console:

HTTP "Content-Type" of "text/plain" is not supported. Load of media resource http://127.0.0.1/path/to/video.webm failed.

The videos are encoded properly, so they are not the issue.

Solution:

This error is happening as Apache isn't reporting the MIME type of the video files correctly. To solve this, add the following lines to the relevant .htaccess file that covers (at the very least) the folders of the videos that will be played:

AddType video/webm .webm
AddType video/ogg .ogv
AddType video/mp4 .mp4

Notes:

Alternatively, the proper MIME types can be placed into the appropriate configuration file for Apache. This solution is particularly relevant if your web server is set up to ignore .htaccess files.