.mp4 video is not playing in html but ather same format videos works

Question

this is my simple html to play a single video :

<video id="video_Div" controls>  
 <source src="room.mp4" type="video/mp4 ">  Your browser does not support the video tag</video>

but it did not play . but when using another .mp4 videos ,"221.mp4" it works and plays without any problems

why not all mp4 video works or played in chrome browser ?

I'm using chrome browser

Which browser? Have you checked the video itself? Can you play the video not in the browser? What are the errors that the browser shows? — Oleg G
I'm using chrome browser. of course ,it works fine when run it on my computer . No , the browser gives me no errors , a loading circle appears , but nothing is played — Calm Sea
if you try and open the video directly in chrome (eg file:///c:...../221.mp4) does it play? if not, there is probably an encoding issue that's putting it outside the acceptable spec for html5. you can use something like ffprobe (part of the ffmpeg tools) to check the encoding. — Offbeatmammal

Mick Mick · Accepted Answer · 2020-02-24T13:40:30

The answer to your question 'why not all mp4 video works or played in chrome browser?' - i.e. why one mp4 video will work but another may not, is to do with MP4 itself.

MP4 is a container specification - it provides a mechanism to contain video, audio and data streams in a single 'wrapper' or container format.

It can support many different audio and video formats within the MP4 container and this is the reason for the behaviour you are seeing. Your browser and device will typically have a set of video and audio encoding it can support and if the MP4 container's streams are using these it will be able to play the video. If not it won't be able to play the video.

Note that even if you know the video encoding format, a codec like h.264, h.265, vp9 etc, there may still be subset of the functionality, or profiles, for a given codec which are and are not supported.

You can see the more detail and information on different supported types in a number of places, but this link from Mozilla is a good place for an up to dat view: https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Video_codecs

As mentioned in the comments to your question, you can see what encoding your video has by using tools like ffprobe:https://ffmpeg.org/ffprobe.html. An example output might look like the example below. This tells you the video stream '0' is using the 'main' profile of the H.264 codec, for example:

Input #0, mov,mp4,m4a,3gp,3g2,mj2, from '/bbb_PCM_48_16.mp4':
  Metadata:
    major_brand     : qt  
    minor_version   : 0
    compatible_brands: qt  
    creation_time   : 2019-09-19T20:37:29.000000Z
    timecode        : 00:00:00:00
  Duration: 00:00:48.00, start: 0.000000, bitrate: 5042 kb/s
    Stream #0:0(eng): Video: h264 (Main) (avc1 / 0x31637661), yuv420p(tv, bt709), 853x480, 3503 kb/s, 24 fps, 24 tbr, 600 tbn, 1200 tbc (default)
    Metadata:
      creation_time   : 2019-09-19T20:37:29.000000Z
      handler_name    : Core Media Video
      encoder         : H.264
    Stream #0:1(eng): Data: none (tmcd / 0x64636D74) (default)
    Metadata:
      creation_time   : 2019-09-19T20:37:29.000000Z
      handler_name    : Core Media Time Code
      timecode        : 00:00:00:00
    Stream #0:2(und): Audio: pcm_s16be (lpcm / 0x6D63706C), 48000 Hz, stereo, s16, 1536 kb/s (default)
    Metadata:
      creation_time   : 2019-09-19T20:37:29.000000Z
      handler_name    : Core Media Audio

.mp4 video is not playing in html but ather same format videos works

1 Answers