技术前言

在前面的教程中, 我们测试程序是发送方和接收方都是同一个页中的 RTCPeerConnection 对象, 所以传递信令只需要在对象间直接拷贝就行, 显得特别简单。但在现实世界中, 发送方和接收方一般是不同的设备, 所以需要具有元数据交换的通道。

在实际应用过程中各终端之间要创建并保持WebRTC通话, 需要互相交换元数据信息, 这个过程被称为信令传输(signaling)。

具体内容包括:

• Offer视频邀请函描述信息

• Answer视频邀请响应信息

• Candidate视频终端ICE候选网络信息

• 候选网络信息(Candidate)

• resolution视频分辨率

• codec视频编解码器

我们可以使用信令服务器(signaling server), 来为WebRTC客户端(peers)之间传递消息。实际上这些信令消息都是纯文本格式的, 也就是将JavaScript对象序列化为字符串的形式。

WebRTC使用客户端方式的JavaScript API, 在实际应用中, 需要有信令服务器(消息服务)的支持, 有时还需要使用 STUN 和 TURN 服务器。

信令服务

本教程使用 Socket.IO 作为信令服务器。由于Socket.IO 内置了 “聊天室”(rooms) 这个概念，所以非常适合用于学习WebRTC信令。

在实际项目中可以自身情况自由选择成熟的信令服务软件，如：Socket.IO 、WebSocket、kafka、RabbitMQ等服务软件。

实践代码

结构思路

客户端

	
		
		
		
		
		
		
		
		
	
	
		
WebRTC实践信令服务
		

			
信令
			

				

					
服务：
					

					

				
				

					
姓名：
					

				
				

					
用户：
					

						
					
				
				

					
内容：
					

					

				
			
		
		

			
运行日志
			
		
	

服务端

var os = require('os');
var nodeStatic = require('node-static');
var http = require('http');
var socketIO = require('socket.io');
var fileServer = new(nodeStatic.Server)();
var app = http.createServer(function(req, res) {
    fileServer.serve(req, res);
}).listen(8000);
var io = socketIO.listen(app);
var persons = [];
var getPersonSeq = function() {
    var tempSeq = Math.floor(Math.random() * 5) + 1;
    persons.forEach(p => {
        if (p.seq == tempSeq) {
            tempSeq = getPersonSeq();
        }
    });
    return tempSeq;
}
io.sockets.on('connection', function(socket) {
    if (persons.indexOf(socket.id) == -1) {
        persons.push({ id: socket.id, seq: getPersonSeq() });
    }
    function trace() {
        //socket.emit('server', arguments);
        console.log(arguments);
    }
    console.log("用户 '" + socket.id + "' 连接成功！");
    socket.emit('ready', socket.id, persons);
    socket.broadcast.emit('change', persons);
    socket.on('disconnect', function() {
        trace('终端(' + socket.id + ')已断开。 ');
        var tempPersons = [];
        persons.forEach(e => {
            if (e.id != socket.id) {
                tempPersons.push(e);
            }
        });
        persons = tempPersons;
        socket.broadcast.emit('change', persons);
    });
    socket.on('message', function(body) {
        var d = new Date();
        body.from = socket.id;
        body.time = d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds();
        socket.to(body.to).emit('message', body);
        trace('终端(' + socket.id + "):", body);
    });
    socket.on('ipaddr', function() {
        var ifaces = os.networkInterfaces();
        for (var dev in ifaces) {
            ifaces[dev].forEach(function(details) {
                if (details.family === 'IPv4' && details.address !== '127.0.0.1') {
                    socket.emit('ipaddr', details.address);
                }
            });
        }
    });
});

运行结果

WebRTC实践历程:

1. WebRTC实践简介

2. WebRTC实践获取视频流

3. WebRTC实践传输视频流

4. WebRTC实践信令服务

5. WebRTC实践点对点通信

6. WebRTC实践视频聊天室

7. WebRTC实践总结