WebRTC 、 ICE服务 、信令服务器视频通讯(互联网版本)

安装NAT穿透服务器(ICE Server)

brew install  coturn

//   启动服务
brew services restart coturn

//  添加用户
turnadmin -a -u admin -r realm -p admin


// 测试服务
turnutils_peer -p 34800
turnutils_uclient -v -e 192.168.1.112 -r 34800 -u admin -w admin -p 3478 192.168.1.112

安装信令服务器

git clone https://github.com/andyet/signalmaster.git
npm install
node server.js


### 修改  server.js  110
if (!config.turnorigins || config.turnorigins.indexOf(origin) !== -1) {
            config.turnservers.forEach(function (server) {
                credentials.push({
                    username: server.username,
                    credential: server.credential,
                    urls: server.urls || server.url
                });
            });
        }

### development.json
{
  "isDev": true,
  "server": {
    "port": 8888,
    "/* secure */": "/* whether this connects via https */",
    "secure": false,
    "key": null,
    "cert": null,
    "password": null
  },
  "rooms": {
    "/* maxClients */": "/* maximum number of clients per room. 0 = no limit */",
    "maxClients": 0
  },
  "stunservers": [
    {
      "urls": "stun:192.168.1.112:3478"
    }
  ],
  "turnservers": [
    {
      "urls": ["turn:192.168.1.112:3478"],
      "username": "admin",
      "credential":"admin",
      "expiry": 86400
    }
  ]
}

浏览器端页面

  • index.html
<!DOCTYPE html>

<html>

<head>

    <script src="http://libs.baidu.com/jquery/1.9.0/jquery.min.js"></script>
    <script src="simplewebrtc-with-adapter.bundle.js"></script>
    <style>
        #remoteVideos video {
            height: 150px;
        }
        #localVideo {
            height: 150px;
        }
    </style>

</head>

<body>

    <textarea id="messages" rows="5" cols="20"></textarea>
    <br/>
    <input id="text" type="text" />
    <input id="send" type="button" value="send" />
    <br/>
    <video id="localVideo"></video>
    <div id="remoteVideos"></div>
    <script>
        var webrtc = new SimpleWebRTC({
            localVideoEl: 'localVideo',
            remoteVideosEl: 'remoteVideos',
            autoRequestMedia: true,
            url:'http://localhost:8888',  //signal服务器
            nick: 'yubaolee'
        });
        webrtc.on('readyToCall', function () {
            webrtc.joinRoom('room1');
            $('#send').click(function () {
                var msg = $('#text').val();
                webrtc.sendToAll('chat', { message: msg, nick: webrtc.config.nick });
                $('#messages').append('<br>You:<br>' + msg + '\n');
                $('#text').val('');
            });

        });

        webrtc.connection.on('message', function (data) {
            if (data.type === 'chat') {
                console.log('chat received', data);
                $('#messages').append('<br>' + data.payload.nick + ':<br>' + data.payload.message + '\n');
            }

        });
    </script>
</body>

</html>
posted @ 2024-03-06 17:52  vx_guanchaoguo0  阅读(73)  评论(0编辑  收藏  举报