.mp4 file not playing in chrome

Question

I want to show a video on my website. I have created a .mp4 file and using the HTML5 video tag to add it to the html.

The problem is that it is not being displayed in chrome. I would also like to know how I can replay it again and again.

I have the same problem. On chrome, it does not play ,mp4 video. On firefox, it does. This is my HTML code: `` btw, I agree with above comment. Your question needs more information. You should post exact code you used, version numbers, and if you tried it with other browsers. The more information you give, the better help you'll get. I am using Chorme 36.0.1985.125 on windows 7, 64 bit, and using firefox 31. — Nasser, Aug 11 '14 at 11:20
... The video above has the following encoding: `H264-MPEG-4 AVC (part 10) (avc1)`. So it looks like Chrome does not support H264 any more. Yet everywhere I looked, all sites says chrome supports this format. go figure. — Nasser, Aug 11 '14 at 11:35
Found the problem in my case. It turned out to be a CSS issue. I had used `overflow: hidden` in my style sheet. For some reason, this made Chrome not display the video ! When I removed it, it now shows up with no problem. So it had nothing to do with the video formating or encoding. It was just a browser CSS styling issue. — Nasser, Aug 11 '14 at 12:17

score 14 · Answer 1 · answered Aug 27 '18 at 11:09

14

I too had the same issue. I changed the codec to H264-MPEG-4 AVC and the videos started working in HTML5/Chrome.

Option selected in converter: H264-MPEG-4 AVC, Codec visible in VLC player: H264-MPEG-4 AVC (part 10) (avc1)

Hope it helps...

answered Aug 27 '18 at 11:09

Mahesh

141
1
2

where you changed this? how? – Mike Mar 25 '19 at 09:23
2

@Mike probably when creating the _.mp4_ file itself. In the browser you can specify the codecs to be attempted though. E.g.: `` (from [MDN codecs paramater](https://developer.mozilla.org/en-US/docs/Web/Media/Formats/codecs_parameter#General_syntax)). – CPHPython Sep 16 '19 at 13:53

score 11 · Answer 2 · edited May 23 '17 at 12:03

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.

Source: user: eithedog

This also can help: chrome could play html5 mp4 video but html5test said chrome did not support mp4 video codec

Also check your version of crome here: html5test

re-encode the video file with `ffmpeg -i input.mp4 -vcodec h264 output.mp4` solve my problem — Alston, Apr 12 '17 at 07:53
@Alston, your solved problem is not clear. Please post a clear code of where I should place these into. — Christian Luneborg, Feb 06 '18 at 20:28
@ChristianLuneborg `ffmpeg` is a command line utility. https://ffmpeg.org/ You'll probably need to google a quick tutorial to install it — aminimalanimal, May 28 '20 at 21:24

score 7 · Answer 3 · answered Aug 18 '21 at 11:00

(@Alston posted this as a comment, and it worked for me, and 9 others who also upvoted, so posting this as an answer to get more eyeballs on it:)

Simply re-encoding the video file with this FFMPEG command solves it:

ffmpeg -i input.mp4 -vcodec h264 output.mp4

score 1 · Answer 4 · answered Nov 12 '14 at 13:47

This started out as an attempt to cast video from my pc to a tv (with subtitles) eventually using Chromecast. And I ended up in this "does not play mp4" situation. However I seemed to have proved that Chrome will play (exactly the same) mp4 as long as it isn't wrapped in html(5) So here is what I have constructed. I have made a webpage under localhost and in there is a default.htm which contains:-

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<video  controls >
 <source src="sample.mp4" type="video/mp4">
 <track kind="subtitles" src="sample.vtt" label="gcsubs" srclang="eng">
</video>
</body>
</html>

the video and subtitle files are stored in the same folder as default.htm

I have the very latest version of Chrome (just updated this morning)

When I type the appropriate localhost... into my Chrome browser a black square appears with a "GO" arrow and an elapsed time bar, a mute button and an icon which says "CC". If I hit the go arrow, nothing happens (it doesn't change to "pause", the elapsed time doesn't move, and the timer sticks at 0:00. There are no error messages - nothing!

(note that if I input localhost.. to IE11 the video plays!!!!

In Chrome if I enter the disc address of sample.mp4 (i.e. C:\webstore\sample.mp4 then Chrome will play the video fine?.

This last bit is probably a working solution for Chromecast except that I cannot see any subtitles. I really want a solution with working subtitles. I just don't understand what is different in Chrome between the two methods of playing mp4

same situation, were you able to find a working solution with subtitles ? — coding_idiot, Dec 24 '16 at 22:22

score 0 · Answer 5 · answered Aug 28 '15 at 16:13

0

Encountering the same problem, I solved this by reconverting the file with default mp4 settings in iMovie.

answered Aug 28 '15 at 16:13

lakewood

607
1
5
21

2

Sounds great, but for people without a Mac, can you include those settings so other video editors can try them? – Jeff Clayton Sep 18 '15 at 20:04

score 0 · Answer 6 · answered May 20 '20 at 14:33

I was actually running into some strange errors with mp4's a while ago. What fixed it for me was re-encoding the video using known supported codecs (H.264 & MP3).

I actually used the VLC player to do so and it worked fine afterward. I converted using the mentioned codecs H.264/MP3. That solved it for me.

Maybe the problem is not in the format but in the JavaScript implementation of the play/ pause methods. May I suggest visiting the following link where Google developer explains it in a good way?

Additionally, you could choose to use the newer webp format, which Chrome supports out of the box, but be careful with other browsers. Check the support for it before implementation. Here's a link that describes the mentioned format.

On that note: I've created a small script that easily converts all standard formats to webp. You can easily configure it to fit your needs. Here's the Github repo of the same projects.

.mp4 file not playing in chrome

6 Answers6

Linked