uni-app + mui-player & vue + mui-player 播放flv文件

uni-app:
先在项目的根路径下打开终端,安装mui-player:

npm install mui-player --save

再安装个flv.js依赖:

npm install flv.js --save

然后再到main.js中引入:

import "mui-player/dist/mui-player.min.css";
import muiPlayer from 'mui-player';

再页面上创建元素,并定义id:


然后再创建muiPlayer播放器:

// 特别注意:在uni-app中不是文档上面的new muiPlayer,而是new muiPlayerMin,不然会undefined
initPlayer(){
	var mp = new muiPlayerMin({
		container: '#mui-player',
		title: '标题',
		autoplay: true, // 自动播放,部分浏览器不支持,比如谷歌,需要用户与页面交互才可以播放
		src: 'https://XXXXXXXXXXXXXXX', // 视频播放地址
		parse: {
			type: 'flv',
			loader: FlvJs,
			config: {
				cors: true // 允许跨域
			}
		}
	})
}

然后调用即可:

mounted(){
	this.initPlayer()
}

vue的:
先在项目的根路径下打开终端,安装mui-player:

npm install mui-player --save

再安装个flv.js依赖:

npm install flv.js --save

然后再到main.js中引入:

import "mui-player/dist/mui-player.min.css";

其它都差不多,直接上代码



你可能感兴趣的:(uni-app,vue.js)