Chrome Does Not Play Mp4

Chrome won't play .mp4 file

Browsers like Internet Explorer and Safari support .H264 codec which plays mp4 files. Firefox support Theora codec which plays .ogv files. Chrome supports both .H264 and Theora. But to make your video works across all browser you need to encode your mp4 video into different formats using application like HandBrake. Then amke your code :

<video id="headervideo" controls>
    <source src="<?php echo base_url(); ?>assets/home.mp4" type="video/mp4">
    <source src="<?php echo base_url(); ?>assets/home.webm" type="video/webm">
    <source src="<?php echo base_url(); ?>assets/home.ogv" type="video/ogg">
    Your browser does not support the video tag.
</video>

and also change your .htacess file to support videos

AddType video/mp4 mp4 m4v
AddType audio/mp4 m4a 
AddType video/ogg ogv
AddType audio/ogg ogg oga
AddType video/webm webm

Chrome does not play MP4

Are you using Google Chrome or Chromium on Ubuntu, as a matter of interest? Either way the issue may be that MP4 support has not been enabled.

To enable it you need to install the support for mp4 codec:

sudo apt-get install chromium-codecs-ffmpeg

The reason for this is that some codecs are not fully open source, because they may be subject to patents for example, and hence they can't be included in a fully open source release.

See some discussion and references:

https://github.com/videojs/video.js/issues/675
https://launchpad.net/ubuntu/precise/+package/chromium-codecs-ffmpeg-extra

HTML5 video player some mp4 files not playing chrome

So oddly enough I managed to solve the issue, though I still don't understand why.

I noticed another problem I had with my server is my non ability to seek a certain point in the video.

Running an apache2 server under debian stretch arm64 I found out byte range was not accepted out of the box.

I enabled apache2 mod header and added:

Header set Accept-Ranges bytes

to my apache2.conf file.

I fixed the seeking issue but the non playing mp4 file as well !
Out of curiosity, if someone could provide an explanation on how those 2 things are related (given that other mp4 files were playing perfectly fine), I'd be grateful.

Google Chrome does not want to play mp4 using mediaelement.js

If you try doing $("video").get(0).currentSrc or equivalent in a console you'll see that the non-mediaelement.js version is playing the Webm video, which Chrome can play just fine, but if you look at the same thing in the mediaelement.js version it's trying to play the MP4.

Then, if you have a look at $("video").get(0).error you'll see you have a MediaError. Inspect that and you see it has "code 4". According to the spec, that is MEDIA_ERR_SRC_NOT_SUPPORTED.

Now, try $("video").get(0).canPlayType("video/mp4") -- it returns "maybe".

This is guesswork now, but perhaps Chrome reports "maybe" because it can play some profiles of MP4 but not others. No matter the reasons, I'd personally prefer Mediaelement.js to treat "maybe" as "no" and go ahead and fire up the Flash fallback if none of the other source types are playable natively. It's easy enough to patch it to do so. I've done exactly that on a fork I just made -- have a look at https://github.com/tremby/mediaelement/tree/maybe-to-no

Hope that helps. Let me know if it works for you -- I'm hoping it'll give up on the MP4 and try the Webm instead in your case. In my own project (debugging which brought me to this question) I have only an MP4 file, and the Flash fallback is happily taking its place.

MP4 Video is not playing on Mobile Devices and Chrome?

Turns out, problem is not in the code but which custom HTML widget I used in the website builder.

I have been using Astra theme in WordPress, when adding Custom HTML widget into layout, I was using WordPress HTML widget instead of Astra's HTML widget. Somehow, theme was blocking the WordPress widget.

I am going to leave this answer here in case someone in the future might run into same issue.

MP4 not playing on Chrome version 27.0

After running into the same issue - here're some of my thoughts:

due to Chrome removing support for h264, on some machines, mp4 videos encoded with it will either not work (throwing an Parser error when viewing under Firebug/Network tab - consistent with issue submitted here), or crash the browser, depending upon the encoding settings
it isn't consistent - it entirely depends upon the codecs installed on the computer - while I didn't encounter this issue on my machine, we did have one in the office where the issue occurred (and thus we used this one for testing)
it might to do with Quicktime / divX settings (the machine in question had an older version of Quicktime than my native one - we didn't want to loose our testing pc though, so we didn't update it).

As it affects only Chrome (other browsers work fine with VideoForEverybody solution) the solution I've used is:

for every mp4 file, create a Theora encoded mp4 file (example.mp4 -> example_c.mp4)

apply following js:

if (window.chrome)
    $("[type=video\\\/mp4]").each(function()
    {
        $(this).attr('src', $(this).attr('src').replace(".mp4", "_c.mp4"));
    });

Unfortunately it's a bad Chrome hack, but hey, at least it works.

Chrome video tag can't play fragmented mp4 stream

I try to test the stream on my side that you shared in the comment.

I got similar results with the Edge Chromium browser and Goole Chrome browser, That is the stream is not playing. However, it is playing with the Firefox browser.

I confirm the codec of the stream using the VLC player.

Sample Image

I try to run the code below and try to check whether this video type and codec can work with the chromium browsers or not.

function supportType(e,vidType,codType) { 
  var vid = document.createElement('video');
  isSupp = vid.canPlayType(vidType+';codecs="'+codType+'"');
  if (isSupp == "") {
    isSupp = "No";
  }
  e.target.parentNode.innerHTML = "Answer: " + isSupp;
}

<p>Can my browser play MP4 videos? <span>
<button onclick="supportType(event,'video/mp4','H264 - MPEG-4 AVC (part 10) (avc1)')" type="button">Test</button>
</span></p>