更新 'index_mute.vue'

index_mute.vue

@@ -41,6 +41,12 @@
       <n-button @click="contrl(11)">
         缩小
       </n-button>
+      <n-button @click="capPhoto">
+        截图
+      </n-button>
+      <n-button @click="capVideo">
+        录像
+      </n-button>
     </div>
   </div>
 </template>
@@ -49,34 +55,35 @@ import axios from '@/utils/axios'
 import { onMounted, ref } from 'vue'
 import WebRtcPlayer from '@/utils/SRSWebRtcPlayer'
 
-const TOKEN = '833cd2ff8851509d0c4b2cab0dbdb74d'
+const TOKEN = '2fc01ae175e8676b6a3edc32d2d76cb3'
 const cList = ref()
 const CUUID = ref('')
 let play1 = null as any
 
 // 获取摄像头播放地址
 const getCamer = async () => {
-  const { data } = await axios.post('http://20.20.20.9:8089', {
+  const { data } = await axios.post('http://47.108.192.202:8089', {
     code: 'categorycamera.list',
     token: TOKEN,
     body: {}
   })
   // 35可控
-  cList.value = data.filter((el: { name: string }) => (el.name.includes('35')))
+  // cList.value = data.filter((el: { name: string }) => (el.name.includes('35')))
+  cList.value = data
   console.log('摄像头列表', cList.value)
 }
 
 // 播放
-const play = async (uuid:string) => {
+const play = async (uuid: string) => {
   if (play1) play1.close()
   CUUID.value = uuid
   play1 = new WebRtcPlayer({
-    HOST: '20.20.20.9',
+    HOST: '47.108.192.202',
     TOKEN,
     UUID: uuid,
     PROFILE: 0,
     PORT: 1985,
-    DOM: document.getElementById('test') as any
+    DOM: document.getElementById('test')
   })
 }
 
@@ -87,7 +94,21 @@ const play = async (uuid:string) => {
  */
 const contrl = (command: number, number = 1) => {
   if (!play1) return
-  play1.contrl('http://20.20.20.9:8089', CUUID.value, TOKEN, command, number)
+  play1.contrl('http://47.108.192.202:8089', CUUID.value, TOKEN, command, number)
+}
+
+// 截图
+const capPhoto = () => {
+  if (!play1) return
+  const base64 = play1.capPhoto(document.getElementById('test'))
+  console.log('截图', base64)
+}
+
+// 录像
+const capVideo = async () => {
+  if (!play1) return
+  const blob = await play1.capVideo(document.getElementById('test'), 1000 * 5)
+  console.log('录像', blob)
 }
 
 // 获取目录