我从以下网站获取此代码 http://asher2003.wordpress.com/2013/11/18/webrtc-code-example/
html 文件
<!DOCTYPE html>
<html>
<head>
<meta name='keywords' content='WebRTC, HTML5, JavaScript' />
<meta name='description' content='WebRTC Reference App' />
<meta name='viewport' content='width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1'>
<base target='_blank'>
<title>WebRTC client</title>
<!-- <link rel='stylesheet' href='css/main.css' /> -->
</head>
<body>
<div id='container'>
<div id='videos'>
<video id='localVideo' autoplay muted></video>
<video id='remoteVideo' autoplay></video>
</div>
</div>
<script src='/socket.io/socket.io.js'></script>
<script src='js/main.js'></script>
</body>
</html>
server.js 文件
var static = require('node-static');
var http = require('http');
var file = new(static.Server)();
var app = http.createServer(function (req, res) {
file.serve(req, res);
}).listen(2013);
var io = require('socket.io').listen(app);
io.sockets.on('connection', function (socket){
function log(){
var array = [">>> Message from server: "];
for (var i = 0; i < arguments.length; i++) {
array.push(arguments[i]);
}
socket.emit('log', array);
}
socket.on('message', function (message) {
log('Got message: ', message);
// For a real app, should be room only (not broadcast)
socket.broadcast.emit('message', message);
});
socket.on('create or join', function (room) {
var numClients = io.sockets.clients(room).length;
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);
} else if (numClients == 1) {
io.sockets.in(room).emit('join', room);
socket.join(room);
socket.emit('joined', room);
} else { // max two clients
socket.emit('full', room);
}
socket.emit('emit(): client ' + socket.id + ' joined room ' + room);
socket.broadcast.emit('broadcast(): client ' + socket.id + ' joined room ' + room);
});
});
这对于一对一视频 session 效果很好。但是如何将其转换为广播/一对多?
我尝试更改上面的行
} else if (numClients == 1) {
io.sockets.in(room).emit('join', room);
socket.join(room);
socket.emit('joined', room);
到 numClients==2 但它不起作用。屏幕上没有出现任何内容
更新 我的 main.js 中有这个
function handleRemoteStreamAdded(event) {
console.log('Remote stream added.');
remoteVideo.src = window.URL.createObjectURL(event.stream);
remoteStream = event.stream;
}
所以上面的函数改为
function handleRemoteStreamAdded(event){
remoteVideo = document.createElement('video');
if(document.getElementById( "remoteVideos" ).childNodes.length == 0){
remoteVideo.setAttribute('id','remoteVideo1');
} else {
remoteVideo.setAttribute('id','remoteVideo2');
}
document.getElementById( "remoteVideos" ).appendChild(remoteVideo);
remoteVideo.src = window.URL.createObjectURL(event.stream);
remoteVideo.play();
}
更新2
我收到此错误..
最佳答案
因为
io.sockets.in(room).emit('join', room);
调用一个已经创建的套接字连接(客户端),但是当你有numClients == 2
意味着您需要告诉另外两个客户发送他们的信息。
所以,使用
var clients = io.sockets.clients(room);
clients.forEach(function(client){
client.emit('join', room);
client.join(room);
client.emit('joined', room);
});
这应该可以解决问题。
即使在 html 上 替换
<video id='remoteVideo' autoplay></video>
与
<div id="remoteVideos"></div>
在 main.js 或您使用 webrtc 客户端的 js 中的句柄远程流上,找到实例化远程视频的函数,在我的例子中,该函数的名称是 handleRemoteStreamAdded
并添加以下内容。
remoteVideo = document.createElement('video');
if(document.getElementById( "remoteVideos" ).childNodes.length == 0){
remoteVideo.setAttribute('id','remoteVideo1');
} else {
remoteVideo.setAttribute('id','remoteVideo2');
}
document.getElementById( "remoteVideos" ).appendChild(remoteVideo);
remoteVideo.src = window.URL.createObjectURL(event.stream);
remoteVideo.play();
关于javascript - 使用 Node.js 进行一对多/广播的 Webrtc,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21402840/