Solution to the problem that the video label in html5 cannot play mp4, html5mp4

Solution to the problem that the video label in html5 cannot play mp4, html5mp4

Preface

I found a question at the very beginning. I recorded a 1.mp4 file on my mobile phone, and all the mainstream browsers can play normally. However, you cannot use the format scheme to convert the rmvbfile to 2.mp4. After finding the relevant information, I finally solved the problem. I will share it for your reference and study. Here I will take a look at the detailed introduction:

Problem Analysis

Video attributes recorded by mobile phone:

 

Format the video attributes of factory transcoding:

 

First, eliminate issues such as code, path, and browser support. After transcoding, the video encoding is mp4v. This is the reason why it cannot be played. convert it to AVC (H264) encoding.

Refer to the documentation for the video formats and codes supported by video tags:

• MPEG4 = MPEG4 file with H.264 video encoding and AAC audio encoding
• WebM = A WebM file with VP8 video encoding and Vorbis Audio Encoding
• Ogg = Ogg file with Theora video encoding and Vorbis Audio Encoding
  

Through the above information we found only h264 encoded MP4 video (MPEG-LA Company), VP8 encoded webm format video (Google) and Theora encoded ogg format video (iTouch Development) supports html5 <video> labels.

Solution

The video tag allows multiple source elements. The source element can be connected to different video files. The browser uses the first recognizable format to solve browser compatibility problems.

<video controls="controls" width="100%">  <source src="1.mp4" type="video/mp4">  <source src="1.ogg" type="video/ogg">Your browser does not support the video tag.</video>

Summary

The above is all the content of this article. I hope the content of this article will help you in your study or work. If you have any questions, please leave a message, thank you for your support.