RTC 对等连接未建立



我阅读了MDN中的WebRTC,并尝试打开对等连接。我决定在一个页面中打开本地和远程连接,并编写了以下代码:

const configuration = {iceServers: [
{urls: 'stun:stun.l.google.com:19302'},
{urls: 'stun:stun1.l.google.com:19302'},
]};
const localConnection = new RTCPeerConnection(configuration);
const remoteConnection = new RTCPeerConnection(configuration);
let localSendChannel, remoteSendChannel;
localConnection.onicecandidate = ({candidate}) => {
console.log('local candidate', candidate);
if (candidate) remoteConnection.addIceCandidate(candidate)
}
remoteConnection.onicecandidate = ({candidate}) => {
console.log('remote candidate', candidate);
if (candidate) localConnection.addIceCandidate(candidate)
}
const connect = async () => {
const offer = await localConnection.createOffer();
console.log('local offer', offer);
await localConnection.setLocalDescription(offer);
console.log('local localDescription', localConnection.localDescription);
await remoteConnection.setRemoteDescription(localConnection.localDescription);

const answer = await remoteConnection.createAnswer();
await remoteConnection.setLocalDescription(answer);
console.log('remote answer', answer);
console.log('remote localDescription', remoteConnection.localDescription);
await localConnection.setRemoteDescription(remoteConnection.localDescription);
localConnection.addEventListener('connectionstatechange', (e) => {
console.log('localConnection new state', e.connectionState);
});

remoteConnection.addEventListener('connectionstatechange', (e) => {
console.log('remoteConnection new state', e.connectionState);
});
const gumStream = await navigator.mediaDevices.getUserMedia({video: false, audio: true});
for (const track of gumStream.getTracks()) 
localConnection.addTrack(track);
}
const openLocalChannel = async () => {
localSendChannel = localConnection.createDataChannel("sendChannel");
localSendChannel.onopen = () => {
console.log('local datachannel was opened');
localSendChannel.send("Hello, world!")
}

localSendChannel.onclose = () => console.log('local datachannel was closed');
localSendChannel.onmessage = (msg) => console.log('local channel got message', msg);
}
const waitRemoteChannel = () => {
remoteConnection.ondatachannel = (e) => {
remoteSendChannel = e.channel;
console.log('remote atachannel was init');

remoteSendChannel.onopen = () => console.log('remote datachannel was opened');
remoteSendChannel.onclose = () => console.log('remote datachannel was closed');
remoteSendChannel.onmessage = (msg) => console.log('remote channel got message', msg);
};
}
const start = async () => {
await connect();
waitRemoteChannel();
await openLocalChannel();

localConnection.addEventListener('connectionstatechange', async (e) => {
console.log('localConnection new state', e.connectionState);
});

remoteConnection.addEventListener('connectionstatechange', (e) => {
console.log('localConnection new state', e.connectionState);
});
}
start();

我在Chrome中没有任何候选者,在FireFox中只有null候选者。你能指出错误在哪里吗?

更新:我在代码中添加了媒体跟踪,添加并尝试在连接创建后创建数据通道。但问题是保持

您没有对连接执行任何操作,既没有添加轨道也没有创建数据通道。因此,该报价将正式有效,但不会导致ice候选人聚集,没有候选人就没有联系。

相关内容

最新更新