WebRTC + JsSIP + freeSWITCH一对一视频聊天

之前几篇文件介绍了 freeSWITCH 和 WebRTC 结合在一起需要的各种环境，现在到了最关键的一篇，使用 JsSIP 来创建一个 DEMO 。这次我们需要写点 JS 代码。

准备 JsSIP 库文件

可以从 http://www.jssip.net/download/ 下载一个 min 版的 js 文件，我用的是 3.0.13 ，文件名是 jssip-3.0.13.min.js ，把它放在我们之前用 Node.js 建立的 https 服务器的 public/js 目录下，我们将在 html 文件内引用它。类似：

配置 freeSWITCH

我们之前下载的 freeSWITCH ，默认是不处理音视频编解码的，所以，要设置它采用 media proxy 模式来代理转发 WebRTC 的音视频，这样就可以基于 JsSIP 、 WebRTC 、 freeSWITCH 来一对一视频聊天。

修改vars.xml，加入：

    <X-PRE-PROCESS cmd=="set" data="proxy_media=true"/>

修改sip_profiles/internal.xml，设置inbound-proxy-media和inbound-late-negotiation为true，类似下面：

    
    <param name="inbound-proxy-media" value="true"/>

    
    <param name="inbound-late-negotiation" value="true"/>

这样配置之后，freeSWITCH 会进入代理模式，不对media 做任何处理，直接在两个 end peer 之间转发（RTP包）。

JsSIP DEMO

JsSIP 的 API 文档参考下面链接：

• http://www.jssip.net/documentation/3.0.x/api/
• http://www.jssip.net/documentation/3.0.x/api/session/
• http://www.jssip.net/documentation/3.0.x/api/ua/

注意， JsSIP 对 SIP 和 WebRTC 做了封装，比如你不需要自己调用 getUserMedia 来捕获音视频了， JsSIP 会根据你传给JsSIP.UA.call方法的参数来自己调用，用起来比较方便。

但是，你还是要了解 SIP 呼叫的流程和WebRTC的各种限制以及如何处理 RTCPeerConnection 发过来的音视频流。

关于 WebRTC JS 侧 API，看这里好了：http://w3c.github.io/webrtc-pc/。

想看更多资料，可以看我搜集的这些链接：WebRTC学习资料大全。

关于 SIP 的流程，参考《freeSWITCH权威指南》这本书吧，讲得很明白。

网上关于 JsSIP + freeSWITCH 的 demo 很少，而且基本跑不起来……我这个是验证过的啦！

直接给出我们的 demo.html 的所有代码：

  
  
  
  
  
  





  

    

      

        
SIP URI:
        

      
      

        
SIP Password:
        

      
      

        
WSS URI:
        

      
      

        
SIP Phone Info:
        

      
      

        
 Initialize 
      
      

        
 Call 
      
      

        
 Capture Local Media
      
    
  

  

        
  


  

关于 JsSIP.UA 和 JsSIP.RTCSession 等类和 API 的使用，参考代码，对照 JsSIP 的官方文档，即可理解。

注意我在代码里调用 RTCSession 的 answer 方法做了自动接听。实际开发中，你需要弹出一个提示框，让用户选择是否接听。

一对一视频聊天的效果：

先运行 freeSWITCH , 验证启动正常（参看freeSWITCH安装、配置与局域网测试），再运行 npm start启动 https 服务器，最后 Chrome 内访问 https://192.168.40.131:8080/demo.html ，看到下面的结果：

注意，必须填写有效信息，然后先点击 Initialize 来初始化，代码中会到 freeSWITCH 那里注册 SIP 号码，然后才可以呼叫别人。

被呼叫方只需要填写信息，点击 Initialize 按钮，不需要点击 Call 按钮。

填写所有参数，点击 Initialize 按钮，可以注册一个 SIP 号码 1000（使用开发者工具可查看我输出的日志）。

然后到另一台电脑访问同一个链接，注册一个不同的账号 1002。

再回到初始的那台电脑，在 SIP Phone Info 后输入 sip:[email protected]:5060，然后点击 Call 按钮，即可呼叫 1002 ，接通后，可以看到对方视频。效果如下：

我测试的摄像头有问题，出来的是抽象视频……

这是我们使用 JsSIP 和 freeSWITCH 构建视频聊天的简单 DEMO 。

想起来一点非常重要的：freeSWITCH 和 nodejs 实现的 https 服务器，使用的证书应该是一个，否则会报错哦。可以先跑 freeSWITCH ，然后把 cert/wss.pem 文件的内容分拆给 nodejs 使用。

---

相关阅读：

• freeSWITCH安装、配置与局域网测试
• 使用nodejs为WebRTC+freeSWITCH搭建https服务
• freeSWITCH + WebRTC 音视频会议
• 使用Zoiper与freeSWITCH开视频会议
• Windows下编译freeSWITCH
• 使用freeSWITCH和Yate进行VoIP通话