Geek Answers Handbook

How to embed a .h264 video file in an html page using video tags

I am trying to play a .h264 file in a browser, trying to accomplish this using html HTML tags. The result is always an empty frame.

I checked some links on the Internet, they recommend playing the video in a .mp4 container.

Can someone help me with this?

UPDATED CODE:

<video width="560" height="340" preload controls> <source src="hh.h264" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'> <!--<source src="hh.mov" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' /> <source src="hh.ogv" type='video/ogg; codecs="theora, vorbis"' /> <source src="hh.webm" type='video/webm; codecs="vp8, vorbis"' />--> </video>

Literature:

How to play H264 video?

Play the .h264 webplayer file

http://www.htmlgoodies.com/html5/client/how-to-embed-video-using-html5.html#fbid=6u-u00TH7Je

+7
html5 html5-video video-streaming mp4
source share
3 answers

You do not need to include h.264 in your html code, you only need to specify the path to your video file and the name of the video file. So, let's say your video file is.mp4, and your file name is myvideo.mp4 , and your myvideo.mp4 is in a folder called videos , and your html file is outside this videos folder in the project folder, then this is what you need to do :

 <video width="560" controls> <source src="videos/myvideo.mp4" type="video/mp4"> </video>

This will work if your video is encoded in mp4 format. H264 is a codec, and in this situation it is completely irrelevant.

First you have to find the mp4 encoder on the network, there are many free encoders, encode your video to .mp4, then use the html code above and your video will play perfectly.

0
source share

The .h264 file contains the H.264 source stream, which is not directly supported in browsers. You can use a tool like FFmpeg to put it in a container, like other recommended answers:

ffmpeg -f h264 -i test.h264 -c:v copy test.mp4

Edit:

If you need to play the raw H.264 byte stream, you need a browser plugin. Example for VLC web plugin:

<embed type="application/x-vlc-plugin" pluginspage="http://www.videolan.org" target="test.h264" />

+2
source share

I wrote an HTML5 video player around a wide format h264 codec (emscripten) that can play real-time video (no delay) h264 in all browsers (desktop, iOS, ...).

The video stream is sent via websocket to the client, the decoded frame per frame and displayed in the bank (using webgl for acceleration)

Check out https://github.com/131/h264-live-player on github.

+1
source share

More articles:


All Articles