聊天室模型不一样考虑的问题也不一样

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第二篇 聊天室的更多相关文章

  1. 使用WebRTC搭建前端视频聊天室——信令篇

    博客原文地址 建议看这篇之前先看一下使用WebRTC搭建前端视频聊天室——入门篇 如果需要搭建实例的话可以参照SkyRTC-demo:github地址 其中使用了两个库:SkyRTC(github地址 ...

  2. WebRTC搭建前端视频聊天室——信令篇

    这篇文章讲述了WebRTC中所涉及的信令交换以及聊天室中的信令交换,主要内容来自WebRTC in the real world: STUN, TURN and signaling,我在这里提取出的一 ...

  3. 使用WebRTC搭建前端视频聊天室——点对点通信篇

    WebRTC给我们带来了浏览器中的视频.音频聊天体验.但个人认为,它最实用的特性莫过于DataChannel——在浏览器之间建立一个点对点的数据通道.在DataChannel之前,浏览器到浏览器的数据 ...

  4. 使用WebRTC搭建前端视频聊天室——数据通道篇

    本文翻译自WebRTC data channels 在两个浏览器中,为聊天.游戏.或是文件传输等需求发送信息是十分复杂的.通常情况下,我们需要建立一台服务器来转发数据,当然规模比较大的情况下,会扩展成 ...

  5. 使用WebRTC搭建前端视频聊天室——入门篇

    http://segmentfault.com/a/1190000000436544 什么是WebRTC? 众所周知,浏览器本身不支持相互之间直接建立信道进行通信,都是通过服务器进行中转.比如现在有两 ...

  6. WebRTC搭建前端视频聊天室——数据通道篇

    本文翻译自WebRTC data channels 在两个浏览器中,为聊天.游戏.或是文件传输等需求发送信息是十分复杂的.通常情况下,我们需要建立一台服务器来转发数据,当然规模比较大的情况下,会扩展成 ...

  7. WebRTC实现网页版多人视频聊天室

    因为产品中要加入网页中网络会议的功能,这几天都在倒腾 WebRTC,现在分享下工作成果. 话说 WebRTC Real Time Communication 简称 RTC,是谷歌若干年前收购的一项技术 ...

  8. [Asp.net 开发系列之SignalR篇]专题三:使用SignalR实现聊天室的功能

    一.引言 在前一篇文章中,我向大家介绍了如何实现实现端对端聊天的功能的,在这一篇文章中将像大家如何使用SignalR实现群聊这样的功能. 二.实现思路 要想实现群聊的功能,首先我们需要创建一个房间,然 ...

  9. 使用WebRTC搭建前端视频聊天室

    在两个浏览器中,为聊天.游戏.或是文件传输等需求发送信息是十分复杂的.通常情况下,我们需要建立一台服务器来转发数据,当然规模比较大的情况下,会扩展成多个数据中心.这种情况下很容易出现很高的延迟,同时难 ...

随机推荐

  1. iOS评分(给个好评)

    id 721996244 可以测试 NSString *str = [NSString stringWithFormat:@"itms-apps://itunes.apple.com/app ...

  2. Redis+Spring缓存实例

    转自:小宝鸽 一.Redis了解 1.1.Redis介绍: redis是一个key-value存储系统.和Memcached类似,它支持存储的value类型相对更多,包括string(字符串).lis ...

  3. js字符串RTrim方法(right trim)

    String.prototype.RTrim = function (c) { if (!c) { c = ' '; } var reg = new RegExp('([' + c + ']*$)', ...

  4. Python学习笔记——文件写入和读取

    1.文件写入 #coding:utf-8 #!/usr/bin/env python 'makeTextPyhton.py -- create text file' import os ls = os ...

  5. RandomAccessFile类

    File类只是针对文件本身进行操作,而如果要对文件内容进行操作,则可以使用RandomAccessFile类,此类属于随机读取类,可以随机地读取一个文件中指定位置的数据. //============ ...

  6. Android学习笔记——download

    该工程的功能是实现从网上的链接下载一个lrc文件和一个mp3文件 以下代码是MainActivity.java中的代码 package com.example.download; import com ...

  7. Unity multi_compile

    http://docs.unity3d.com/Manual/SL-MultipleProgramVariants.html http://forum.unity3d.com/threads/tuto ...

  8. ecshop商品-》获取促销商品

    lib_goods.php->function get_promote_goods(){} /** * 获得促销商品 * * @access public * @return array */ ...

  9. iOS监听键盘事件

    #pragma mark - view life cycle - (void)viewDidLoad { [super viewDidLoad]; [[NSNotificationCenter def ...

  10. MathType中如何批量修改公式字体和大小

    MathType中如何批量修改公式字体和大小 关于MathType : MathType 是由美国Design Science公司开发的功能强大的数学公式编辑器,它同时支持Windows和Macint ...