Convert AVI into H.264 that works inside an HTML5 Video tag

7

2

I would like to convert an existing black and white AVI into an H.264 video that works inside an HTML5 video tag.

I'm currently using this ffmpeg command:

ffmpeg -i file.avi -y -c:v libx264 file.h264

This command does not work for me. It does produce the H.264 file, but it does not play anywhere else other than VLC player.

SF Developer

Posted 2014-05-07T14:00:48.390

Reputation: 173

Answers

16

.h264 is just a raw H.264 bytestream. That's just video content, which can be played back by sophisticated players, but usually you want to put everything into a container format, such as MPEG-4 Part 14 ("MP4").

So, run:

ffmpeg -i file.avi -c:v libx264 -pix_fmt yuv420p file.mp4

For HTML5 progressive download you may want to move the moov atom of the MP4 container to the beginning of the file, which allows instant playback:

ffmpeg -i file.avi -c:v libx264 -pix_fmt yuv420p -movflags faststart file.mp4

You may be interested in: What is a Codec (e.g. DivX?), and how does it differ from a File Format (e.g. MPG)?

slhck

Posted 2014-05-07T14:00:48.390

Reputation: 182 472

The MP4 output does not run on either an HTML5 Video tag or Windows Media Player. When I ran your command, I get a yellow message that says "Deprecated pixel format used, make sure you did set range correctly. No pixel format specified, yuvj444p for h.264 encoding chosen. Use -pix_fmt yuv420p ..which I used and now I can see the video on an HTML5 video tag. – SF Developer – 2014-05-07T14:31:16.077

Yeah, that's why they have the message there. In the future, please post the full command line output of your ffmpeg commands too, not just the command itself. Then I would've probably told you that you needed to change the pixel format due to the non-standard input you have. – slhck – 2014-05-07T14:34:57.533

My current scenario is this: the video is created on a local client machine and converted to h264 for compression, quality and SIZE (since I have to upload it via an API to the server). The 70Mg avi becomes 100K h264 video compared to a 1MG mp4 (so for upload reasons it's good to first convert it as h264 and then on the server to final mp4).

I wonder if the command -i file.avi -y -c:v libx264 file.h264 I ran on the client should be different ...knowing that I will need to reconvert it on the server to mp4. – SF Developer – 2014-05-07T14:36:27.977

The MP4 container only gives you an overhead of a few percent in size, not 100k for the H.264 video vs 1MB for the same video in a container. I think you're doing something wrong. Encode everything to MP4 -- you'll have it much easier handling the files afterwards. – slhck – 2014-05-07T14:39:57.793

I'll try that ...thanks for the help. and yes i'll upload the entire output next time. Much appreciated !! – SF Developer – 2014-05-07T14:40:44.063

Just one last tip: Please read the x264 guide here https://trac.ffmpeg.org/wiki/x264EncodingGuide -- it contains useful info on setting the quality.

– slhck – 2014-05-07T14:41:59.163

I will...thanks you saved my day :--) – SF Developer – 2014-05-07T14:49:39.160