修改视频问题

src/components/live-broadcast/action-bar.tsx

@@ -40,7 +40,13 @@ export default defineComponent({
     },
     volumeChange(value: number) {
       this.volume = value
+      console.log(runtime.activeTracks)
       RuntimeUtils.setVolume(value)
+      // @ts-ignore
+      if (runtime.activeTracks.microphone && runtime.activeTracks.microphone._element) {
+        // @ts-ignore
+        runtime.activeTracks.microphone._element.volume = value / 100
+      }
     }
   },
   render() {

src/components/live-broadcast/index.tsx

@@ -7,7 +7,7 @@ import { state } from '/src/state'
 import event, { LIVE_EVENT_MESSAGE } from './event'
 import runtime, * as RuntimeUtils from './runtime'
 import Chronography from './chronography'
-import { removeMedia } from './helpers'
+// import { removeMedia } from './helpers'
 import styles from './index.module.less'
 
 const videoRef = ref<HTMLVideoElement | null>(null)
@@ -40,10 +40,11 @@ export default defineComponent({
         RuntimeUtils.setSelectMicrophone(runtime.microphones[0])
         cameraVideoTrack = await RuntimeUtils.getTrack('camera')
         runtime.videoRef && cameraVideoTrack.play(runtime.videoRef)
-        await RuntimeUtils.setTrack([cameraVideoTrack], 'camera')
-        microphoneAudioTrack = await RuntimeUtils.getTrack('microphone')
-        runtime.videoRef && microphoneAudioTrack.play(runtime.videoRef)
-        console.log(runtime.deviceStatus)
+        await RuntimeUtils.setTrack([cameraVideoTrack], 'camera', false)
+        // microphoneAudioTrack = await RuntimeUtils.getTrack('microphone')
+        // microphoneAudioTrack.play()
+        // console.log(microphoneAudioTrack)
+        // console.log(runtime.deviceStatus)
         runtime.videoStatus = 'stream'
         const join = await RuntimeUtils.joinRoom(state.user?.roomUid, RTC.RCLivingType.VIDEO, {
           onMessageReceive(name, content) {
@@ -83,20 +84,21 @@ export default defineComponent({
             console.log('onUserLeave', userIds)
           },
         })
-        if (sessionStorage.getItem(RuntimeUtils.START_LIVE_STATUS) === 'liveing') {
-          await RuntimeUtils.startLive()
-        }
         if (join.room && join.code === RTC.RCRTCCode.SUCCESS) {
           runtime.joinedRoom = join.room
         }
+        if (sessionStorage.getItem(RuntimeUtils.START_LIVE_STATUS) === 'liveing') {
+          await RuntimeUtils.startLive(false)
+          runtime.videoStatus = 'liveing'
+        }
       } catch (error) {
         runtime.videoStatus = 'error'
         console.log(error)
       }
     },
     closeLive() {
-      removeMedia(runtime.mediaStreams, runtime.mediaStreamTrack)
-      runtime.videoStatus = 'stopped'
+      // removeMedia(runtime.mediaStreams, runtime.mediaStreamTrack)
+      runtime.videoStatus = 'stream'
     },
   },
   render() {

src/components/live-broadcast/runtime.ts

@@ -184,7 +184,7 @@ export const setVideoSrcObject = (video: HTMLVideoElement | null, mediaStreams:
  * 发起屏幕共享
  */
 export const shareScreenVideo = async () => {
-  if (runtime.rtcClient) {
+  if (runtime.rtcClient && !runtime.screenShareStatus) {
     const screenTrack = await getTrack('screen')
     const oldTrack = runtime.activeTracks.camera as RTC.RCLocalTrack
     // removeTrack([oldTrack], 'camera')
@@ -312,9 +312,14 @@ export const setTrack = async (tracks: RTC.RCLocalTrack[], trackType: TrackType,
   for (const track of tracks) {
     // @ts-ignore
     // await runtime.mediaStreams?.addTrack(track._msTrack)
+    if (trackType === 'microphone') {
+      console.log('添加麦克风')
+      track.play()
+    }
     runtime.activeTracks[trackType] = track
   }
   if (needPublish) {
+    // console.log('publish', runtime.joinedRoom)
     await runtime.joinedRoom?.publish(tracks)
   }
 }
@@ -323,17 +328,17 @@ export const setTrack = async (tracks: RTC.RCLocalTrack[], trackType: TrackType,
  * @param track
  */
 export const removeTrack = async (tracks: RTC.RCLocalTrack[], trackType: TrackType, needPublish = true) => {
+  if (needPublish) {
+    await runtime.joinedRoom?.unpublish(tracks)
+  }
   for (const track of tracks) {
     // @ts-ignore
     // await runtime.mediaStreams?.removeTrack(track._msTrack)
     // runtime.activeTracks[trackType].destroy()
     // console.log(runtime.activeTracks[trackType])
-    track.destroy()
+    track?.destroy()
     runtime.activeTracks[trackType] = null
   }
-  if (needPublish) {
-    await runtime.joinedRoom?.unpublish(tracks)
-  }
 }
 
 export const joinIMRoom = async (roomId: string, type: RTC.RCLivingType, listenEvents: RTC.IRoomEventListener | null) => {
@@ -360,22 +365,24 @@ export const joinRoom = async (roomId: string, type: RTC.RCLivingType, listenEve
  * 开始直播
  */
 
-export const startLive = async () => {
+export const startLive = async (resetTime = true) => {
   if (runtime.videoStatus !== 'stream') throw Error('当前无视频流')
   const room = runtime.joinedRoom
   if (room) {
-    const microphoneAudioTrack = await getTrack('microphone')
-    const cameraVideoTrack = await getTrack('camera')
-    await setTrack([cameraVideoTrack], 'camera')
-    await setTrack([microphoneAudioTrack], 'microphone')
-    const builder = await runtime.joinedRoom?.getMCUConfigBuilder()
-    // @ts-ignore
-    await builder.setOutputVideoRenderMode?.(RTC.MixVideoRenderMode.WHOLE)
-    // @ts-ignore
-    await builder.flush()
+    // const microphoneAudioTrack = await getTrack('microphone')
+    // const cameraVideoTrack = await getTrack('camera')
+    // await setTrack([cameraVideoTrack], 'camera')
+    // await setTrack([microphoneAudioTrack], 'microphone')
+    // const builder = await runtime.joinedRoom?.getMCUConfigBuilder()
+    // // @ts-ignore
+    // await builder.setOutputVideoRenderMode?.(RTC.MixVideoRenderMode.WHOLE)
+    // // @ts-ignore
+    // await builder.flush()
     runtime.videoStatus = 'liveing'
   }
-  sessionStorage.setItem(START_LIVE_TIME, dayjs().valueOf().toString())
+  if (resetTime) {
+    sessionStorage.setItem(START_LIVE_TIME, dayjs().valueOf().toString())
+  }
   sessionStorage.setItem(START_LIVE_STATUS, 'liveing')
 }
 
@@ -484,8 +491,9 @@ export const openDevice = async (trackType: TrackType, needPublish = true) => {
 export const closeDevice = async (trackType: TrackType, needPublish = true) => {
   const track = runtime.activeTracks[trackType]
   if (trackType !== 'microphone') {
+    // console.log('closeDevice', track)
+    // track?.destroy()
     await removeTrack([track] as RTC.RCLocalTrack[], trackType, needPublish)
-    track?.destroy()
   } else {
     track?.mute()
   }
@@ -507,3 +515,10 @@ export const toggleDevice = async (trackType: TrackType) => {
   }
 }
 
+export const leaveIMRoom = async () => {
+  if (runtime.joinedRoom) {
+    // @ts-ignore
+    await runtime.rtcClient?.leaveRoom(runtime.joinedRoom)
+    runtime.joinedRoom = null
+  }
+}

src/pages/home/header/index.tsx

@@ -15,6 +15,7 @@ export default defineComponent({
         await request.post('/api-auth/exit', { data: {} });
         RuntimeUtils.closeDevice('camera')
         RuntimeUtils.closeDevice('microphone')
+        await RuntimeUtils.leaveIMRoom()
         state.user = null
         ElMessage.success('退出成功');
         removeToken();