javascript - WebRTC 卡在连接状态

Question

我已成功地将 WebRTC 连接的提议、答案和候选冰从 A 传送到 B。此时，连接停留在“正在连接” 状态。启动器 (A) 似乎超时或在一段时间后发生某种情况并切换到 "failed" 状态，而其远程 (B) 则保持在 "connecting" 状态永久。

任何帮助将不胜感激。

创建对等点(A 和 B):

let peer = new RTCPeerConnection({
    iceServers: [
        {
            urls: [
                "stun:stun1.l.google.com:19302",
                "stun:stun2.l.google.com:19302",
            ],
        },
        {
            urls: [
                "stun:global.stun.twilio.com:3478?transport=udp",
            ],
        },
    ],
    iceCandidatePoolSize: 10,
});

创建报价 (A):

peer.onnegotiationneeded = async () => {
    offer = await peer.createOffer();
    await peer.setLocalDescription(offer);
};

收集冰候选者(A):

peer.onicecandidate = (evt) => {
    if (evt.candidate) {
        iceCandidates.push(evt.candidate);
    } else {
        // send offer and iceCandidates to B through signaling server
        // this part is working perfectly
    }
};

创建答案并填充ice候选者(B):

await peer.setRemoteDescription(offer);

let answer = await this._peer.createAnswer();
await peer.setLocalDescription(answer);

// send answer back to A through signaling server

for (let candidate of sigData.iceCandidates) {
    await peer.addIceCandidate(candidate);
}

B 通过信令服务器 (A) 应答:

await peer.setRemoteDescription(answer);

检测连接状态变化(A和B):

peer.onconnectionstatechange = () => {
    console.log("state changed")
    console.log(peer.connectionState);
}

另请注意，有两次连接成功，但我还没有看到它再次工作。

编辑:我忘了提及我也在创建一个数据通道(如果没有这个，onicecandidate 事件似乎不会调用)。在构造 RTCPeerConnection 并附加任何事件处理程序后立即调用此函数。

let channel = peer.createDataChannel("...", {
    id: ...,
    ordered: true,
});

编辑 2:如 @jib建议，我现在也在B收集冰候选人，并将他们发送回A补充。然而，完全相同的问题仍然存在。

编辑3:第一次硬重新加载 A 的网页和 B 的网页时，它似乎已连接。连接再次停止工作，直到我再次进行硬重新加载。有谁知道为什么会出现这种情况？至少我暂时应该可以继续开发，直到我能解决这个问题。

编辑 4:我删除了正在使用的 iceServers 并将 RTCPeerConnection 构造函数留空。不知怎的，现在它更加可靠了。但我尚未在 iOS Safari 上成功连接!

Answer 1

终于!几周后，我解决了这个问题，这在我的问题中包含的代码中并不明显，但对于遇到类似问题的任何人来说仍然可能有用。

我假设在 onnegotiationneeded 事件触发并创建要约/答案之后完成了冰 block 收集。

由于这个错误的假设，我在这个阶段与ice候选者一起发出了offer/answer，但非常频繁地(根据我的经验，总是在iOS Safari中)此时尚未创建offer/answer。

我通过创建两个 promise 来解决这个问题:a)完成ice候选人收集，b)创建offer/answer。我在两个 Promise 上使用了 Promise.all，当它们都完成时，我通过信令服务器一次性发送了ice候选者和offer/answer。

这是可行的，但当然，将来我应该通过发送零碎的信息来“滴流”这些信息，而不是等待一切完全完成。不过以后我会担心这个，因为现在我用的是HTTP请求，太麻烦了。

编辑:当包含 iceServers 时，我的连接仍然总是卡住，所以我创建了一个 new question 。但是，当不包含 iceServers 时，本地连接现在 100% 完全可靠:)