努力了这么久,终于成了一名合格的代码搬运工,我只是有幸站在了巨人的肩膀上,感谢自己,感谢巨人...
1.实现了blob加密video的src
2.实现了flv的html5播放
3.实现了hls(m3u8)的html5播放
邮箱 [email protected]
QQ 1204505056
如果你觉得这个项目帮助到了你,你可以赞赏一下作者:
![image](https://raw.githubusercontent.com/chuzhixin/donate/master/donation.png)
import Vue from 'vue'
import {mp4} from 'zx-player'
Vue.component('byui-player-mp4', mp4)
import Vue from 'vue'
import {hls} from 'zx-player'
Vue.component('byui-player-hls', hls)
import Vue from 'vue'
import {flv} from 'zx-player'
Vue.component('byui-player-flv', flv)
template 完整示例(不要忘记改成自己的视频路径)
<template>
<div id="app">
<byui-player-mp4 :config="config1" @player="Player1 = $event" />
<byui-player-hls :config="config2" @player="Player2 = $event" />
<byui-player-flv :config="config3" @player="Player3 = $event" />
</div>
</template>
<script>
export default {
name: 'app',
data() {
return {
config1: {
id: 'mse1',
url: '/video/boyun.mp4'
},
Player1: null,
config2: {
id: 'mse2',
url: '/video/boyun.m3u8'
},
Player2: null,
config3: {
id: 'mse3',
url: '/video/boyun.flv'
},
Player3: null
};
}
};
</script>
<style>
body {
margin: 0;
padding: 0;
}
#app {
font-family: 'Avenir', Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
}
</style>