No video with supported format and MIME type found

Question

I have the next code in my index for a video:

<video width="100%"  controls>
  <source src="video/v1.ogv" type="video/ogg">
  <source src="video/v1.webm" type="video/webm">
  <source src="video/v1.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>

When i try to load it in firefox it will return "No video with supported format and MIME type found."

Firebug will return

"NetworkError: 500 Internal Server Error - https://root/folder/video/v1.ogv"

v1.ogv

HTTP load failed with status 500. Load of media resource https://root/folder/video/v1.ogv failed.


...,c=l.length;c--;)(f=l[c])&&(v[d[c]]=!(y[d[c]]=f));if(i){if(o||e){if(o){for(l=[],...

jquery.min.js (line 2)

"NetworkError: 500 Internal Server Error - https://root/folder/video/v1.webm"

v1.webm

HTTP load failed with status 500. Load of media resource https://root/folder/video/v1.webm failed.

Specified "type" attribute of "video/mp4" is not supported. Load of media resource video/v1.mp4 failed.

All candidate resources failed to load. Media load paused.

Any clue? It's not working in Google Chrome neither.

Answer 1

Are the paths valid?

• https://root/folder/video/v1.ogv
• https://root/folder/video/v1.webm

Firefox doesn't support .mp4 files which explains the Specified "type" attribute of "video/mp4" is not supported. error.

If you are using Apache, you can force it to use the correct MIME type. Add the following to your .htaccess file.

# MIME types for Video
AddType video/mp4 mp4 m4v f4v f4p
AddType video/ogg ogv
AddType video/webm webm
AddType video/x-flv flv

Answer 2

@Gonzalo- As @Daniel has pointed out in his answer - make sure that /video folder in source tag is accessible. For example - you are accessing your page at

https://abcdomain/approot/somepage

and assuming that you have this video folder inside approot, then you need to modify the source tag and it would be something like -

<source src="/approot/video/v1.ogv" type="video/ogg">

Hope, this helps.