FFMPEG converted mp4 file does not play in firefox and chrome

12
votes

I have used FFMPEG command to convert flv video file to mp4 and use html5 video tag and play video in browser. But after the video is converted to mp4 using ffmpeg it does not play in firefox and chrome browser. It displays a error saying 'No video with supported format and MIME type found'. I have added the code below, Please help.

cmd /C ffmpeg -i INPUT_FILE_PATH -y -ar 22050 -ab 512 -b 800k -f mp4 -s 514*362 OUTPUT_FILE.mp4"
7
htmlffmpeghtml5-video
Can you post the html code? Better yet, a live example link would be very helpful. – brianchirls
Why did you not also include the complete ffmpeg console output? – llogan
I dont have any console output since I am executing ffmpeg in java – stanley
In chrome i dont get to see the video, only audio works – stanley
Are you sure your web server is configured to serve the proper mime type? Also, Firefox is not gonna play mp4 on all platforms. You'll need to fall back to webm. – brianchirls

7 Answers

51
votes

This is what you need. I recently found myself fighting the same problem.

Add this to your command:

-pix_fmt yuv420p

If you don't specify the pix_fmt it defaults to yuv444p which doesn't seem to be compatible with current browsers.

The full command I'm successfully testing with is:

ffmpeg -y -i "INPUT-FILE" -c:v libx264 -preset slow -crf 22 -pix_fmt yuv420p -c:a libvo_aacenc -b:a 128k "OUTPUT-FILE"

Put your input, output paths inside the quotes and try that to get started. Plays in current IE, Firefox, and Chrome. I'm using the built in aac encoder for audio.

3
votes

Are you using latest version of Firefox and Chrome?

Do you installed necessary codecs on your system and browsers?

Older version browsers will have problems of displaying multimedia or MIME contents. Also improper or old codecs will cause problems.

2
votes

I think the issue with your encoding is not FFMPEG or HTML5. It's in the command and libraries that you are using. You should use the "libx264" library to encode MP4 videos for HTML5.

The proper command to use should be.

ffmpeg -i input.mov \
-acodec libfaac -ab 96k \
-vcodec libx264 -vpre slower -vpre main \
-level 21 -refs 2 -b 345k -bt 345k \
-threads 0 -s 640x360 output.mp4

For copy-paste convenience

ffmpeg -i input.mov -acodec libfaac -ab 96k -vcodec libx264 -vpre slower -vpre main -level 21 -refs 2 -b 345k -bt 345k -threads 0 -s 640x360 output.mp4

If you happen to stumble upon missing the x264 codecs, you may install the Zeranoe builds. Refer to this SO page. [ FFmpeg installation for x264 codec ]

More encoding instructions can be found in [ https://trac.ffmpeg.org/wiki/x264EncodingGuide ]

1
votes

Based on the answer of @Unrealist it seems it is a problem of video codec compatibility. You need to check browsers video format support, and then select appropiate audio and video codec in FFMPEG:

HTML5 video codecs browsers support chart

1
votes

The changes I've made to your command line:

  • I've specified the audio codec explicitely so it is AAC-LC.
  • The addition of "-strict -2" to use the experimental AAC-LC codec.

This works for me in both Firefox and in Chrome.

ffmpeg -y -i "INPUT" -ar 22050 -ab 512 -b 800k -f mp4 -s 514*362 -strict -2 -c:a aac "OUTPUT.mp4"
0
votes

I have had similar problems - when combining png/mp3 from one collection, all went fine, but combining jpg/mp3 from another collection couldn't be played in browser but everything worked fine in vlc. I had already found that -pix_fmt was the issue and it worked when re-combining the png collection but not when re-combining the jpg collection, UNLESS using -vf scale as well.

-1
votes

Check for MIMe type support added to your server, that is the problem in your case as error displaying there ' It displays a error saying 'No video with supported format and MIME type found'. As for your info there is no support for MP4 MIME type added in IIS 7 which you have to add by changing its web.config file in the given way..

<configuration>
   <system.webServer>
      <staticContent>
         <mimeMap fileExtension=".mp4" mimeType="video/mp4" />
      </staticContent>
   </system.webServer>
</configuration>

hope this will give insight in your problem.