LaniakeaSupercluster
/
webrtc
2
2
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

控制台整理, 修正用户名

This commit is contained in:
觉 2023-10-01 01:22:39 +08:00
parent 41955f9cfb
commit 30f38e4f3a
3 changed files with 16 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
index.js
View File

@ -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 }))
}

12
public/client.js
View File

@ -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') {

16
public/index.html
View File

@ -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, '发来音乐列表:', event)
console.log(client.name, '发来音乐列表:', `x${JSON.parse(event.data).list.length}`)
// 将音乐列表添加到本地
const ids = musicList.list.map(item => item.id)
list.filter(item => !ids.includes(item.id)).forEach(item => {