html flash rtmp,Web直播之RTMP协议：vue-video-player + videojs-flash

视频直播服务目前支持3种直播协议：RTMP、HLS、HTTP-FLV。

本文主要讲解在 Vue 项目中如何使用 vue-video-player 播放器播放 rtmp 流。

1.准备工作

cnpm install --save vue-video-player

cnpm install --save videojs-flash

cnpm install --save videojs-swf

2.代码实战

import { videoPlayer } from 'vue-video-player'

import 'video.js/dist/video-js.css'

import 'videojs-flash'

import SWF_URL from 'videojs-swf/dist/video-js.swf'

export default {

components: {

videoPlayer

},

data () {

return {

playerOptions: {

autoplay: true,

sources: [{

type: 'rtmp/mp4',

src: 'rtmp://58.200.131.2:1935/livetv/hunantv' // 亲测可用

}],

techOrder: ['html5', 'flash'],

flash: {

swf: SWF_URL

}<