我正在为我的论文使用webRTC构建视频通话应用程序。我已经建立了应用程序,它的工作完美,如果我使用相同的设备(不同的标签浏览器/不同的浏览器).然后,当我尝试呼叫在其他设备上登录的其他用户时,peerConnection总是失败。我的应用程序已经在公共地址在线。它也发生在我的家乡。我已经在使用Turn服务器,当我在here上测试它时,它可以工作。那么,我的错误在哪里呢?
下面是我如何创建和处理对等连接的流程:
// Call Function
export const call = async (from, to) => {
let configuration = {
iceServers: [
{
urls: "stun:stun1.l.google.com:19302"
},
{
urls: "turn:a.relay.metered.ca:80",
username: "xxxxxxxxxx",
credential: "xxxxxxxxxx",
},
{
urls: "turn:a.relay.metered.ca:80?transport=tcp",
username: "xxxxxxxxxx",
credential: "xxxxxxxxxx",
},
{
urls: "turn:a.relay.metered.ca:443",
username: "xxxxxxxxxx",
credential: "xxxxxxxxxx",
},
{
urls: "turn:a.relay.metered.ca:443?transport=tcp",
username: "xxxxxxxxxx",
credential: "xxxxxxxxxx",
},
],
};
const peer = new RTCPeerConnection(configuration);
const stream = await navigator.mediaDevices.getUserMedia({ audio: true, video: true })
peer.addTrack(stream.getTracks()[0], stream)
const offer = await peer.createOffer();
let message = {
id : 'call',
from : from,
to : to,
sdpOffer : offer,
state: 'req_calling'
};
sendMessage(message);
await peer.setLocalDescription(offer);
WebRtcPeer.addPeer(peer)
peer.onicecandidate = function (event) {
if (event.candidate) {
const message = {
id : 'onIceCandidate',
candidate : event.candidate,
to : to,
from: from
}
sendMessage(message);
}
}
// get to know when connected to peer
peer.onconnectionstatechange = function (event) {
console.log('masuk sono')
if (peer.connectionState === 'connected') {
const message = {
id: 'peerConnected',
from: localStorage.getItem('me'),
to: localStorage.getItem('they')
}
sendMessage(message)
}
}
}
// Answering Call Function
export const incomingCall = async (message) => {
const configuration = {
iceServers: [
{
urls: "stun:stun1.l.google.com:19302"
},
{
urls: "turn:a.relay.metered.ca:80",
username: "xxxxxxxxxx",
credential: "xxxxxxxxxx",
},
{
urls: "turn:a.relay.metered.ca:80?transport=tcp",
username: "xxxxxxxxxx",
credential: "xxxxxxxxxx",
},
{
urls: "turn:a.relay.metered.ca:443",
username: "xxxxxxxxxx",
credential: "xxxxxxxxxx",
},
{
urls: "turn:a.relay.metered.ca:443?transport=tcp",
username: "xxxxxxxxxx",
credential: "xxxxxxxxxx",
},
],
}
// create peer using RTC
const peer = new RTCPeerConnection(configuration);
peer.setRemoteDescription(new RTCSessionDescription(message.sdpOffer))
const stream = await navigator.mediaDevices.getUserMedia({ audio: true, video: true })
peer.addTrack(stream.getTracks()[0], stream)
const answer = await peer.createAnswer();
await peer.setLocalDescription(answer);
WebRtcPeer.addPeer(peer)
peer.onicecandidate = function (event) {
if (event.candidate) {
const msg = {
id : 'onIceCandidate',
candidate : event.candidate,
to : message.from,
from: message.to
}
sendMessage(msg);
}
}
// get to know when connected to peer
peer.onconnectionstatechange = function (event) {
if (peer.connectionState === 'connected') {
const message = {
id: 'peerConnected',
from: localStorage.getItem('me'),
to: localStorage.getItem('they')
}
sendMessage(message)
}
}
let response = {
id: 'incomingCallResponse',
from: message.from,
callResponse: 'accept',
sdpOffer: answer,
state: 'acc_calling'
}
sendMessage(response);
localStorage.setItem('they', message.from)
}
每个发送给对等用户的候选项,由于等待呼叫状态,我将其保存到信令服务器中的CandidatesQueue中,如果呼叫被接受并且对等用户上的对等连接被创建,则我开始发送所有候选项。
如果这些信息还不够,这里是我工作的repo:client repo、server repo
我很困惑哪里的错误,是服务器转?还是我的准则
如果你想尝试我的应用程序,这里是链接:myApp
您可以注册帐户并使用已注册的帐户登录。
谢谢!
更新
经过一遍又一遍的测试。可能有联系,但有时候没有。我已经尝试了3种不同的设备,但行为是相同的,有时admin 1可以连接到client 1,但当client 1尝试连接到admin 1时,它不能。还有其他用户,行为真的是随机的,我认为问题出在我的笔记本电脑1上,但当我尝试其他笔记本电脑时,问题发生在随机行为上。你知道吗?
1条答案
按热度按时间taor4pac1#
你有没有用“完美谈判”的逻辑来建立联系?
详情请参阅以下网页:
https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API/Perfect_negotiation