TSINGSEE青犀視頻的新用戶應該知道，我們現有的EasyGBS內有了視頻調閱功能，該功能是今年版本更新后才新增的，用戶可以在視頻調閱界面調閱至少4分屏的視頻進行預覽，
但是該界面目前有一點需要優化，就是如果高通道的獲取流介面有問題，或者請求時間過長時，就會導致該分屏一直處于黑屏狀態，用戶無法立即看到該視頻流，就可能與未調閱的視頻通道混淆，因此我們可以效仿EasyNVR的EasyWasmPlayer播放器來做一個視頻快照，（EasyWasmPlayer播放器如何優化起播時的快照功能）
當我們在EasyGBS內點擊某通道發送請求流地址的資料介面時，先創建EasyWasmPlayer播放器實體，同時呼叫該通道快照的介面，并利用播放器快照展示的函式將資料回傳給播放器，將照片展示給用戶，提示用戶該通道正在獲取流請等待，當請求流地址介面回傳資料時，將快照隱藏，開始播放視頻流，參考代碼如下：
// 獲取通道快照
getChannelSnap() {
$.get("/api/v1/device/channelsnap", {
serial: this.DeviceID,
code: this.ID,
encode: true,
}).then((res) => {
let _this = this;
this.channelSnap = res;
this.getNewVideoUrl();
console.log("到這里2");
$.get("/api/v1/stream/start", {
serial: _this.DeviceID,
code: _this.ID,
}).then((res) => {
//獲取cookie
this.MediaTypeDate = this.MediaType(
this.baseconfig.PlayMediaTypeDefault
);
_this.videoUrl = res[this.MediaTypeDate];
if (_this.baseconfig.DefaultPlayer == "auto") {
if (res.VideoCode == "H264") {
console.log("到這里3");
_this.getOldVideoUrl();
_this.NewPlay = false;
_this.oldplay = true;
} else {
_this.oldplay = false;
_this.NewPlay = true;
// 獲取到地址之后初始化播放器
_this.new265play.play(this.videoUrl, 1);
}
} else if (_this.baseconfig.DefaultPlayer == "EP") {
if (res.VideoCode != "H264") {
_this.$message({
type: "error",
message: "H265流請切換EasyWasmPlayer播放器",
});
}
_this.NewPlay = false;
_this.oldplay = true;
_this.getOldVideoUrl();
} else {
_this.NewPlay = true;
_this.oldplay = false;
_this.new265play.play(this.videoUrl, 1);
}
});
_this.touch();
});
},
EasyGBS的視頻調閱也就相當于分屏功能，如果大家想實際測驗使用，也可以聯系我們獲取測驗版本，TSINGSEE青犀視頻歡迎大家的咨詢和交流，更多視頻相關解決方案，可關注我們或直接訪問TSINGSEE青犀視頻官方網站，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/239596.html
標籤：其他