瀏覽代碼

更新 VideoPlayer.vue

reghao 2 年之前
父節點
當前提交
f33c2a6527
共有 1 個文件被更改,包括 45 次插入64 次删除
  1. 45 64
      src/components/VideoPlayer.vue

+ 45 - 64
src/components/VideoPlayer.vue

@@ -1,6 +1,5 @@
 <template>
 <template>
   <div id="dplayer" ref="dplayer" style="height: 480px;" />
   <div id="dplayer" ref="dplayer" style="height: 480px;" />
-<!--  <div id="dplayer" ref="dplayer" />-->
 </template>
 </template>
 
 
 <script>
 <script>
@@ -22,46 +21,18 @@ export default {
     return {
     return {
       flvjs,
       flvjs,
       DPlayer,
       DPlayer,
-      userPermission: {
-        userId: -1,
-        vip: false
+      danmaku: {
+        api: '//api.reghao.cn/api/comment/danmaku/',
+        token: 'bili'
       },
       },
-      userId: -1,
-      playRecord: null,
-      getUrl: false,
-      permissionDialog: false,
-      authCodeDialog: false,
-      authCode: null,
-      autoPlayList: false,
-      showMessage: false,
-      message: ''
+      getUrl: true
     }
     }
   },
   },
   created() {
   created() {
-    /* const userInfo = this.$store.state.user.userInfo
-    if (userInfo !== null) {
-      this.userPermission.userId = userInfo.userId
-      this.userPermission.vip = userInfo.vip
-    }*/
-
-    this.getUrl = true
-    /* const vidScope = this.videoProp.scope
-    if (vidScope === 1) {
-      this.getUrl = true
-    } else if (vidScope === 2) {
-      if (this.userPermission.vip) {
-        this.getUrl = true
-      } else {
-        this.permissionDialog = true
-      }
-    } else if (vidScope === 3) {
-      this.authCodeDialog = true
-    } else if (vidScope === 4) {
-      alert('私有视频, 只有本人可以观看')
-    }*/
   },
   },
   mounted() {
   mounted() {
     SocketInstance.connect()
     SocketInstance.connect()
+
     const videoId = this.videoProp.videoId
     const videoId = this.videoProp.videoId
     if (this.getUrl) {
     if (this.getUrl) {
       this.getVideoUrl(videoId)
       this.getVideoUrl(videoId)
@@ -69,33 +40,43 @@ export default {
   },
   },
   methods: {
   methods: {
     getVideoUrl(videoId) {
     getVideoUrl(videoId) {
-      videoUrl(videoId)
-        .then(res => {
-          if (res.code === 0) {
-            const urlType = res.data.type
-            if (urlType === 'mp4') {
-              const urls = res.data.urls
-              for (const url of urls) {
-                url.type = 'normal'
-              }
-              this.initMp4Player(this.userPermission.userId, videoId, this.videoProp.coverUrl, urls, res.data.currentTime)
-            } else if (urlType === 'flv') {
-              const urls = res.data.urls
-              const url = urls[0].url
-              this.initFlvPlayer(videoId, this.videoProp.coverUrl, url)
-            } else {
-              this.message = 'url 类型无法识别'
-              this.showMessage = true
+      videoUrl(videoId).then(res => {
+        if (res.code === 0) {
+          const urlType = res.data.type
+          if (urlType === 'mp4') {
+            const urls = res.data.urls
+            for (const url of urls) {
+              url.type = 'normal'
             }
             }
+            this.initMp4Player(this.videoProp.userId, videoId, this.videoProp.coverUrl, urls, res.data.currentTime)
+          } else if (urlType === 'flv') {
+            const urls = res.data.urls
+            const url = urls[0].url
+            this.initFlvPlayer(videoId, this.videoProp.coverUrl, url)
           } else {
           } else {
-            console.error(res.msg)
+            this.$notify.error({
+              message: '视频 url 类型不合法',
+              type: 'warning',
+              duration: 3000
+            })
           }
           }
-        }).catch(error => {
-          console.error(error.message)
+        } else {
+          this.$notify.error({
+            message: '视频 url 获取失败',
+            type: 'warning',
+            duration: 3000
+          })
+        }
+      }).catch(error => {
+        this.$notify.error({
+          message: '视频 url 获取失败',
+          type: 'warning',
+          duration: 3000
         })
         })
+      })
     },
     },
-    // TODO 获取弹幕配置,将 videoUrl 作为本函数的回调
     danmakuConfig() {
     danmakuConfig() {
+      // TODO 获取弹幕配置,将 videoUrl 作为本函数的回调
     },
     },
     initMp4Player(userId, videoId, coverUrl, urls, pos) {
     initMp4Player(userId, videoId, coverUrl, urls, pos) {
       const player = new DPlayer({
       const player = new DPlayer({
@@ -110,14 +91,12 @@ export default {
           pic: coverUrl,
           pic: coverUrl,
           defaultQuality: 0,
           defaultQuality: 0,
           quality: urls
           quality: urls
-          // url: videoUrl
-          // type: 'auto',
         },
         },
         danmaku: {
         danmaku: {
           id: videoId,
           id: videoId,
           maximum: 10000,
           maximum: 10000,
-          api: '//api.reghao.cn/api/comment/danmaku/',
-          token: 'bili',
+          api: this.danmaku.api,
+          token: this.danmaku.token,
           user: userId,
           user: userId,
           bottom: '15%',
           bottom: '15%',
           unlimited: true
           unlimited: true
@@ -135,11 +114,13 @@ export default {
       })
       })
 
 
       player.on('ended', () => {
       player.on('ended', () => {
-        SocketInstance.send({ videoId: videoId, currentTime: player.video.currentTime })
-        // TODO 当前视频播放完成后判断是否继续播放相关推荐中的视频
-        console.log('视频播放完成')
-        if (this.autoPlayList) {
-          this.$router.push('/video/oaywkjbLbW')
+        // SocketInstance.send({ videoId: videoId, currentTime: player.video.currentTime })
+        const path = this.$route.path
+        const nextPath = '/video/gz5RYkw1zn'
+        if (path !== nextPath) {
+          this.$router.push(nextPath)
+        } else {
+          console.log('视频播放完成')
         }
         }
       })
       })