HowTo文档

如何在XSwitch中使用WebRTC

XSwitch中支持WebRTC。WebRTC是一种实时通信协议，可以用于音视频通话、视频会议等。

WebRTC是一个媒体层的协议，因而，在实际使用时，还需要一个信令层的协议，XSwitch支持以下协议：

  • SIP over WebSocket
  • Verto （@xswitch/rtc）
  • WHIP/WHAP/WHXP

前置条件

WebRTC在最初就把安全性作为一个重要的设计目标，WebRTC在现在浏览器上，要求必须有一个安全的源（Origin）才可以启用。

所谓Origin，其实就是承载WebRTC的网页。一般来说，有以下安全的源：

  • https:// 地址
  • http://localhost
  • file://

简言之，在生产环境中，网页必须使用HTTPS协议才可以启用WebRTC。但有时候为了开发调试方便，使用HTTP协议时，允许在localhost网址上的网页启用WebRTC，有时候本地file://地址也可以。

在macOS等平台上，在第一次使用时还需要浏览器向系统申请打开这些音视频输入设备的权限，以及共享桌面的权限等。

除此之外，有些版本的Chrome浏览器还有个命令行参数，可以允许在任何网址上启用WebRTC：

chrome --unsafely-treat-insecure-origin-as-secure="http://ip:port" --user-data-dir=本地目录

其中，ip:port是你的HTML网页地址，本地目录是一个本地目录，用于存储浏览器的配置信息。

此外，Chrome中有一个参数，打开 chrome://flags 界面，搜索unsafe，可以找到unsafely-treat-insecure-origin-as-secure，将该参数启用，它会将不安全的源视为安全的源。

一般来说，信令是基于Websocket实现的，同样，在http://地址上，使用ws://协议，而在https://网址上，则使用wss://协议，不能混用。

启用WebRTC

在安全的连接上，基于Verto的WebRTC会自动启用，在Web管理界面右下角会出现一个【电话】按钮。

如果您的产品中有基于WebRTC的视频会议等相关的功能，则也可以直接使用。

除此之外，你也可以尝试XSwitch云上的相关Demo。我们有一个基于xTalk的WebRTC Demo页面，可以通过关注“小樱桃科技”微信公众号，输入demo获取相应的登录信息。

在Demo页面上，开放了以下端口可以测试WebRTC功能：

  • 10160：SIP端口，UDP、TCP
  • 10161：SIP端口，TLS
  • 10180：SIP端口，UDP、TCP
  • 10179：SIP端口，TLS
  • 10181：Verto端口，HTTP、WS
  • 10182：Verto端口，HTTPS、WSS
  • 10183：SIP端口，WS
  • 10184：SIP端口，WSS
  • 443：Nginx端口http://demo.xswitch.cn
    • 通过wss://demo.xswitch.cn/ws代理到10181
    • 通过wss://demo.xswitch.cn/sip代理到10183
    • 通过wss://demo.xswitch.cn/sips代理到10184
  • SBC：通过sbc.xswitch.cn代理SIP
    • 1001：SIP，UDP、TCP、WS，转发到相应的SIP端口
    • 1002：SIP，TLS、WSS，转发到相应的SIP端口

Verto协议

XSwitch支持FreeSWITCH原生的Verto协议，Verto协议是基于Websocket的，在上面又通过JSON-RPC进行了一层封装，有以下与SIP类似的方法：

  • verto.login 登录
  • verto.invite 发起呼叫
  • verto.answwer 应答
  • verto.bye 挂断
  • verto.info 发送信息，如DTMF、Chat等

XSwitch默认即支持Verto。事实上，XSwitch的HTTP也是基于Verto模块实现的。

XSwitch默认使用的端口是8081，对应ws，而8082对应wss。在使用wss时，需要设置证书，wss.pem。

大多数时候，在生产环境，可以直接在Nginx中配置相应的HTTPS证书，使用proxy_pass转给后端的ws或wss端口。示例Nginx配置如下（其中...代表省略）：

upstream xswitch {
	server 10.10.10.10:8081;
}

server {
    ...

    location /ws { # websocket
            proxy_connect_timeout 7d;
            proxy_send_timeout 7d;
            proxy_read_timeout 7d;
            proxy_pass http://xswitch;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
    }

    location /api/ { # API请求
		proxy_set_header Host $http_host;
        proxy_pass http://xswitch;
    }

    ...
}

Nginx可以完美代理Verto协议。

示例和代码：

SIP over WebSocket

SIP over Websocket默认不启用。可以按以下步骤启用。

  • 在SIP Profile中启用ws-binding参数
  • 在SIP Profile中启用wss-binding参数，同时设置好证书，参见TLS。

当然，也可以完全在XSwitch中不启用基于Websocket的SIP协议，而是在前面放一个Nginx或Kamailio，再代理到对应的SIP端口（由于WebRTC相关的SIP包通常比较大，如果UDP包无法承载，可以尝试TCP）。

示例和代码：

WHIP/WHAP/WHXP

WHIP的全称是WebRTC-HTTP ingestion protocol，在浏览器中直接使用HTTP收发SDP进行协商，以启用简单的WebRTC推流。

WHIP是单向的（在Web端是sendonly）推流协议，与之相对有一个单向的WHAP协议，实现了recvonly。XSwitch中将两种协议结合，实现了sendrecv，即双向推拉流。详见示例代码。

小结

WebRTC简化了音视频的开发与应用，但它总归是要处理音视频和网络等各种情况，所以还是非常复杂的，XSwitch也仅在商业版本中支持WebRTC使用与开发。如果你在使用时有任何问题，请联系我们的技术支持。

如何在XSwitch中使用JWT
如何在XSwitch中使用ASR及TTS(二)