DEBUG
This commit is contained in:
parent
d3011d9280
commit
7f0cf13337
|
|
@ -14,6 +14,68 @@ export default class Entanglement {
|
|||
// 当创建一个对象时，会调用这个方法
|
||||
// 当创建一个对象时，所有连接在一起的终端都会同步这个对象
|
||||
// 并不是所有的终端都会监听全局变化, 因此需要在这里注册监听(频道)
|
||||
async __create_webrtc(user) {
|
||||
const pc = new RTCPeerConnection(this.options)
|
||||
// 当有新的媒体流加入时触发
|
||||
pc.onicecandidate = (event) => {
|
||||
if (event.candidate) {
|
||||
console.debug(user.name, '发出 candidate 候选通道')
|
||||
this.ws.send(JSON.stringify({ type: 'candidate', user, candidate: event.candidate }))
|
||||
}
|
||||
}
|
||||
// 当连接状态发生改变时触发
|
||||
pc.oniceconnectionstatechange = (event) => {
|
||||
if (pc.iceConnectionState === 'disconnected' || pc.iceConnectionState === 'failed') {
|
||||
console.error(user.name, '需要添加新的 candidate')
|
||||
} else if (pc.iceConnectionState === 'connected' || pc.iceConnectionState === 'completed') {
|
||||
console.debug(user.name, 'WebRTC 连接已经建立成功')
|
||||
}
|
||||
}
|
||||
// 协商新的会话, 建立初始连接或在网络条件发生变化后重新协商连接
|
||||
pc.onnegotiationneeded = async (event) => {
|
||||
console.log('onnegotiationneeded', event)
|
||||
//const offer = await pc.createOffer()
|
||||
//await pc.setLocalDescription(offer)
|
||||
//this.ws.send(JSON.stringify({ type: 'offer', user, offer }))
|
||||
}
|
||||
// 当有新的媒体流加入时触发
|
||||
pc.ontrack = (event) => {
|
||||
console.log('ontrack', event)
|
||||
}
|
||||
// 当有新的数据通道加入时触发
|
||||
pc.ondatachannel = event => {
|
||||
console.log(user.name, '建立', event.channel.label, '通道')
|
||||
event.channel.onmessage = event => {
|
||||
console.log(user.name, '收到', event.target.label, '通道消息', event.data)
|
||||
}
|
||||
event.channel.onopen = () => {
|
||||
console.log(user.name, '打开', event.channel.label, '通道')
|
||||
event.channel.send('hello')
|
||||
}
|
||||
event.channel.onclose = () => {
|
||||
console.log(user.name, '关闭', event.channel.label, '通道')
|
||||
}
|
||||
event.channel.onerror = () => {
|
||||
console.log(user.name, '通道', event.channel.label, '发生错误')
|
||||
}
|
||||
}
|
||||
// 创建数据通道
|
||||
const channel = pc.createDataChannel('json', { reliable: true })
|
||||
channel.onopen = () => {
|
||||
console.log('打开数据通道')
|
||||
channel.send(JSON.stringify({ name: 'sato', hello: 'world' }))
|
||||
}
|
||||
channel.onmessage = event => {
|
||||
console.log('收到数据通道消息', event.data)
|
||||
}
|
||||
channel.onclose = () => {
|
||||
console.log('关闭数据通道')
|
||||
}
|
||||
channel.onerror = () => {
|
||||
console.log('数据通道发生错误')
|
||||
}
|
||||
return pc
|
||||
}
|
||||
|
||||
async __create_websocket() {
|
||||
const host = window.location.host
|
||||
|
|
@ -84,79 +146,17 @@ export default class Entanglement {
|
|||
return ws
|
||||
}
|
||||
|
||||
async __create_webrtc(user) {
|
||||
const pc = new RTCPeerConnection(this.options)
|
||||
// 当有新的媒体流加入时触发
|
||||
pc.onicecandidate = (event) => {
|
||||
if (event.candidate) {
|
||||
console.debug(user.name, '发出 candidate 候选通道')
|
||||
this.ws.send(JSON.stringify({ type: 'candidate', user, candidate: event.candidate }))
|
||||
}
|
||||
}
|
||||
// 当连接状态发生改变时触发
|
||||
pc.oniceconnectionstatechange = (event) => {
|
||||
if (webrtc.iceConnectionState === 'disconnected' || webrtc.iceConnectionState === 'failed') {
|
||||
console.error(data.name, '需要添加新的 candidate')
|
||||
} else if (webrtc.iceConnectionState === 'connected' || webrtc.iceConnectionState === 'completed') {
|
||||
console.debug(data.name, 'WebRTC 连接已经建立成功')
|
||||
}
|
||||
}
|
||||
// 协商新的会话, 建立初始连接或在网络条件发生变化后重新协商连接
|
||||
pc.onnegotiationneeded = async (event) => {
|
||||
console.log('onnegotiationneeded', event)
|
||||
const offer = await pc.createOffer()
|
||||
await pc.setLocalDescription(offer)
|
||||
this.ws.send(JSON.stringify({ type: 'offer', user, offer }))
|
||||
}
|
||||
// 当有新的媒体流加入时触发
|
||||
pc.ontrack = (event) => {
|
||||
console.log('ontrack', event)
|
||||
}
|
||||
// 当有新的数据通道加入时触发
|
||||
pc.ondatachannel = event => {
|
||||
console.log(data.user.name, '建立', event.channel.label, '通道')
|
||||
event.channel.onmessage = event => {
|
||||
console.log(data.user.name, '收到', event.channel.label, '通道消息', event.data)
|
||||
}
|
||||
event.channel.onopen = () => {
|
||||
console.log(data.user.name, '打开', event.channel.label, '通道')
|
||||
event.channel.send('hello')
|
||||
}
|
||||
event.channel.onclose = () => {
|
||||
console.log(data.user.name, '关闭', event.channel.label, '通道')
|
||||
}
|
||||
event.channel.onerror = () => {
|
||||
console.log(data.user.name, '通道', event.channel.label, '发生错误')
|
||||
}
|
||||
}
|
||||
// 创建数据通道
|
||||
const channel = pc.createDataChannel('json', { reliable: true })
|
||||
channel.onopen = () => {
|
||||
console.log('打开数据通道')
|
||||
channel.send(JSON.stringify({ name: 'sato', hello: 'world' }))
|
||||
}
|
||||
channel.onmessage = event => {
|
||||
console.log('收到数据通道消息', event.data)
|
||||
}
|
||||
channel.onclose = () => {
|
||||
console.log('关闭数据通道')
|
||||
}
|
||||
channel.onerror = () => {
|
||||
console.log('数据通道发生错误')
|
||||
}
|
||||
return pc
|
||||
}
|
||||
|
||||
// 向所有在线的用户广播消息(webrtc)
|
||||
send_all(channel_name, data) {
|
||||
console.log('向', channel_name, '频道广播消息:', data)
|
||||
console.log('在线用户:', this.users)
|
||||
this.users.filter(user => {
|
||||
const status = user.webrtc.iceConnectionState
|
||||
console.log('用户', user.name, '连接状态:', status)
|
||||
return status === 'connected' || status === 'completed'
|
||||
}).forEach(user => {
|
||||
console.log('向', user.name, '发送', channel_name, '频道消息:', data)
|
||||
const channel = user.webrtc.createDataChannel(channel_name)
|
||||
const channel = user.webrtc.createDataChannel(channel_name, { reliable: true })
|
||||
channel.onopen = () => channel.send(JSON.stringify(data))
|
||||
})
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue