HTML5 video is playing in particular site but not

2019-06-14 05:54发布

问题:

I have a mp4 video which is downloaded from some external site. The video is playing well in that tutorial site. But not in my site. This issue is only in ie9 browser.

source

<!DOCTYPE html>
<html>
<body>

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

</body>
</html>

I have downloaded the mp4 file and also ogg file which is not important for the ie9. In the following link the video is working fine.

http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_video_all

The same source and videos only i'm using but the video is not playing.I have checked the permissions also. Please help me to resolve this problem

回答1:

First load up the page and press F12 to bring up the developer tools , then pop over to the console tab in the console , get reference to the video object using the script below (If the video element is not the first video element then you will need to adjust the array value ).

document.getElementsByTagName("video")[0].error.code The code that is returned let you know what’s gone wrong,

MEDIA_ERR_ABORTED : 1 The fetching process for the media resource was aborted by the user. MEDIA_ERR_DECODE : 3 An error has occurred in the decoding of the media resource, after the resource was established to be usable. MEDIA_ERR_NETWORK : 2 A network error has caused the user agent to stop fetching the media resource, after the resource was established to be usable MEDIA_ERR_SRC_NOT_SUPPORTED : 4 The media resource specified by src was not usable. In IE9 if you get error code 4 then there are two common issues:

INCORRECT ENCODING

IE9 supports H.264 in an MP4 container and WebM if the user has the codec installed on their machine. To support IE9 you will need to ensure that you have correctly encoded your video. For H.264 video I use Miro (a .net application on windows that wraps up FFMPEG) or if I want a specific baseline or setting I use Expression Encoder.

DIRECTORY

Are you placing the media files in the same directory holding this html? If not, set right path to files.

MIME TYPE

You need to make sure your sever returns the correct MIME type when it returns a file. If the file is MP4 then the files MIME type should be video/mp4. If you want to check the MIME type then use the F12 developer tools (press F12 in IE9) and then navigate to the Network Tab. Press Start Capturing and refresh the web site.

GOOD LUCK



回答2:

Finally i make my video work by the following way.

I found the problem by using the Jef Rechards and nmaier answers. I have faced two problems

1) My video was encoded with mpeg4 instead of h264. So i have encoded using ffmpeg libx264 codec .

2) The mime type of my video was text/plain even given the type="video/mp4" in video source. I have added the mime type by added the following code in my .htaccess file

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

Now the video is playing well in ie9



回答3:

Ok, this is just guessing, but in order for html5 video to play, the server needs to serve the files with the correct MIME or IE9 (and other browsers) will refuse these files.

MSDN:

Beginning with Internet Explorer 9, any audio or video content needs the correct mime type set on the server, or the files won't play.

MDN:

If the MIME type for the video is not set correctly on the server, the video may not show or show a gray box containing an X (if JavaScript is enabled).