「这是我参与2022首次更文挑战的第25天，活动详情查看：2022首次更文挑战」
信令服务器
webrtc的使用需要通过信令服务器进行信令的数据交互，这时候我们就需要一个服务器，对前端来说使用Nodejs是一个很不错的选择，除此之外还可以使用Apache，Nginx。
具体操作步骤
1.安装Nodejs和NPM
这两步一般前端的电脑上都有，就不说怎么安装了，可以通过node -v和npm -v来查看电脑上是否安装成功了
2.使用socket.io库
使用 Nodejs 下的 socket.io 库来实现 WebRTC 信令服务器，因为它内置的有‘房间’这个概念，正好和我们的多人通话类似
3.搭建服务器
创建index.html:
<!DOCTYPE html>
<html>
<head>
<title>WebRTC client</title>
</head>
<body>
<script src='/socket.io/socket.io.js'></script>
<script src='js/client.js'></script>
</body>
</html>
4.创建一个js文件夹用来放clients.js
var isInitiator;
room = prompt('Enter room name:'); //弹出一个输入窗口
const socket = io.connect(); //与服务端建立socket连接
if (room !== '') { //如果房间不空，则发送 "create or join" 消息
console.log('Joining room ' + room);
socket.emit('create or join', room);
}
socket.on('full', (room) => { //如果从服务端收到 "full" 消息
console.log('Room ' + room + ' is full');
});
socket.on('empty', (room) => { //如果从服务端收到 "empty" 消息
isInitiator = true;
console.log('Room ' + room + ' is empty');
});
socket.on('join', (room) => { //如果从服务端收到 “join" 消息
console.log('Making request to join room ' + room);
console.log('You are the initiator!');
});
socket.on('log', (array) => {
console.log.apply(console, array);
});
5.js同目录下创建server.js
const static = require('node-static');
const http = require('http');
const file = new(static.Server)();
const app = http.createServer(function (req, res) {
file.serve(req, res);
}).listen(2013);
const io = require('socket.io')(app); //侦听 2013
io.sockets.on('connection', (socket) => {
// convenience function to log server messages to the client
function log(){
const array = ['>>> Message from server: '];
for (var i = 0; i < arguments.length; i++) {
array.push(arguments[i]);
}
socket.emit('log', array);
}
socket.on('message', (message) => { //收到message时，进行广播
log('Got message:', message);
// for a real app, would be room only (not broadcast)
socket.broadcast.emit('message', message); //在真实的应用中，应该只在房间内广播
});
socket.on('create or join', (room) => { //收到 “create or join” 消息
var clientsInRoom = io.sockets.adapter.rooms[room];
var numClients = clientsInRoom ? Object.keys(clientsInRoom.sockets).length : 0; //房间里的人数
log('Room ' + room + ' has ' + numClients + ' client(s)');
log('Request to create or join room ' + room);
if (numClients === 0){ //如果房间里没人
socket.join(room);
socket.emit('created', room); //发送 "created" 消息
} else if (numClients === 1) { //如果房间里有一个人
io.sockets.in(room).emit('join', room);
socket.join(room);
socket.emit('joined', room); //发送 “joined”消息
} else { // max two clients
socket.emit('full', room); //发送 "full" 消息
}
socket.emit('emit(): client ' + socket.id +
' joined room ' + room);
socket.broadcast.emit('broadcast(): client ' + socket.id +
' joined room ' + room);
});
});
6.通过npm安装socket.io和node-static库
npm install socket.io
npm install node-static
7.启动服务
node server.js
不出意外的话会出错，报错提示# sokcet var io = require(‘socket.io‘).listen(server)； not a function，这是因为socket.io版本是3.0以上，这里边不在使用listen()方法，所以把socket.io降为2.*版本即可
npm i socket.io@2.0.3
7.打开浏览器测试
在浏览器中输入 localhost:2013 ，然后新建一个tab 在里边再次输入localhost:2013 。如果在浏览器看到如下内容则说明成功
