資訊專(zhuān)欄INFORMATION COLUMN
摘要：默認(rèn)情況下將會(huì)消除任何音頻。瀏覽器選擇最佳行為立即開(kāi)始加載視頻如果瀏覽器支持將播放器置于流暢模式，并在計(jì)算播放器的動(dòng)態(tài)大小時(shí)使用該值。換句話(huà)說(shuō)，它將按比例縮放以適應(yīng)其容器。
下載vue-video-player
npm install vue-video-player --save
在main.js文件引入
import VideoPlayer from "vue-video-player"
require("video.js/dist/video-js.css")
require("vue-video-player/src/custom-theme.css")
Vue.use(VideoPlayer)
在頁(yè)面中引入
在頁(yè)面中data中配置
playerOptions: {
// playbackRates: [0.7, 1.0, 1.5, 2.0], //播放速度
autoplay: false, // 如果true,瀏覽器準(zhǔn)備好時(shí)開(kāi)始回放。
muted: false, // 默認(rèn)情況下將會(huì)消除任何音頻。
loop: false, // 導(dǎo)致視頻一結(jié)束就重新開(kāi)始。
preload: "auto", // 建議瀏覽器在
掛載視頻組件（非必須）不寫(xiě)這一步也可以實(shí)現(xiàn)播放，添加這個(gè)是為了自定義按鈕使用
computed: {
player() {
return this.$refs.videoPlayer.player//自定義播放
}
},
官方文檔
video.js:https://docs.videojs.com/docs...
vue-video-player:https://github.com/surmon-chi...
不需要兼容m3u8的，以上就可以實(shí)現(xiàn)能播放
兼容m3u8的需要下載
npm install --save videojs-contrib-hls
在文件中引入
import ‘videojs-contrib-hls’
我這么引入會(huì)出現(xiàn)找不到文件，我沒(méi)找到問(wèn)題所在，如果這么引入不行，可以改為
在main.js文件中
const hls = require("videojs-contrib-hls")
Vue.use(hls)
這樣就好了
在頁(yè)面中測(cè)試
{
type: "application/x-mpegURL", // 這里的種類(lèi)支持很多種：基本視頻格式、直播、流媒體等，具體可以參看git網(wǎng)址項(xiàng)目
src:
"https://cdn.letv-cdn.com/2018/12/05/JOCeEEUuoteFrjCg/playlist.m3u8" // url地址，從別的博主那看來(lái)的地址，親測(cè)可用
}
至此就可以播放了
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/116303.html
摘要：默認(rèn)情況下將會(huì)消除任何音頻。瀏覽器選擇最佳行為立即開(kāi)始加載視頻如果瀏覽器支持將播放器置于流暢模式，并在計(jì)算播放器的動(dòng)態(tài)大小時(shí)使用該值。換句話(huà)說(shuō)，它將按比例縮放以適應(yīng)其容器。 下載vue-video-player npm install vue-video-player --save 在main.js文件引入 showImg(https://segmentfault.com/img/b...
摘要：和格式的瀏覽器兼容性移動(dòng)端因?yàn)樘O(píng)果公司對(duì)的強(qiáng)烈抵制以及自己定的視頻協(xié)議，所以在端原生支持格式的視頻播放而不支持的播放，而且因?yàn)樘O(píng)果在移動(dòng)端的領(lǐng)頭作用，所以其他移動(dòng)端包括瀏覽器也都原生支持格式的視頻播放。 因?yàn)檎`打誤撞來(lái)到了淘寶直播團(tuán)隊(duì)，從開(kāi)始完全不了解直播技術(shù)，現(xiàn)在因?yàn)閘eader暫時(shí)的離開(kāi)，準(zhǔn)備接手h5播放器的迭代，就不得不開(kāi)始了解相關(guān)的視頻技術(shù)，先整理一下在直播技術(shù)中的視頻格式和不...
摘要：和格式的瀏覽器兼容性移動(dòng)端因?yàn)樘O(píng)果公司對(duì)的強(qiáng)烈抵制以及自己定的視頻協(xié)議，所以在端原生支持格式的視頻播放而不支持的播放，而且因?yàn)樘O(píng)果在移動(dòng)端的領(lǐng)頭作用，所以其他移動(dòng)端包括瀏覽器也都原生支持格式的視頻播放。 因?yàn)檎`打誤撞來(lái)到了淘寶直播團(tuán)隊(duì)，從開(kāi)始完全不了解直播技術(shù)，現(xiàn)在因?yàn)閘eader暫時(shí)的離開(kāi)，準(zhǔn)備接手h5播放器的迭代，就不得不開(kāi)始了解相關(guān)的視頻技術(shù)，先整理一下在直播技術(shù)中的視頻格式和不...
閱讀 1575·2021-10-25 09:44
閱讀 2939·2021-09-04 16:48
閱讀 1570·2019-08-30 15:44
閱讀 2513·2019-08-30 15:44
閱讀 1742·2019-08-30 15:44
閱讀 2829·2019-08-30 14:14
閱讀 2980·2019-08-30 13:00
閱讀 2158·2019-08-30 11:09
