Does vedio support rtmp in html5?

Vedio in HTML5 does not support rtmp; rtmp is the abbreviation of "Real Time Messaging Protocol" and is a set of video live broadcast protocols developed by Macromedia. This solution requires the establishment of a specialized RTMP streaming service such as "Adobe Media Server" ”, and only Flash can be used to implement the player in the browser, so the video tag in HTML5 cannot play RTMP protocol videos.

The operating environment of this tutorial: Windows 10 system, HTML5 version, Dell G3 computer.

vedio in html5 does not support rtmp

Real Time Messaging Protocol (RTMP for short) is a set of video live broadcast protocols developed by Macromedia and now belongs to Adobe. This solution requires building a specialized RTMP streaming service such as Adobe Media Server, and only Flash can be used to implement the player in the browser. Its real-time performance is very good and the delay is very small, but its shortcoming is that it cannot support mobile WEB playback.

On the browser side, the HTML5 video tag cannot play RTMP protocol videos, which can be achieved through video.js.

The vue project uses vue-video-player. The bottom layer actually uses videojs, which is just a plug-in for vue. First, we need to install the plug-in in the vue project npm install vue-video- player

Then, we can use the player directly in the HelloWorld component

class="vjs-custom-skin videoPlayer"
:options="playerOptions"
>
import "@/video-js.css";
import { videoPlayer } from "vue-video-player";
import "videojs-flash";
export default {
components: {
videoPlayer,
},
data() {
return {
playerOptions: {
height: "300",
sources: [
{
type: "rtmp/mp4",
src: "rtmp://192.168.12.187:1935/live/1",
},
],
techOrder: ["flash"],
autoplay: false,
controls: true,
},
};
},
};

(Learning video sharing: css video tutorial, html video tutorial）

The above is the detailed content of Does vedio support rtmp in html5?. For more information, please follow other related articles on the PHP Chinese website!