feat: 优化视频源切换方法逻辑

h5/src/components/vionPlayer/index.vue

@@ -90,6 +90,9 @@ export default {
           zoom: true,
           zoom: true,
           performance: true,
           performance: true,
           quality: false,
           quality: false,
+          record: true, // 录制
+          scale: true, // 显示模式：拉伸、缩放、正常
+          quality: false, // 视频清晰度
         },
         },
         contextmenuBtns: [{
         contextmenuBtns: [{
           content: '切换性能面板',
           content: '切换性能面板',
@@ -112,6 +115,7 @@ export default {
         extendOperateBtns: [],
         extendOperateBtns: [],
         showBandwidth: true, // 显示网速
         showBandwidth: true, // 显示网速
         showPerformance: false, // 显示性能
         showPerformance: false, // 显示性能
+        qualityConfig: ['标清', '高清'],
 
 
 
 
         // 云台控制
         // 云台控制
@@ -128,7 +132,7 @@ export default {
 
 
       if (url) {
       if (url) {
         // 示例上有延迟写法
         // 示例上有延迟写法
-        setTimeout(this.play(url), 150);
+        this.delayPlay(url);
       }
       }
     },
     },
     registerEvent(playerIns) {
     registerEvent(playerIns) {
@@ -160,23 +164,31 @@ export default {
       const data = getWatermarkCanvasImg(150, 48, '文安智能');
       const data = getWatermarkCanvasImg(150, 48, '文安智能');
       console.log('getWatermarkBase64', data);
       console.log('getWatermarkBase64', data);
     },
     },
+    delayPlay(url) {
+      setTimeout(() => {
+        this._jessibuca.play(url);
+        this.playOriginUrl = url;
+      }, 150);
+    },
 
 
     // 暴露方法
     // 暴露方法
     play(url) {
     play(url) {
       if (url) {
       if (url) {
-        // 播放地址不同，则先停止再播放。
-        // TODO: 尝试销毁后，再创建的方式 demo-flv.html
+        // 播放地址不同，则先停止再播放。地址相同，相当于暂停后，继续播放
         if (this.playOriginUrl && this.playOriginUrl !== url) {
         if (this.playOriginUrl && this.playOriginUrl !== url) {
-          this.stop();
+          this.replay(url);
+        } else {
+          this.delayPlay(url);
         }
         }
-        setTimeout(() => {
-          this._jessibuca.play(url);
-          this.playOriginUrl = url;
-        }, 150);
       } else {
       } else {
         console.error('The url is not valid');
         console.error('The url is not valid');
       }
       }
     },
     },
+    replay(url) {
+      this.destroy().then(() => {
+        this.init(url);
+      });
+    },
     pause() {
     pause() {
       this._jessibuca.pause();
       this._jessibuca.pause();
     },
     },
@@ -185,13 +197,13 @@ export default {
     },
     },
     destroy() {
     destroy() {
       if (this._jessibuca) {
       if (this._jessibuca) {
-        this._jessibuca.destroy().then(() => {
-          this._jessibuca = null;
+        return this._jessibuca.destroy().then(() => {
+          // this._jessibuca = null;
         }).catch(() => {
         }).catch(() => {
-          Promise.reject(new Error('destruction failed'));
+          return Promise.reject(new Error('destruction failed'));
         });
         });
       } else {
       } else {
-        Promise.resolve(true);
+        return Promise.resolve(true);
       }
       }
     },
     },
     screenshot(filename = '', format = 'png', quality = 0.92, type = 'base64') {
     screenshot(filename = '', format = 'png', quality = 0.92, type = 'base64') {

h5/src/views/player/vionPlayerDemo.vue

@@ -14,7 +14,7 @@
         <input type="text" v-model="playUrl">
         <input type="text" v-model="playUrl">
         <button @click="handlePlay">播放</button>
         <button @click="handlePlay">播放</button>
       </div>
       </div>
-      <!-- <button @click="handleLive">直播</button> -->
+      <button @click="handleReplay">重新播放</button>
       <!-- <button @click="handleShow">展示</button> -->
       <!-- <button @click="handleShow">展示</button> -->
       <button @click="handlePause">暂停</button>
       <button @click="handlePause">暂停</button>
       <button @click="handleStop">停止</button>
       <button @click="handleStop">停止</button>
@@ -59,6 +59,10 @@ export default {
       const url = this.playUrl;
       const url = this.playUrl;
       this.$refs.vionPlayer.play(url);
       this.$refs.vionPlayer.play(url);
     },
     },
+    handleReplay() {
+      // 重新播放录像
+      this.$refs.vionPlayer.replay(this.recordUrl);
+    },
     handleShow() {
     handleShow() {
       this.playerVisible = true;
       this.playerVisible = true;
     },
     },