sip.js初探

前言

项目中我们有个通过浏览器进行人工外呼的需求,这边就涉及了一些voip相关的技术栈。使用freeswitch作为软交换平台,sip(会话初始协议)来作为信令的载体,结合webrtc等相关技术实现浏览器端拨打电话的需求。sip.js是使用javascript对sip协议进行了封装,它恰恰也是结合了webrtc来帮助我们快速构建浏览器端音视频的实时传输。

关于sip协议

sip如同我们熟悉的http协议一样,是一个基于文本的应用层信令控制协议,它也是采用了请求/响应的方式进行通信。常见的请求消息包括:

  • INVITE:表示主叫用户发起会话请求
  • ACK:客户端向服务器端证实它已经收到了对INVITE请求的最终响应
  • BYE:表示终止一个已经建立的呼叫(呼叫结束)
  • CANCEL:表示在收到对请求的最终响应之前取消该请求,对于已完成的请求则无影响。

除此之外,还有其他的一些请求类型,但是并不常用,常见的基本上就是这4种。当收到请求后,服务端需要作出响应,例如客户端发起INVITE请求后,服务端开始建立会话,此时会依次发送以下响应消息,表示当前会话状态:

  • 100试呼叫(Trying)
  • 180/183表示正在外呼,此时可以有振铃或者早起媒体。180和183的区别,可参考这篇文章
  • 200成功响应

这时候客户端需要返回一个ACK表示已成功建立会话。这里的3种响应消息,只代表着一通电话正常建立的情况,还有一些标识错误的消息,例如401未授权、486线路忙等等,可以看到其和http非常像,有标识码和描述信息。不过要注意,sip只是用于创建、修改和释放一个或多个参与者的会话,具体的选择何种会话类型、语音编解码信息、负载信息等需要通过sdp(会话描述协议)来控制。上面提到的183或是200响应状态,均会携带sdp信息,用于建立媒体通道,关于sdp报文格式,可以参考这篇文章

深入sip.js

sip.js使用javascript对sip协议进行了封装,我们上面提到过sip只是用来控制会话的建立和修改,它并不提供会话描述、会议控制等功能,这些是通过sdp来进行描述的。并且它也不能提供媒体通道的建立,在浏览器端建立媒体通道,我们最容易想到的就是webrtc,sip正是通过webrtc来进行媒体通道的建立。有关webrtc的相关学习,我们可以参考这个。学习过webrtc之后我们知道,webrtc的客户端之间是通过建立RTCPeerConnection(简称pc)来实现音视频数据流的传输。在建立pc之前,也需要去交换一些媒体信息,我们称之为signaling过程。signaling用来交换三种信息:

  • 连接控制信息:初始化或者关闭连接报告错误。
  • 网络配置:对于外网,我们电脑的 IP 地址和端口。
  • 多媒体数据:使用什么编码解码器,浏览器可以处理什么信息。

而webrtc已经提供api让我们快速生成这些媒体数据,即pc的createOffer方法和createAnswer方法,而他们生成的数据恰恰就是上面提到的sdp格式的文本。因此我们可以得出结论,webrtc也是通过sdp来进行媒体数据的交换,从而建立媒体通道的。至于为什么会分createOffer方法和createAnswer方法,是因为signaling采取了一种offer/answer的方式,类似于请求/问答,发起方发送offer,应答方发送answer,双方交换媒体信息之后才会完成signaling,从而建立pc。媒体数据的交换可以采取多种传输方式,sip.js中默认使用的是websocket进行传输。举个例子可以让大家更加清晰得明白使用sip.js之后一通会话的建立过程:

  1. 客户端发起invite请求,invite中携带了客户端的媒体数据,通过createoffer方法封装成sdp报文,一并传输给服务端
  2. 服务端收到请求(我们是用freeswitch),解析sdp,发起呼叫,同时向客户端发送呼叫状态的响应,如100、183、200,在183和200的时候均会携带服务端sdp,区别在于200是真正建立的通话,183可能会携带早期媒体等信息。
  3. 客户端默认情况会解析200状态所携带的sdp信息,至此完成signaling过程,媒体通道建立,开始对话。

总结

通过以上的介绍,我们可以看出sip和webrtc的关系,它们其实负责实现不同的功能,但又可以非常好的结合在一起构建更强大的应用。sip主要负责会话的创建和管理,而webrtc用于建立媒体通道,从而实现浏览器端音视频流的传输,而sip.js正是将两者结合,从而帮助大家快速开发出大型web端的会话应用。本文只对sip.js的原理进行部分解读,并没有介绍如何使用这些技术,具体还需要参考文档或是可以阅读源码获得更多的信息。

原文地址:https://www.cnblogs.com/danceonbeat/p/12167666.html

时间: 2024-10-29 10:50:31

sip.js初探的相关文章

第二天,关于sip的学习(试着去架构个web端网络电话连接下可参考sip.js。通过web拨打电话)(3)

这个是一直想去操作的,因为这个和我第一天说的web端的客户管理系统想关联,不可能一直用软件拨打,最好还是可以通过web去拨打网络电话 试着去学习下sip.js..弄明白 先问下百度先生吧..讲sip.js一些源码下载下来分析下吧 下载了sip.js  下载地址http://sipjs.com/download/ 无意间学了一个  再配置文件中更改端口号的地方 找到freeSWITCH安装目录下的conf\sip_profiles\internal.xml.取消注释以下行 <param name=

JS初探_0702(一)

此文转载自:http://www.cnblogs.com/nhsd/p/3783900.html!非常感谢,写的十分详尽 JavaScript是一门轻量型的面向Web编程的脚本言语言,常被简称为:JS.广泛应用于PC和各种移动设备中,常和HTML.CSS一起组成网页页面.它也常被一些人和Java相关连起来,然而实质上它们完全是两种不同的编程语言(当我遇到这事后,才相信原来还真有人这么认为).JavaScript的运行,需要解释器(“引擎”),为浏览器的一部分.本章的内容为: 1.  JS的引用.

angular.js初探

2015年7月27日 22:26:35 星期一 用在我论坛里的小栗子: 先列出来一级回帖, 点击帖子前边的"查看回复"按钮无刷新的去请求该帖子的所有回复 首先要引用js文件, 我这里使用的是bootstrap提供的cdn <script src="http://cdn.bootcss.com/angular.js/1.4.3/angular.js"></script> 接下来是自己的js代码 1 //bbsController 2 bbsAp

Three.js学习笔记 – “我和小伙伴都惊呆了”的特效和Three.js初探

什么是Three.js three.js是JavaScript编写的WebGL第三方库.提供了非常多的3D显示功能.Three.js 是一款运行在浏览器中的 3D 引擎,你可以用它创建各种三维场景,包括了摄影机.光影.材质等各种对象.你可以在它的主页上看到许多精采的演示.不过,这款引擎目前还处在比较不成熟的开发阶段,其不够丰富的 API 以及匮乏的文档增加了初学者的学习难度(尤其是文档的匮乏)three.js的代码托管在github上面. 上面摘自百度百科.依我来看就是一个在HTML5画布(ca

node入门(二)——gulpfile.js初探

本文关于gulpfile.js怎么写,利于完成个性化需求.本文开发环境默认已安装node,详情参考<node入门(一)——安装>. 一.安装gulp npm install -g gulp 二.进入项目根目录,创建package.json文件 npm init 现在项目目录下新增了package.json文件,内容如下: 三.在package.json里增加devDependencies配置项,告诉node在install时要下载哪些插件模块,例如下面是要加载gulp-less插件: gulp

hammer.js初探

最近觉得自己的进步比较慢了,很有可能是因为中文区的学习和百度的使用极大的限制了自己的视野,所以,以后无论是新技术的学习,还是问题的解决,做到以下几点: 新技术的学习必须通过英文文档,而不是翻译过来的蹩脚的中文文档. 问题的搜寻通过google.通过stackoverflow,如果在知道其局限性的情况下再去百度或者其他方法. 遇到有问题的词汇就通过Google翻译搜寻,但实际上这时候通过百度也是可以的,因为百度知道的存在也是有用的. 嗯,第一个完整的英文文档就从hammer.js开始吧! 加油.

React.js初探(一)

前端框架多如牛毛的今天,团队的技术选型很重要,没有最好的,只有最合适的,这话早已经被说烂了. 但是作为一个有追求的前端,对新技术的敏感以及尝试心理还是要有的. 虽然React已经火的不行了,但由于自己的惰性,好吧,就是懒,看了很多的技术文章,但是一直没有开始去学习这个框架. 今天就开始这个框架的学习吧 - -...也作为本博第一篇文章... 前言 React中,把一切东西都看成组件,每个组件都有其状态. 一个组件与多种有限状态,但同时只能有一个状态.学术上这叫有限状态机 对于HTML而言,Rea

Vue.js初探

在Vue.js的初识篇了解了Vue的内部指令,并做了一些简单的小案例。这一篇来了解Vue的全局API。 Vue的全局API:在构造器外部用Vue提供的API函数来定义新功能。 首先了解一下自定义指令的生命å‘

Sea.js 初探

参考:http://chaoskeh.com/blog/why-seajs.html https://github.com/seajs/seajs/issues/547 一个月前,打开博客园想看下小坦克写的文章,发现文章不见了,一个星期前,想看下放在收藏夹的Sea.js的文章,不幸的是这篇文章是发布在百度空间的,百度空间停了,文章也因此无法查看了,由于本人比较笨,又没有什么基础,花了好久时间才把Sea.js的基本用法给琢磨出来,其实以前也琢磨出来过N次,但是苦于没有机会去使用,没过几天又忘了,哪