代码之家 › 专栏 › 技术社区 › xendi

WebRTC(简单对等)+没有额外信号的眩晕?

simple-peer webrtc websocket javascript

xendi · 技术社区 · 5 年前

我试图使用简单的对等库来建立浏览器到浏览器的WebRTC连接(数据通道)我的理解是(也许我有一些误解)为了让两个浏览器通过WebRTC连接,它们必须交换SDP数据并执行NAT遍历为此,可以实现STUN服务器。

在simple peer库中,它们声明simple peer不实现信令协议,但它确实提供了一种提供STUN/ICE服务器的方法从网格示例中考虑以下三个HTML文件:

peer1.html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Peer1</title>
</head>
<body>
<script src="../../js/simplepeer.min.js"></script>
<script>
    // These are peer1's connections to peer2 and peer3
    var peer2 = new SimplePeer({ initiator: true, config: {
            iceServers: [
                {urls: 'stun:stun.a-mm.tv:3478'}
            ]
        } })
    var peer3 = new SimplePeer({ initiator: true, config: {
            iceServers: [
                {urls: 'stun:stun.a-mm.tv:3478'}
            ]
        } })

    peer2.on('signal', data => {
        console.log(data)
    })

    peer2.on('connect', () => {
        peer2.send('hi peer2, this is peer1')
    })

    peer2.on('data', data => {
        console.log('got a message from peer2: ' + data)
    })

    peer3.on('signal', data => {
        console.log(data)
    })

    peer3.on('connect', () => {
        peer3.send('hi peer3, this is peer1')
    })

    peer3.on('data', data => {
        console.log('got a message from peer3: ' + data)
    })
</script>
</body>
</html>```

对等2.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Peer2</title>
</head>
<body>
<script src="../../js/simplepeer.min.js"></script>
<script>
    // These are peer2's connections to peer1 and peer3
    var peer1 = new SimplePeer({
        config: {
            iceServers: [
                {urls: 'stun:stun.a-mm.tv:3478'}
            ]
        }
    })
    var peer3 = new SimplePeer({ initiator: true, config: {
            iceServers: [
                {urls: 'stun:stun.a-mm.tv:3478'}
            ]
        } })

    peer1.on('signal', data => {
        console.log(data)
    })

    peer1.on('connect', () => {
        peer1.send('hi peer1, this is peer2')
    })

    peer1.on('data', data => {
        console.log('got a message from peer1: ' + data)
    })

    peer3.on('signal', data => {
        console.log(data)
    })

    peer3.on('connect', () => {
        peer3.send('hi peer3, this is peer2')
    })

    peer3.on('data', data => {
        console.log('got a message from peer3: ' + data)
    })
</script>
</body>
</html>

对等3.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Peer3</title>
</head>
<body>
<script src="../../js/simplepeer.min.js"></script>
<script>
    // These are peer3's connections to peer1 and peer2
    var peer1 = new SimplePeer({
            config: {
                iceServers: [
                    {urls: 'stun:stun.a-mm.tv:3478'}
                ]
            }
        }
    )
    var peer2 = new SimplePeer({
        config: {
            iceServers: [
                {urls: 'stun:stun.a-mm.tv:3478'}
            ]
        }
    })

    peer1.on('signal', data => {
        console.log(data)
    })

    peer1.on('connect', () => {
        peer1.send('hi peer1, this is peer3')
    })

    peer1.on('data', data => {
        console.log('got a message from peer1: ' + data)
    })

    peer2.on('signal', data => {
        console.log(data)
    })

    peer2.on('connect', () => {
        peer2.send('hi peer2, this is peer3')
    })

    peer2.on('data', data => {
        console.log('got a message from peer2: ' + data)
    })
</script>
</body>
</html>

你可以看到我在那里添加了两个眩晕服务器STUN不交换必要的信令数据吗然而,在研究他们的问题时,他们建议使用websockets来交换这些数据那么,我是否可以假设STUN只是为了让每个对等方都可以首先收集SDP信息,然后必须使用websockets来交换它然后,在那之后,浏览器可以互相建立数据通道?

为什么我认为史登处理了这件事当STUN已经能够向客户端提供数据时,引入websockets似乎有点多余当然,我们的目标是尽快停止所有的中央服务器通信,转而使用浏览器到浏览器的数据通道。

一个好的答案可以回答这些问题并修改示例。

1 回复 | 直到 5 年前

Brad 5 年前

我的理解是(也许我有一些误解)为了让两个浏览器通过WebRTC连接,它们必须交换SDP数据。。。

是的,这是正确的。

... 并执行NAT遍历。

他们必须通过ICE建立连接,这可能涉及NAT遍历,是的。

为此,可以实现STUN服务器。

STUN服务器所做的唯一一件事就是试图找出可公开访问的IP地址是什么NAT后面的客户机知道自己的本地地址,但可能不知道自己的公共IP地址,因为它位于进行NAT的路由器的另一端因此,一些外部服务器可以回复并告诉它客户端从哪个IP地址连接。

STUN不交换必要的信令数据吗?

眩晕服务器根本不发信号没有信号发送由您决定,通过您选择的任何方法实现。

我是不是认为眩晕只是为了让每个人都能先收集到SDP信息。。。

主要针对ICE候选(本质上是IP地址和一些其他信息)SDP信息主要由客户端的功能组成(支持哪些编解码器以及支持的速率等)

…然后必须使用websockets来交换它?

它不一定是web套接字可以使用任何双向通信方法,但通常使用web套接字。

当然,我们的目标是尽快停止所有的中央服务器通信,转而使用浏览器到浏览器的数据通道。

是的,不幸的是,WebRTC的当前状态远没有达到这个水平如果网上的客户能互相交谈,那就太棒了沟通的基础不幸的是,事实并非如此仍然需要集中服务器来协调一切只有在其他地方进行了连接设置之后,才能进行对等连接。