如何为webRTC提供STUN服务器

Question

我制作了一个非常基本的基于 WebRTC 的视频会议应用程序，从我自己的本地网络访问时它效果很好。现在下一步是为其提供 STUN/TURN 服务器，以便可以公开使用。

有很多关于如何为本地电话会议设置 WebRTC 的教程，但几乎没有关于使用 STUN/TURN 服务器的教程。

const iceConfiguration = {}
iceConfiguration.iceServers = [
  {
    urls: 'stun:stun1.l.google.com:19302'
  },
  {
    urls: 'stun:stun3.l.google.com:19302'
  },
  {
    urls: 'stun:stun4.l.google.com:19302'
  }
];

// some stuff happens...

localConnection = new RTCPeerConnection(iceConfiguration);

所以，这在本地有效，但是当我与一些朋友远程测试时，它不起作用。可能的情况是它们都位于对称 NAT 后面，并且我需要使用 TURN 服务器，但我听说 NAT 配置有点罕见，因此它似乎可能适用于至少一个人。这是设置 STUN 服务器的正确方法吗？我真的只能找到一篇关于这方面的教程，网上最多的内容是关于如何构建自己的 TURN/STUN 服务器而不是如何使用......

Answer 1

1. STUN

   和

   TURN

   服务器之间是有区别的，Google提供免费的

   STUN

   服务器可供使用，虽然不推荐用于应用程序，因为你想在出现问题时进行控制，但对于应用程序来说绝对没问题。一个小项目，用于学习是否属于您的情况，并且可以降低项目的复杂性。 （我也不认为在有一些用户的小项目上使用它有那么糟糕）

2. 如果不是这种情况，您将需要自己进行设置。网上有很多关于如何执行此操作的教程，但您确实需要一台服务器。它的要点是打开某些端口并使用一些基本工具（如

   coturn

   ）进行安装。我建议您从头到尾遵循这样的指南，就像这样：

https://medium.com/av-transcode/what-is-webrtc-and-how-to-setup-stun-turn-server-for-webrtc-communication-63314728b9d0

3. 设置完成后，您需要在应用程序中使用它，如下所示：

const iceConfiguration = {
    iceServers: [
        {
            urls: 'turn:my-turn-server.mycompany.com:19403',
            username: 'optional-username',
            credentials: 'auth-token'
        }
    ]
}

const peerConnection = new RTCPeerConnection(iceConfiguration);

4. 涉及很多步骤，您需要了解很多不同的细微差别，这个问题非常笼统，所以我试图给您一些指导，但您需要继续阅读自己，因为这是一个庞大而复杂的主题，所以要做好准备。

Answer 2

这是工作眩晕服务器配置的工作示例

让本地流； 让远程流； 让peerConnection;

常量服务器= { 冰服务器：[ { 网址：['stun:stun1.l.google.com:19302', 'stun:stun3.l.google.com:19302'] } ] }

let init = async () => { localStream =等待 navigator.mediaDevices.getUserMedia( {视频: true, 音频: false} ); document.getElementById('user-1').srcObject = localStream;

createOffer();

}

let createOffer = async () => { peerConnection = new RTCPeerConnection(服务器);

remoteStream = new MediaStream();
document.getElementById('user-2').srcObject = remoteStream;

localStream.getTracks().forEach((track) => {
    peerConnection.addTrack(track, localStream);
});

peerConnection.ontrack = (event) => {
    event.streams[0].getTracks().forEach((track) => {
        remoteStream.addTrack();
    });
};

peerConnection.onicecandidate = async (event) => {
    if (event.candidate) {
        console.log('NEW ice candidate', event.candidate);
    }
}

let offer = await peerConnection.createOffer();
await peerConnection.setLocalDescription(offer);

console.log('Offer:', offer);

}

初始化（）；