javascript 通过 Websockets 的 WebRTC 视频聊天
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/16655544/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
WebRTC videochat through Websockets
提问by user2402604
I'm trying to develop a video-chat application using webRTC and WebSockets for signaling. My problem is that I don't know exactly what is the process of creating RTCPeerConnection and connect both peers(2 browsers) through webSocket(Locally at least).
我正在尝试使用 webRTC 和 WebSockets 来开发视频聊天应用程序作为信号。我的问题是我不知道创建 RTCPeerConnection 并通过 webSocket(至少在本地)连接两个对等点(2 个浏览器)的过程是什么。
I know how to communicate clients though WebSockets, but not with the RTCPeerConnection API, you know any tutorial step-by-step explaining the process?(Offer SDP, answers, ICE, ...) and, on the other hand, how looks the server code to managing these clients through RTCPeerConnection?
我知道如何通过 WebSockets 与客户端通信,但不知道如何使用 RTCPeerConnection API,你知道任何教程一步一步解释这个过程吗?(提供 SDP,答案,ICE,...),另一方面,看起来如何通过 RTCPeerConnection 管理这些客户端的服务器代码?
Here is my Node.js code for the server
这是我用于服务器的 Node.js 代码
"use strict";
// Optional. You will see this name in eg. 'ps' or 'top' command
process.title = 'node-webrtc';
// Port where we'll run the websocket server
var webSocketsServerPort = 1337;
// websocket and http servers
var webSocketServer = require('websocket').server;
var http = require('http');
/* ---------------------------------
GLOBAL VARIABLES
----------------------------------*/
// latest 100 messages
//var history = [ ];
// list of currently connected clients (users)
var clients = [ ];
/* ---------------------------------
HTTP SERVER
----------------------------------*/
var server = http.createServer(function(request, response) {
// Not important for us. We're writing WebSocket server, not HTTP server
});
server.listen(webSocketsServerPort, function() {
console.log((new Date()) + " Server is listening on port " + webSocketsServerPort);
});
/* ---------------------------------
WEBSOCKET SERVER
----------------------------------*/
var wsServer = new webSocketServer({
// WebSocket server is tied to a HTTP server. WebSocket request is just
// an enhanced HTTP request. For more info http://tools.ietf.org/html/rfc6455#page-6
httpServer: server
});
// This callback function is called every time someone
// tries to connect to the WebSocket server
wsServer.on('request', function(request) {
console.log((new Date()) + ' Connection from origin ' + request.origin + '.');
// accept connection - you should check 'request.origin' to make sure that
// client is connecting from your website
// (http://en.wikipedia.org/wiki/Same_origin_policy)
var connection = request.accept(null, request.origin);
// we need to know client index to remove them on 'close' event
var index = clients.push(connection) - 1;
console.log((new Date()) + ' Connection accepted.');
// user sent some message
connection.on('message', function(message) {
for (var i=0; i < clients.length; i++) {
clients[i].sendUTF(message);
}
});
// user disconnected
connection.on('close', function(conn) {
console.log((new Date()) + " Peer " + conn.remoteAddress + " disconnected.");
// remove user from the list of connected clients
clients.splice(index, 1);
});
});
回答by Sam Dutton
You might want to have a look at the codelab I did for Google I/O: bitbucket.org/webrtc/codelab.
您可能想看看我为 Google I/O 所做的代码实验室:bitbucket.org/webrtc/codelab。
Step 5shows how to set up a signaling server using socket.io, and Step 6puts this together with RTCPeerConnection to make a simple video chat app.
Step 5展示了如何使用socket.io 设置信令服务器,Step 6将其与RTCPeerConnection 结合起来制作一个简单的视频聊天应用程序。
You might also want to have a look at easyRTC(full stack) and Signalmaster(signaling server created for SimpleWebRTC).
您可能还想看看easyRTC(全栈)和Signalmaster(为SimpleWebRTC创建的信令服务器)。
The 'canonical' WebRTC video chat example at apprtc.appspot.comuses XHR and the Google App Engine Channel API for signaling.
apprtc.appspot.com 上的“规范”WebRTC 视频聊天示例使用 XHR 和 Google App Engine Channel API 进行信号传输。
回答by AeroBuffalo
Have you looked at or come across WebRTC.io? It is an opensource GitHub project that utilizes Node.js and websockets to do the exact thing you are talking about. I, not being much of a javascript person, was able to figure out what it was doing within a week. It isn't a step by step instruction, but anyone with javascript experience would be able to figure out the function call order.
你看过或遇到过WebRTC.io吗?它是一个开源的 GitHub 项目,它利用 Node.js 和 websockets 来做你正在谈论的事情。我不是一个 javascript 人,能够在一周内弄清楚它在做什么。这不是一步一步的说明,但任何有 JavaScript 经验的人都能够弄清楚函数调用顺序。
There are two bits to the code: the server sideand the client side. The server side is run with Node.js, and serves up the client side code to the browser. If I remember correctly, since the two projects are separate, if you want to combine them you will have to copy the webrtcio.js file from the client side and paste it into the server side folder. Although, I think if you clone the github repository right, you might not have to worry about that.
代码有两个部分:服务器端和客户端。服务器端使用 Node.js 运行,并将客户端代码提供给浏览器。如果我没记错的话,由于这两个项目是分开的,如果你想合并它们,你必须从客户端复制 webrtcio.js 文件并将其粘贴到服务器端文件夹中。不过,我认为如果您正确克隆 github 存储库,您可能不必担心。