控制台整理, 修正用户名

index.js

@@ -11,6 +11,7 @@ app.ws('/webrtc/:channel', (ws, req) => {
     ws.id = req.headers['sec-websocket-key']
     ws.channel = req.params.channel
     ws.name = req.query.name
+    console.log('ws.name:', ws.name)
     // 设备离开频道时广播给所有在线设备
     ws.on('close', () => {
         console.log(ws.id, '设备离开频道:', ws.channel, wsInstance.getWss().clients.size)
@@ -35,7 +36,7 @@ app.ws('/webrtc/:channel', (ws, req) => {
         const data = JSON.parse(message)
         wsInstance.getWss().clients.forEach(client => {
             if (client !== ws && client.readyState === 1 && client.channel === ws.channel && client.id === data.id) {
-                client.send(JSON.stringify({ ...data, id: ws.id }))
+                client.send(JSON.stringify({ ...data, id: ws.id, name: ws.name }))
             }
         })
     })
@@ -43,6 +44,7 @@ app.ws('/webrtc/:channel', (ws, req) => {
     console.log(ws.id, '设备加入频道:', ws.channel, wsInstance.getWss().clients.size)
     wsInstance.getWss().clients.forEach(client => {
         if (client !== ws && client.readyState === 1 && client.channel === ws.channel) {
+            console.log(ws.name, '广播给在线设备:', client.name)
             client.send(JSON.stringify({ type: 'push', id: ws.id, name: ws.name, channel: ws.channel }))
             ws.send(JSON.stringify({ type: 'list', id: client.id, name: client.name, channel: client.channel }))
         }

public/client.js

@@ -1,7 +1,7 @@
 import { List, ListItem } from './weigets.js'
 
 export default class ClientList {
-    constructor({ channels = {}, EventListeners = {}, name }) {
+    constructor({ channels = {}, EventListeners = {}, name: username }) {
         this.channels = channels
         this.EventListeners = EventListeners
         const protocol = window.location.protocol === 'https:' ? 'wss' : 'ws'
@@ -12,7 +12,7 @@ export default class ClientList {
 
         // 连接 WebSocket
         const linkStart = () => {
-            const websocket = new WebSocket(`${protocol}://${host}/webrtc/music?name=${name}`)
+            const websocket = new WebSocket(`${protocol}://${host}/webrtc/music?name=${username}`)
             websocket.onmessage = async event => {
                 const data = JSON.parse(event.data)
                 const channels_init = (webrtc) => {
@@ -37,15 +37,15 @@ export default class ClientList {
                         }
                     }
                     webrtc.ondatachannel = ({ channel }) => {
-                        console.log('收到对方 datachannel', channel)
+                        console.log('对方建立数据通道', channel.label)
                         channel.onopen = event => {
-                            console.log('收到对方 datachannel open', event)
+                            console.log('对方打开数据通道', channel.label)
                             if (this.channels[event.target.label] && this.channels[event.target.label].onopen) {
                                 this.channels[event.target.label].onopen(event, this.clientlist.find(x => x.id === data.id))
                             }
                         }
                         channel.onmessage = event => {
-                            console.log('收到对方 datachannel message', event)
+                            //console.log('对方发送数据消息', JSON.parse(event.data).type)
                             if (this.channels[event.target.label] && this.channels[event.target.label].onmessage) {
                                 this.channels[event.target.label].onmessage(event, this.clientlist.find(x => x.id === data.id))
                             }
@@ -144,7 +144,7 @@ export default class ClientList {
     send(name, data) {
         //console.log('广播数据:', data, '到通道:', name, '到所有客户端')
         this.clientlist.forEach(client => {
-            console.log('发送数据到客户端:', client.id, client.name, '通道:', name, '数据:', data)
+            //console.log('发送数据到客户端:', client.id, client.name, '通道:', name, '数据:', data)
             client.channels.filter(ch => ch.label === name).forEach(async ch => {
                 // 等待 datachannel 打开(临时解决方案)
                 while (ch.readyState !== 'open') {

public/index.html

@@ -20,7 +20,7 @@
         const store = new IndexedDB('musicDatabase', 1, 'musicObjectStore')
         await store.open()
         const list = await store.getAll()
-        console.log('本地音乐列表:', list)
+        //console.log('本地音乐列表:', list)
 
         // 读取本地用户名(本地缓存)
         const name = localStorage.getItem('username')
@@ -31,15 +31,15 @@
         // 初始化音乐列表(加入本地缓存)
         const musicList = new MusicList({ list })
         musicList.on('remove', item => {
-            console.log('移除音乐', item)
+            //console.log('移除音乐', item)
             store.delete(item.id)
         })
         musicList.on('play', item => {
-            console.log('播放音乐', item)
+            //console.log('播放音乐', item)
         })
         musicList.on('load', async item => {
             await new Promise((resolve) => {
-                console.log('加载音乐', item)
+                //console.log('加载音乐', item)
                 // 建立一个专用信道, 用于接收音乐数据(接收方已经准备好摘要信息)
                 var buffer = new ArrayBuffer(0)
                 var count = 0
@@ -62,7 +62,7 @@
             })
         })
         musicList.on('add', item => {
-            console.log('添加音乐', item)
+            //console.log('添加音乐', item)
             if (item.arrayBuffer) {
                 store.add(item)
                 // 告知对方音乐列表有更新
@@ -71,6 +71,7 @@
         })
 
         // 初始化客户端列表
+        console.log('初始化客户端列表', 'name:', name)
         const clientList = new ClientList({ name })
 
         // 缓冲分片发送
@@ -93,9 +94,7 @@
             },
             onmessage: async (event, client) => {
                 const { type, id, channel, list } = JSON.parse(event.data)
-                console.log('收到 base 基本信道数据:', type, id, channel)
                 if (type === 'get_music_list') {
-                    console.log(client, '请求音乐列表x')
                     console.log(client.name, '请求音乐列表:', musicList.list)
                     clientList.send('base', JSON.stringify({
                         type: 'set_music_list',
@@ -104,8 +103,7 @@
                     return
                 }
                 if (type === 'set_music_list') {
-                    console.log(client, '发来音乐列表x')
+                    console.log(client.name, '发来音乐列表:', `x${JSON.parse(event.data).list.length}`)
-                    console.log(client.name, '发来音乐列表:', event)
                     // 将音乐列表添加到本地
                     const ids = musicList.list.map(item => item.id)
                     list.filter(item => !ids.includes(item.id)).forEach(item => {