add log

src/views/home/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="room">
-    <DeviceSelect v-show="false" ref="cameraRef" v-model:value="cameraId" device-type="camera" />
+    <DeviceSelect ref="cameraRef" v-model:value="cameraId" device-type="camera" />
     <DeviceSelect v-show="false" v-model:value="microphoneId" device-type="microphone" />
 
     <!-- 远端 -->
@@ -78,6 +78,7 @@ export default {
       userId: '',
       roomId: null,
       secret: {
+        'whr': 'eJyrVgrxCdZLrSjILEpVsrIwMzEw0AELlaUWKVkpGekZKEH4xSnZiQUFmSlKVoZANeamRmYmhhCZzJTUvJLMtEywhvKMIpiGzHQg38nfzcg4KtPAJaKkIDerLK84pCqw0NPNssjCtMIzqTTQtyIj1T-NKDXYINkWqrEkMxfoFEMzM6BjzC0MLGoBdUIwhw__',
         'wanghao': 'eJw1zF0LgjAYhuH-suOQ1*lmCB0kGBSF9AWdrm3pm-ixOUqI-numdfhcNzwvctoevYe2JCbUAzIbNypdO7zhyE9R54VofqlTpWhbVCT2Q4CIUR76U9F9i1YPzhijADCpw*prnPMgDOhfO8yH5*hus*u8Fyw1O*5MDcVqIx2k-WUpG24OQu4zhucyqdYL8v4As-8yew__',
         'wangran': 'eJyrVgrxCdYrSy1SslIy0jNQ0gHzM1NS80oy0zLBwuWJeelFiXlQqeKU7MSCgswUJStDEwMDc1MjMxNDiExqRUFmUSpQ3NTU1MjAwAAiWpKZCxIzMzMzNjE2MjGBmpKZDjQ5xd0z0N0zyiPbzck1scw-paLcMTQlOT8izC3LxcLF1STA09DAybi80jEl2VapFgCtiDHe',
         'haoran': 'eJwtzEELgjAYxvHvsqsh29ymCB28hIIElZR1G2y1ty2VJSVE3z1Tj8-vgf8HVeUhfGmPUkRDjFbTBqWbHq4wsZGtl83yPJWVXQcKpYRhHHMqGJkfPXTg9eicc4oxnrWHx9*EEFHECGVLBW5jWMn6HCRBW7njJd*WNgNrNrnbFXcZG356V94Vg7W12ydr9P0BbGAyOQ__',
@@ -203,31 +204,37 @@ export default {
       /* 远端流更新 */
       data.client.on('stream-updated', (event) => {
         const { stream: remoteStream } = event
+        alert('stream')
         console.log(`type: ${remoteStream.getType()} stream-updated hasAudio: ${remoteStream.hasAudio()} hasVideo: ${remoteStream.hasVideo()}`)
       })
       /* 远端流禁用音频 */
       data.client.on('mute-audio', (event) => {
         const { userId } = event
+        alert('muteaudio')
         console.log(`${userId} mute audio`)
       })
       /* 远端流启用音频 */
       data.client.on('unmute-audio', (event) => {
         const { userId } = event
+        alert('unmuteaudio')
         console.log(`${userId} unmute audio`)
       })
       /* 远端流禁用视频 */
       data.client.on('mute-video', (event) => {
         const { userId } = event
+        alert('mutevideo')
         console.log(`${userId} mute video`)
       })
       /* 远端流启用视频 */
       data.client.on('unmute-video', (event) => {
         const { userId } = event
+        alert('unmutevideo')
         console.log(`${userId} unmute video`)
       })
 
       /* 本地 client 与腾讯云的连接状态变更 */
       data.client.on('connection-state-changed', (event) => {
+        alert('connection')
         console.log(`RtcClient state changed to ${event.state} from ${event.prevState}`)
       })
 
@@ -248,6 +255,7 @@ export default {
           audio: isUndef(config.audio) ? true : config.audio,
           video: isUndef(config.video) ? true : config.video
         })
+        alert('subscribeStream')
       } catch (error) {
         console.error(`subscribe ${remoteStream.getUserId()} with audio: ${config.audio} video: ${config.video} error`, error)
       }
@@ -260,6 +268,7 @@ export default {
     const unsubscribeStream = async(remoteStream) => {
       try {
         await data.client.unsubscribe(remoteStream)
+        alert('unsubscribeStream')
       } catch (error) {
         console.error(`unsubscribe ${remoteStream.getUserId()} error`, error)
       }
@@ -303,6 +312,7 @@ export default {
      * @return {*}
      */
     const playLocalStream = async() => {
+      alert('playLocalStream')
       settings.localStream.play('localStream')
         .then(() => {
           settings.isPlayingLocalStream = true
@@ -481,9 +491,9 @@ export default {
   position: relative;
   .local-stream-container{
     width: 100%;
-    height: 100%;
+    height: 30%;
     position: absolute;
-    top: 0;
+    top: 50px;
     .local-stream-content {
       width: 100%;
       height: 100%;

src/views/login/index.vue

@@ -23,7 +23,7 @@ export default {
     const data = reactive({
       form: {
         userId: 'wanghaoran',
-        roomId: 111
+        roomId: '111'
       }
     })