cmt视频播放临时方案

index.html

@@ -9,6 +9,7 @@
 <!--    <link href="./static/map/cesium109/Widgets/widgets.css" rel="stylesheet"/>-->
     <link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.16.0/skins/default/aliplayer-min.css" />
     <script type="text/javascript" charset="utf-8" src="https://g.alicdn.com/de/prismplayer/2.16.0/aliplayer-min.js"></script>
+    <script type="text/javascript" charset="utf-8" src="http://10.30.20.54:8093/static/imosPlayer.min.js"></script>
 
     <script type="text/javascript" charset="utf-8" src="https://api.tianditu.gov.cn/api?v=4.0&tk=e8a16137fd226a62a23cc7ba5c9c78ce"></script>
     <script type="text/javascript" src="./static/map/cesium91/CesiumUnminified/Cesium.js"></script>

src/views/map/dialog/video_play_plat.vue

@@ -1,21 +1,24 @@
 <template>
   <div>
-    <div class="level-title">
+    <div v-if="gangkou != '00005'" class="level-title">
       <h1>摄像头名称：{{ info.NAME }}</h1>
     </div>
-    <table class="table-ui">
+    <table v-if="gangkou != '00005'" class="table-ui">
       <tr>
         <td class="bbg-transparent">编码</td>
         <td >{{ info.INDEXCODE }}</td>
       </tr>
     </table>
-    <div id="aLiVideoPlayer" class="prism-player"/>
+    <div id="aLiVideoPlayer" ref="aLiVideoPlayer" style="" class="prism-player"/>
   </div>
 </template>
 
 <script>
 import { requestFN } from '@/utils/request'
 
+const imosPlayer = window.imosPlayer
+
+let iframeObj = null
 export default {
   props: {
     id: {
@@ -49,10 +52,33 @@ export default {
   beforeDestroy() {
     this.player && this.player.dispose()
   },
+  mounted() {
+    if (this.gangkou === '00005') {
+      this.showYsVideo()
+    } else {
+      this.showVideo()
+    }
+  },
   created() {
-    this.showVideo()
+    // this.showVideo()
+
   },
   methods: {
+    showYsVideo() {
+      iframeObj = imosPlayer.createPanelWindow()
+      var dom = document.getElementById('aLiVideoPlayer')
+      iframeObj.style.margin = 'auto'
+      dom.appendChild(iframeObj)
+      imosPlayer
+        .playLive(iframeObj.id, {
+          camera: this.id,
+          title: this.id,
+          stream: 1
+        })
+        .then((e) => {
+          console.log(e)
+        })
+    },
     showVideo() {
       requestFN(
         this.requestUrl,

src/views/map/index.vue

@@ -250,7 +250,14 @@ var tiandituTk = 'e8a16137fd226a62a23cc7ba5c9c78ce'
 var subdomains = ['0', '1', '2', '3', '4', '5', '6', '7']
 const Cesium = window.Cesium
 Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJkOWQ0MGYwMy0yODUwLTQ1YzktOGM4OC02MTMwY2UyZjNlMzQiLCJpZCI6MTY0NTUwLCJpYXQiOjE2OTM4OTU1Mjd9.1cC0sSzyj79LZv0ILNCcl0Mabw6hl8TNngFNFr7H8f4'
+// ys使用
+import axios from 'axios'
+// md5加密
+import md5 from 'md5'
 
+const imosPlayer = window.imosPlayer
+
+const iframeObj = null
 export default {
   components: {
     AnquanCfd,
@@ -1071,15 +1078,165 @@ export default {
       iniOne: 0,
 
       /* 一公司人员定位 结束*/
-      bottomClickDisable: false
+      bottomClickDisable: false,
+
+      // 宇视视频播放
+      dialogVideoYs: true,
+      ysVideoInfo: {
+        vmip: '172.14.0.54',
+        name: 'loadmin',
+        passwd: '_Ab54321',
+        vmport: '7010',
+        linkPort: '8093',
+        VIIDPort: '8088'
+      }
     }
   },
   mounted() {
     this.initMap()
     this.pointBoxCfd = loadMapBoxCfd()
     this.pointBox = loadMapBox()
+    this.ysVideoInit()
   },
   methods: {
+    getRandom() {
+      function S4() {
+        return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1)
+      }
+      return S4() + S4() + '-' + S4() + '-' + S4() + '-' + S4() + '-' + S4() + S4() + S4()
+    },
+    keepalive(token) {
+      // 第二套方案
+      requestFN(
+        '/map/loginOrKeepAlive',
+        {
+        }
+      ).then((data) => {
+
+      })
+    },
+    ysVideoInit() {
+      // 第二套方案
+      var _this = this
+      requestFN(
+        '/map/loginOrKeepAlive',
+        {
+        }
+      ).then((data) => {
+        const token = data.token
+        var nbsp = String.fromCharCode(160)
+        var arr = []
+        arr.length = 40
+        const str = arr.fill(nbsp).join('')
+        const voidPath = imosPlayer.getUniqueID()
+        window.voidPath = voidPath
+        document.title = document.title + str + new Date().getTime()
+        _this.keepalive(token)
+        setInterval(_this.keepalive, 30000, token)
+
+        window.videoWindow = 0
+        imosPlayer.setLinkPort('8093')
+        imosPlayer
+          .init({
+            ip: '172.14.0.54',
+            token: token,
+            title: document.title,
+            voidListenerPath: '\\' + voidPath
+          })
+          .then(async(resr) => {
+            if (resr.ErrCode === 0) {
+              // imosPlayer.setLiveNetLinkMode(liveNetProtocol, liveByMS)
+              // imosPlayer.setReplayNetLinkMode(replayNetProtocol, replayByMS)
+
+              // eslint-disable-next-line no-alert
+              console.info('登录成功')
+            } else {
+              // eslint-disable-next-line no-alert
+              console.info(resr.ErrMsg)
+            }
+          })
+          .catch((err) => {
+            console.error(err)
+          })
+      })
+    },
+    // keepalive(token) {
+    //   axios({
+    //     method: 'POST',
+    //     url: config.ysurl + '/VIID/hadesadapter/user/keepalive',
+    //     headers: {
+    //       'Content-Type': 'application/json; charset=utf8',
+    //       Authorization: token
+    //     },
+    //     responseType: 'json'
+    //   }).then((res) => { })
+    // },
+    // ysVideoInit() {
+    //   var _this = this
+    //   axios({
+    //     method: 'POST',
+    //     url: config.ysurl + '/VIID/login/v2', // protocol改为http://
+    //     headers: {
+    //       'Content-Type': 'application/json; charset=utf8'
+    //     },
+    //     responseType: 'json'
+    //   }).then((res) => {
+    //     const AccessCode = res.data.AccessCode// res.body改为res.data
+    //     const LoginSignature = md5(btoa(_this.ysVideoInfo.name) + AccessCode + md5(_this.ysVideoInfo.passwd))
+    //     axios({
+    //       method: 'POST',
+    //       url: config.ysurl + '/VIID/login/v2',
+    //       headers: {
+    //         'Content-Type': 'application/json; charset=utf8'
+    //       },
+    //       responseType: 'json',
+    //       data: {
+    //         UserName: _this.ysVideoInfo.name,
+    //         AccessCode,
+    //         LoginSignature
+    //       }
+    //
+    //     }).then((res) => {
+    //       var nbsp = String.fromCharCode(160)
+    //       var arr = []
+    //       arr.length = 40
+    //       const str = arr.fill(nbsp).join('')
+    //       const voidPath = imosPlayer.getUniqueID()
+    //       window.voidPath = voidPath
+    //       document.title = document.title + str + new Date().getTime()
+    //       var token = res.data.AccessToken
+    //       window.token = res.data.AccessToken
+    //       console.log(res)
+    //       _this.keepalive(token)
+    //       setInterval(_this.keepalive, 30000, token)
+    //
+    //       window.videoWindow = 0
+    //       imosPlayer.setLinkPort('8093')
+    //       imosPlayer
+    //         .init({
+    //           ip: '172.14.0.54',
+    //           token: token,
+    //           title: document.title,
+    //           voidListenerPath: '\\' + voidPath
+    //         })
+    //         .then(async(resr) => {
+    //           if (resr.ErrCode === 0) {
+    //             // imosPlayer.setLiveNetLinkMode(liveNetProtocol, liveByMS)
+    //             // imosPlayer.setReplayNetLinkMode(replayNetProtocol, replayByMS)
+    //
+    //             // eslint-disable-next-line no-alert
+    //             console.info('登录成功')
+    //           } else {
+    //             // eslint-disable-next-line no-alert
+    //             console.info(resr.ErrMsg)
+    //           }
+    //         })
+    //         .catch((err) => {
+    //           console.error(err)
+    //         })
+    //     })
+    //   })
+    // },
     initMap() {
       viewer = new Cesium.Viewer('cesiumContainer', {
         // terrainProvider: Cesium.createWorldTerrain()