webrtc第二篇 聊天室
聊天室模型不一样考虑的问题也不一样
1.websocket文本聊天
* step1 : 向聊天室所有用户(不包括该用户自己)发送当前用户上线信息。客户端用户栏回添加此用户
* step2 : 将该用户添加至连接池中
* step3 : 向该用户发送该聊天室所有用户列表
* 注:step1 和 step2 顺序颠倒时,会在客户端显示两个"自己"
A客户端向服务器发送消息,服务器向所有连接上的websocket客户端发送消息。
2.webrtc聊天室查看所有人音视频
A客户端已经加入聊天室,B客户端后加入。
B客户端
step1:B客户端加入后获取所有在线用户。
step2:向所有PeerConnection发送Offer类型信令
//向所有PeerConnection发送Offer类型信令
skyrtc.prototype.sendOffers = function() {
var i, m,
pc,
that = this,
pcCreateOfferCbGen = function(pc, socketId) {
return function(session_desc) {
pc.setLocalDescription(session_desc);
that.socket.send(JSON.stringify({
"eventName": "__offer",
"data": {
"sdp": session_desc,
"socketId": socketId
}
}));
};
},
pcCreateOfferErrorCb = function(error) {
console.log(error);
};
for (i = 0, m = this.connections.length; i < m; i++) {
pc = this.peerConnections[this.connections[i]];
pc.createOffer(pcCreateOfferCbGen(pc, this.connections[i]), pcCreateOfferErrorCb);
}
};
step3:接收到answer类型信令后将对方的session描述写入PeerConnection中
//接收到answer类型信令后将对方的session描述写入PeerConnection中
skyrtc.prototype.receiveAnswer = function(socketId, sdp) {
var pc = this.peerConnections[socketId];
pc.setRemoteDescription(new nativeRTCSessionDescription(sdp));
};
A客户端:
step1:接收到Offer类型信令后作为回应返回answer类型信令
//接收到Offer类型信令后作为回应返回answer类型信令
skyrtc.prototype.receiveOffer = function(socketId, sdp) {
var pc = this.peerConnections[socketId];
this.sendAnswer(socketId, sdp);
}; //发送answer类型信令
skyrtc.prototype.sendAnswer = function(socketId, sdp) {
var pc = this.peerConnections[socketId];
var that = this;
pc.setRemoteDescription(new nativeRTCSessionDescription(sdp));
pc.createAnswer(function(session_desc) {
pc.setLocalDescription(session_desc);
that.socket.send(JSON.stringify({
"eventName": "__answer",
"data": {
"socketId": socketId,
"sdp": session_desc
}
}));
}, function(error) {
console.log(error);
});
};
参考:
https://segmentfault.com/a/1190000000436544
webrtc第二篇 聊天室的更多相关文章
- 使用WebRTC搭建前端视频聊天室——信令篇
博客原文地址 建议看这篇之前先看一下使用WebRTC搭建前端视频聊天室——入门篇 如果需要搭建实例的话可以参照SkyRTC-demo:github地址 其中使用了两个库:SkyRTC(github地址 ...
- WebRTC搭建前端视频聊天室——信令篇
这篇文章讲述了WebRTC中所涉及的信令交换以及聊天室中的信令交换,主要内容来自WebRTC in the real world: STUN, TURN and signaling,我在这里提取出的一 ...
- 使用WebRTC搭建前端视频聊天室——点对点通信篇
WebRTC给我们带来了浏览器中的视频.音频聊天体验.但个人认为,它最实用的特性莫过于DataChannel——在浏览器之间建立一个点对点的数据通道.在DataChannel之前,浏览器到浏览器的数据 ...
- 使用WebRTC搭建前端视频聊天室——数据通道篇
本文翻译自WebRTC data channels 在两个浏览器中,为聊天.游戏.或是文件传输等需求发送信息是十分复杂的.通常情况下,我们需要建立一台服务器来转发数据,当然规模比较大的情况下,会扩展成 ...
- 使用WebRTC搭建前端视频聊天室——入门篇
http://segmentfault.com/a/1190000000436544 什么是WebRTC? 众所周知,浏览器本身不支持相互之间直接建立信道进行通信,都是通过服务器进行中转.比如现在有两 ...
- WebRTC搭建前端视频聊天室——数据通道篇
本文翻译自WebRTC data channels 在两个浏览器中,为聊天.游戏.或是文件传输等需求发送信息是十分复杂的.通常情况下,我们需要建立一台服务器来转发数据,当然规模比较大的情况下,会扩展成 ...
- WebRTC实现网页版多人视频聊天室
因为产品中要加入网页中网络会议的功能,这几天都在倒腾 WebRTC,现在分享下工作成果. 话说 WebRTC Real Time Communication 简称 RTC,是谷歌若干年前收购的一项技术 ...
- [Asp.net 开发系列之SignalR篇]专题三:使用SignalR实现聊天室的功能
一.引言 在前一篇文章中,我向大家介绍了如何实现实现端对端聊天的功能的,在这一篇文章中将像大家如何使用SignalR实现群聊这样的功能. 二.实现思路 要想实现群聊的功能,首先我们需要创建一个房间,然 ...
- 使用WebRTC搭建前端视频聊天室
在两个浏览器中,为聊天.游戏.或是文件传输等需求发送信息是十分复杂的.通常情况下,我们需要建立一台服务器来转发数据,当然规模比较大的情况下,会扩展成多个数据中心.这种情况下很容易出现很高的延迟,同时难 ...
随机推荐
- python print输出unicode字符
命令行提示符下,python print输出unicode字符时出现以下 UnicodeEncodeError: 'gbk' codec can't encode character '\u30fb ...
- iOS - NSError用法规范
iphone跬步之--错误信息 NSError 一.获取系统的错误信息 比如移动文件时,获取文件操作错误: NSError *e = nil;[[NSFileManager defaultMana ...
- HDU1392Surround the Trees(凸包判断 + 求周长)
http://www.cnblogs.com/hmhard/archive/2013/02/05/2893035.html 这是判断三角区域那块写的不好. 判断凸包的方法: 1.将所有点按照y从小到大 ...
- JavaScript之继承(原型链)
JavaScript之继承(原型链) 我们知道继承是oo语言中不可缺少的一部分,对于JavaScript也是如此.一般的继承有两种方式:其一,接口继承,只继承方法的签名:其二,实现继承,继承实际的方法 ...
- Saltstack之SSH(十一)
Saltstack之SSH 安装 yum install -y salt-ssh 官方文档 https://docs.saltstack.com/en/latest/topics/ssh/index ...
- gnuplot使用1
安装之后,迫切需要运行一个程序来看看,首先要找到软件默认的使用路径: 输入 show loadpath命令就会显示默认查找的几个路径, loadpath is loadpath from GNUPLO ...
- 常用机器视觉工具----图像分析工具(blob分析)
http://blog.sina.com.cn/s/blog_67cc4eb70100ivnt.html Blob分析:Blob分析目的在于对图像中的2-D形状进行检测和分析,得到诸如目标位置.形状. ...
- Yocto开发笔记之《嵌入式linux libcurl编程》(QQ交流群:519230208)
开了一个交流群,欢迎爱好者和开发者一起交流,转载请注明出处. QQ群:519230208,为避免广告骚扰,申请时请注明 “开发者” 字样 =============================== ...
- BZOJ3685: 普通van Emde Boas树
显然这题的所有操作都可以用set,但是直接用set肯定要T,考虑到读入量较大,使用fread读入优化,就可以卡过去了. #include<bits/stdc++.h> using name ...
- Spring 通过maven pom文件配置初始化
spring对bean的生命周期管理的比较精细,并不是单纯的new()实例化. 1,找到class配置信息并将其实例化 2,受用依赖注入,按照配置信息,配置bean的所有属性; 在一个开始使用前可以用 ...