使用 Janus WebRTC 媒体服务器构建视频会议

Janus 是由Meetecho开发的一款通用的 WebRTC 服务器。除了实现与浏览器建立 WebRTC 媒体通信、与其交换 JSON 消息以及在浏览器和服务器端应用程序逻辑之间中继 RTP/RTCP 和消息之外,它本身不提供任何功能。任何特定的功能/应用程序均由服务器端插件提供,然后浏览器可以通过 Janus 进行联系以利用它们提供的功能。此类插件的示例可以是回声测试、会议桥、媒体记录器、SIP 网关等应用程序的实现。

一般而言,媒体服务器(尤其是 Janus)可能有点复杂。特别是对于不熟悉 WebRTC 的 Web 开发人员。此外,还有其他媒体服务器可能会提供更多在线文档、npm 模块以及更多框架和代码语言的 SDK,以帮助经验不足的 WebRTC 开发人员。然而,Janus 的出色性能、较小的占用空间以及活跃的开源存储库和社区使其成为希望使用最新支持的 WebRTC 功能的开发人员的流行选择。

现在,让我们尝试一下 Janus,并用它构建一个测试视频会议应用程序。

Janus 媒体服务器配置

要部署 Janus Media Server,你可以手动安装或使用 Docker 等工具来简化安装和部署。但是,如果您想跳过手动安装和配置,可以使用这个通用的Janus WebRTC Server docker 容器。在本地运行此程序后,可以通过打开http://localhost:8088/janus/info来测试它是否可以访问。它应该显示您尝试联系的 Janus 实例中可用的内容。

Web应用程序

为了让我们的视频会议应用程序正常工作,您的 Web 应用程序需要与 Janus WebRTC 服务器通信并让它连接多个参与者。为了实现这一目标,我们将使用 janus.js 与 Janus Media Server API 进行通信,并将每个客户端附加到 VideoRoom 插件。

使用 Janus WebRTC 媒体服务器构建视频会议
3个参与者如何连接到Janus VideoRoom插件,开始一个房间,并使用WebRTC发布媒体和订阅其他参与者的视频的图示。

一旦准备好 janus.js 并在客户端应用程序中使用 Janus 对象,你将需要:

1. 连接到 Janus VideoRoom 插件并获取句柄

Janus.init({debug: "all", callback: function() {
                // Make sure the browser supports WebRTC
                // Create session
                janusRoom = new Janus(
                    {
                        server: server,
                        success: function() {
                            // Attach to VideoRoom plugin
                            janusRoom.attach(
                                {
                                    plugin: "janus.plugin.videoroom",
                                    opaqueId: opaqueId,
                                    success: function (pluginHandle) {
//...

2. 使用此句柄发送“注册消息”

 const register = { "request": "join", "room": myroom, "ptype": "publisher",   "display": reg };
  vroomHandle.send({ "message": register });

3. 处理 Janus 的“已加入”响应并开始发布

onmessage: function (msg, jsep) {  var event = msg["videoroom"];
  if (event === "joined") {
    // Publisher/manager created, negotiate WebRTC and attach to feeds
    myid = msg["id"];
    Janus.log("Successfully joined room " + msg["room"] + " with ID " + myid);
    publishOwnFeed();    //...

4. 订阅其他参与者的新提要 

onmessage: function (msg, jsep) {
  var event = msg["videoroom"];
  if (event === "event") {
    if (msg["publishers"] !== undefined && msg["publishers"] !== null) {
      var list = msg["publishers"];
      for(var f in list) {
        var id = list[f]["id"];
        var display = list[f]["display"];
        var audio = list[f]["audio_codec"];
        var video = list[f]["video_codec"];
        newRemoteFeed(id, display, audio, video);
      }
    }
//...

newRemoteFeed 将创建一个新的插件句柄并作为订阅者附加到它。完整的 js 代码示例地址:https://github.com/meetecho/janus-gateway/blob/master/html/videoroomtest.js。

然后使用 Chrome、Edge、Firefox 或 Safari,在三个或更多单独的选项卡上打开 Web 应用程序的 URL(即 http://localhost:3000),你应该能够与多个参与者进行连接。

使用 Janus WebRTC 媒体服务器构建视频会议
连接多个参与者的Web 应用程序演示

注意:要在本地使用 Janus,并且通常使用 WebRTC,您需要在 chrome://flags/#allow-insecure-localhost 中启用不安全来源

就是这样!你​已经​创建​了​自己​的​定制​视频​会议!如果想查看一些示例,可以在演示页面https://janus.conf.meetecho.com/demos.html查看,其中显示了使用 Janus 插件的几个有趣的用例,例如 SIP 网关、VP9-SVC 视频室、实时流媒体、录制等。

参考资料:
https://webrtc.ventures/2020/12/janus-webrtc-media-server-video-conference-app/

本文来自作者投稿,版权归原作者所有。如需转载,请注明出处:https://www.nxrte.com/jishu/webrtc/28146.html

(0)

相关推荐

发表回复

登录后才能评论