随着视频通话的普及，越来越多的应用程序需要集成实时通信功能。而 WebRTC（Web Real-Time Communication）技术正好满足了这个需求，它可以在不需要插件的情况下实现浏览器之间的视频、音频、屏幕共享等实时通信。
webrtc-videocall 是一个基于 WebRTC 封装而成的 npm 包，它提供了一个简单易用的 API，方便开发者快速集成视频通话功能。
安装 webrtc-videocall
要安装 webrtc-videocall，首先需要确保你在本地已经安装了 Node.js 和 npm。在命令行窗口中执行以下命令安装 webrtc-videocall：
--- ------- ----------------
初始化 webrtc-videocall 实例
当安装完成后，就可以在项目中使用 webrtc-videocall 了。下面我们来看一下如何初始化一个 webrtc-videocall 实例。
我们首先需要在项目中引入 webrtc-videocall：
----- --------------- - ----------------------------
接着，我们可以创建一个 webrtc-videocall 实例：
----- --------------- - --- ------------------
我们也可以在初始化过程中，指定一些配置参数。下面是一个示例：
----- --------------- - --- ----------------- ------------- ------------------------------------------ -------------------- ------------- --------------------- ------------- ---
其中， signalingUrl 是信令服务器的地址；localVideoElementId 是本地视频的 DOM 元素 ID；remoteVideoElementId 是远程视频的 DOM 元素 ID。
加入房间
在初始化完 webrtc-videocall 实例后，我们可以开始加入一个房间。下面是一个示例代码：
------------------------------------ ------------------- -- - ----------------------- ---------------- -- - ------------------------ ------- ---
在加入房间时，我们需要指定房间名称和用户名称。
发起呼叫
当我们成功加入了一个房间之后，就可以开始呼叫其他用户了。下面是一个示例代码：
--------------------------------------------- -- - --------------------- ---------------- -- - ---------------------- ------- ---
在发起呼叫时，我们需要指定目标用户的名称。
接收呼叫
如果有其他用户呼叫我们，我们需要及时接听。下面是一个示例代码：
--------------------------------- -- -
-- ----------------------------------- -
-------------------------------------------- -- -
---------------------
---------------- -- -
---------------------- -------
---
- ---- -
-------------------------------------------- -- -
---------------------
---------------- -- -
---------------------- -------
---
-
---在接收呼叫时，我们可以弹出一个确认框供用户选择是否接听。如果用户选择接听，我们可以调用 answerCall 方法进行接听；如果用户选择拒绝，我们可以调用 rejectCall 方法进行拒绝。
结束通话
当通话结束时，我们需要调用 hangUp 方法进行挂断。下面是一个示例代码：
-------------------------------- -- - --------------------- ---------------- -- - ---------------------- ------- ---
这样，我们就完成了一个简单的视频通话应用程序了。更多详细的 API 可以参考官方文档。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60067356890c4f7277583bfd