Merge branch 'video' into dev

package-lock.json

@@ -23052,6 +23052,11 @@
       "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
       "integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw="
     },
+    "vconsole": {
+      "version": "3.3.4",
+      "resolved": "https://registry.npmjs.org/vconsole/-/vconsole-3.3.4.tgz",
+      "integrity": "sha512-9yihsic96NPoMLQx/lCQwH9d89H0bbMW3LZPzo/t4yGQcS1X+vTCe9OHm1XSH7WNxzGDmcSwBiKLsFGwvJpQBg=="
+    },
     "vendors": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.4.tgz",

package.json

@@ -106,6 +106,7 @@
     "ts-pnp": "1.1.6",
     "typescript": "^3.7.5",
     "url-loader": "2.3.0",
+    "vconsole": "^3.3.4",
     "video.js": "^7.8.4",
     "web-launch-app": "^2.2.4",
     "webpack": "4.42.0",

src/components/video/index.js

@@ -358,11 +358,9 @@ class Video extends Component {
     })
     this.ws.addEventListener('message', e => {
       const data = JSON.parse(e.data);
-      data.code == 4040 && (this.reconnect = false);
-      if (data.code === 0) {
-        if (data.data && data.data.position) {
-          this.player.currentTime(data.data.position);
-        }
+      data.code === 4040 && (this.reconnect = false);
+      if (data.code === 0 && data.data && data.data.position) {
+        this.player.currentTime(data.data.position);
       }
     })
   }
@@ -486,12 +484,6 @@ class Video extends Component {
     })
     this.player.addChild('CustomPlayButtonCover')
     this.player.on('play', () => {
-      let videoTime = window.sessionStorage.getItem('videoTimeBeforeReload')
-      if (videoTime) {
-        this.player.currentTime(videoTime)
-        window.sessionStorage.removeItem('videoTimeBeforeReload')
-      }
-
       const {videoList, activeIndex, vCourseId, course = {}} = this.state
       // 当视频播放时 看是否是第一次播放（初次进入页面 刷新页面 切换视频 都是第一次播放  需要获取上次的播放时间）
       if (this.isCurrentVideoFirstPlay) {
@@ -513,6 +505,13 @@ class Video extends Component {
         this.setupTimer();
       }
     })
+    this.player.on('durationchange', () => {
+      let videoTime = window.sessionStorage.getItem('videoTimeBeforeReload')
+      if (videoTime) {
+        this.player.currentTime(Number(videoTime))
+        window.sessionStorage.removeItem('videoTimeBeforeReload')
+      }
+    })
     this.player.on('ratechange', () => {
       this.currentPlaybackRate = this.player.playbackRate()
       this.sendWatchTime(this.watchSec, this.previousPlaybackRate)
@@ -535,15 +534,11 @@ class Video extends Component {
         })
       }
     })
-
+    this.player.on('error', () => {
+      this.handleVideoAuthError(0)
+    })
     this.player.on('waiting', () => {
-      clearTimeout(this.currentVideoTimer)
-      this.currentVideoTimer = setTimeout(() => {
-        if (this.currentVideoExpireTime < new Date().getTime()) {
-          window.sessionStorage.setItem('videoTimeBeforeReload', this.player.currentTime())
-          this.getVideoSrc()
-        }
-      }, 3000)
+      this.handleVideoAuthError(3000)
     })
   }
 
@@ -567,6 +562,17 @@ class Video extends Component {
     this.recordSocket = null
   }
 
+  //处理视频播放权限问题
+  handleVideoAuthError = (interval) => {
+    clearTimeout(this.currentVideoTimer)
+    this.currentVideoTimer = setTimeout(() => {
+      if (this.currentVideoExpireTime < new Date().getTime()) {
+        window.sessionStorage.setItem('videoTimeBeforeReload', this.player.currentTime())
+        this.getVideoSrc()
+      }
+    }, interval)
+  }
+
   //请求签名视频地址
   getVideoSrc = () => {
     const {videoList, activeIndex} = this.state
@@ -702,10 +708,8 @@ class Video extends Component {
     this.player.ready(() => {
       this.player.play()
     })
-
   }
 
-
   getDatumCatalog() {
     http.get(`${API.home}/m/course/data/${this.courseID}`)
       .then(res => {