1、下载SkeyeWebPlayer.js文件
2、将下载好的文件放到src/static目录下
3、引入形式
(1)、在入口页面index.html中引入SkeyeWebPlayer.js
<html>
<head>
<title>template</title>
<script src="static/libs/SkeyeWebPlayer.js"></script>
</head>
</html>
(2)、在vue组件中引入SkeyeWebPlayer.js
import WebMediaPlayer from '../static/libs/SkeyeWebPlayer/SkeyeWebPlayer'
4、vue组件中代码如下
<template>
<div class="player-group" id="skeyePlayer"></div>
</template>
<script>
export default {
data() {
return {
player: null
}
},
mounted() {
this.$nextTick(() => {
this.initPlayer()
});
},
beforeDestroy() {
if (this.player) {
this.player.destroy();
}
},
methods: {
initPlayer() {
// new WebMediaPlayer（url,domId,callback,options）
this.player = new WebMediaPlayer(
'url',
'skeyePlayer'`,
this.callbackFunc,
{
cbUserPtr: this,
decodeType: 'auto',
openAudio: 0,
BigPlay: false
});
this.player.play('', 1, 0);
},
// 播放器回调办法
callbackFunc(cbType, cbParams) {
if (cbType == 'playbackTime') {
//console.log("以后回放工夫: " + cbParams);
} else if (cbType == 'ended') {
console.log("播放完结");
}
//console.log("Callback " + cbType + ": " + cbParams);
}
}
}
</script>
5、能够将播放器独自写成组件供其余页面调用
6、最终成果
发表回复