From 3038e767cdd3f767692fad18db0eab6445f46824 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Wed, 31 Mar 2021 13:44:17 +0800
Subject: [PATCH] hls处理，需要检测，video调整
---
src/styles/real.scss | 4 ++++
src/views/realTimePolice/real.vue | 45 +++++++++++++++++++++++++++++++++++++--------
2 files changed, 41 insertions(+), 8 deletions(-)
diff --git a/src/styles/real.scss b/src/styles/real.scss
index 79883a6..650d967 100644
--- a/src/styles/real.scss
+++ b/src/styles/real.scss
@@ -27,4 +27,8 @@
}
.el-image .el-icon-circle-close:before {
content: '';
+}
+
+video::-webkit-media-controls-timeline {
+ display: none;
}
\ No newline at end of file
diff --git a/src/views/realTimePolice/real.vue b/src/views/realTimePolice/real.vue
index 7bd4746..9c8d1ef 100644
--- a/src/views/realTimePolice/real.vue
+++ b/src/views/realTimePolice/real.vue
@@ -2,7 +2,7 @@
* @Author: Morpheus
* @Date: 2021-03-17 15:21:33
* @Last Modified by: Morpheus
- * @Last Modified time: 2021-03-29 10:19:55
+ * @Last Modified time: 2021-03-29 14:12:05
*/
<template>
<basic-container>
@@ -886,6 +886,8 @@
return a.jtype - b.jtype;
});
+
+
this.data = data.records;
this.loading = false;
@@ -1184,6 +1186,7 @@
},
// 视频通话打开关闭事件
openRealVideoBox() {
+ var that = this;
var newAxios = axios.create({
baseURL: "https://web.byisf.com:18000",
withCredentials: false,
@@ -1206,25 +1209,51 @@
.then((res) => {
newAxios
.get(
- `https://web.byisf.com:18000/GetPlayUrl?deviceCode=${this.form.serialNumber}&chl=${this.form.channelNumber}`
+ `https://web.byisf.com:18000/GetPlayUrl?deviceCode=${that.form.serialNumber}&chl=${this.form.channelNumber}`
)
.then((result) => {
- this.videoSource = result.data.data.m3u8;
+ that.videoSource = result.data.data.m3u8;
if (Hls.isSupported()) {
var dom = document.getElementById("real_video_conversation");
- this.hls = new Hls();
+ that.hls = new Hls();
- var m3u8Url = decodeURIComponent(this.videoSource);
+ var m3u8Url = decodeURIComponent(that.videoSource);
- this.hls.loadSource(m3u8Url);
+ that.hls.loadSource(m3u8Url);
- this.hls.attachMedia(dom);
+ that.hls.attachMedia(dom);
- this.hls.on(Hls.Events.MANIFEST_PARSED, function () {
+ that.hls.on(Hls.Events.MANIFEST_PARSED, function () {
dom.play();
});
+
+ that.hls.on(Hls.Events.ERROR, function (event, data) {
+
+ console.log(data, 4566824159, "视频播放有问题！！！")
+ if (data.fatal) {
+ switch (data.type) {
+ case Hls.ErrorTypes.NETWORK_ERROR:
+ // try to recover network error
+ console.log(
+ "fatal network error encountered, try to recover"
+ );
+ that.hls.startLoad();
+ break;
+ case Hls.ErrorTypes.MEDIA_ERROR:
+ console.log(
+ "fatal media error encountered, try to recover"
+ );
+ that.hls.recoverMediaError();
+ break;
+ default:
+ // cannot recover
+ that.hls.destroy();
+ break;
+ }
+ }
+ });
}
});
});
--
Gitblit v1.9.3