fix useMSE:true的时候，pause 失效问题

langhuihui · Mar 27, 2023 · 29b1a54 · 29b1a54 · vercel · Mar 27, 2023
1 parent 45c9cfa
commit 29b1a54
Show file tree

Hide file tree

Showing 9 changed files with 35 additions and 12 deletions.
diff --git a/demo/document.md b/demo/document.md
@@ -965,6 +965,26 @@ jessibuca.play('url2')
 ```
 
 
+### WebGL: CONTEXT_LOST_WEBGL 错误引发的原因
+
+WebGL的CONTEXT_LOST_WEBGL错误通常表示WebGL上下文（context）已经丢失。当浏览器认为WebGL上下文已不再可用时，将会发生这种错误。以下是一些可能导致WebGL上下文丢失的原因：
+
+- 设备内存不足：在设备内存不足的情况下，浏览器会释放一些资源以获得更多内存，其中可能包括WebGL上下文。
+
+- 用户操作中断：例如窗口被最小化、系统进入睡眠模式等用户操作都有可能导致WebGL上下文丢失。
+
+- 设备性能问题：某些设备可能无法支持WebGL或者性能较低，导致WebGL上下文出现问题。
+
+- 驱动程序问题：某些情况下，驱动程序可能会导致WebGL上下文丢失。
+
+- 系统错误：例如设备故障、硬件损坏等系统错误也可能导致WebGL上下文丢失。
+
+#### 窗口被最小化、系统进入睡眠模式等用户操作都有可能导致WebGL上下文丢失。
+当用户窗口被最小化或系统进入睡眠模式时，浏览器会暂停WebGL上下文的渲染和更新。这可能会导致WebGL上下文超时（timeout）并且丢失。如果WebGL上下文被挂起或暂停时间过长，可以认为WebGL上下文已过期或无效，从而导致CONTEXT_LOST_WEBGL错误。
+
+WebGL是一种在Web浏览器中渲染3D图形的技术，需要高帧率和持续更新来保持流畅的体验。如果WebGL上下文被暂停或挂起，它就无法满足要求的性能需求，因此浏览器会释放WebGL上下文，以回收资源和内存。
+
+
 ### 群
 <img src="/public/qrcode.jpeg">
 

diff --git a/demo/public/MSE-demo.html b/demo/public/MSE-demo.html
@@ -99,7 +99,7 @@
             <input
                 autocomplete="on"
                 id="playUrl"
-                value="http://flv.bdplay.nodemedia.cn/live/bbb.flv"
+                value=""
             />
             <button id="play">播放</button>
             <button id="pause" style="display: none">停止</button>

diff --git a/demo/public/decoder.js b/demo/public/decoder.js
diff --git a/demo/public/decoder.js.map b/demo/public/decoder.js.map
diff --git a/demo/public/dist.zip b/demo/public/dist.zip
diff --git a/demo/public/jessibuca.js b/demo/public/jessibuca.js
diff --git a/demo/public/jessibuca.js.map b/demo/public/jessibuca.js.map
diff --git a/dist/jessibuca.js b/dist/jessibuca.js
diff --git a/src/video/videoLoader.js b/src/video/videoLoader.js
@@ -36,7 +36,7 @@ export default class VideoLoader extends CommonLoader {
         const {proxy} = this.player.events;
 
         proxy(this.$videoElement, 'canplay', () => {
-            this.player.debug.log('Video', 'canplay');
+            this.player.debug.log('Video', `canplay and _delayPlay is ${this._delayPlay}`);
             if (this._delayPlay) {
                 this._play();
             }
@@ -51,7 +51,8 @@ export default class VideoLoader extends CommonLoader {
             const timeStamp = parseInt(event.timeStamp, 10);
             this.player.emit(EVENTS.timeUpdate, timeStamp)
             // check is pause;
-            if (!this.isPlaying()) {
+            if (!this.isPlaying() && this.init) {
+                this.player.debug.log('Video', `timeupdate and this.isPlaying is false and retry play`);
                 this.$videoElement.play();
             }
         })