23 | 实战演练：通过WebRTC实现一个1对1音视频实时直播系统
李超
该思维导图由 AI 生成，仅供参考
在前面的 22 篇文章中，我分步骤向你介绍了如何在浏览器上实现一套简单的直播系统。比如，如何采集音视频数据，如何在同一个浏览器上进行音视频通话，如何传输非音视频数据，等等。
但这些知识点都是一个个独立的，并没有形成一个完整的系统，那么本篇文章我们就将所有这些知识点串联起来，做成一个完整的系统。当这套系统搭建完成之后，你就可以在浏览器上实现从北京到上海这种远距离的实时通信了。
接下来我们就来详述这套系统的实现步骤（运行环境的搭建，Web 服务器的实现，信令系统的实现，TURN 服务器的搭建，RTCPeerConnection 的创建，音视频数据的采集、传输、渲染与播放）。通过这部分内容的讲解，再配合我们之前的文章，相信你一定可以快速搭建出这样一套系统来。
运行环境搭建
要实现这套系统，运行环境是特别关键的，其中有三个条件是必须要满足的：云主机、2M 以上的带宽和 HTTPS 证书。
为什么需要这三个条件呢？下面我们就来详细看一下。
云主机就不必多说了，要实现远距离的音视频通信，就得进行信令的交换和数据的中转，这些都需要我们有一台云主机。换句话说，有了云主机后，通信的双方才可以进行信令的交换；在 P2P 不通的情况下，通过服务器中转的方式才能保障端与端之间的连通性。
公开
同步至部落
取消
完成
0/2000
荧光笔
直线
曲线笔记
复制
AI
- 深入了解
- 翻译
- 解释
- 总结
WebRTC实现1对1音视频实时直播系统的文章详细介绍了搭建运行环境、Web服务器实现、信令系统、TURN服务器搭建、RTCPeerConnection的创建、音视频数据的采集、传输、渲染与播放等关键步骤。通过该文章，读者可以快速了解并掌握搭建1对1音视频实时直播系统的关键技术要点。文章以实际代码示例和详细解释为主，涵盖了WebRTC音视频实时直播系统搭建的全面内容，包括运行环境搭建、信令系统实现、TURN服务器部署等前沿技术。读者可以通过本文全面了解浏览器端实现1对1实时音视频通话的整体逻辑，从而实现一个真正的1对1的实时音视频直播系统。
仅可试看部分内容，如需阅读全部内容，请付费购买文章所属专栏
《从 0 打造音视频直播系统》，新⼈⾸单¥59
《从 0 打造音视频直播系统》，新⼈⾸单¥59
立即购买
© 版权归极客邦科技所有，未经许可不得传播售卖。 页面已增加防盗追踪，如有侵权极客邦将依法追究其法律责任。
登录 后留言
全部留言(31)
- 最新
- 精选
dahaowenge老师你好，前几节加入本地流用的addstream 获取远端流用的是onaddstream。这一节里用的是addtrack和ontrack，这两套写法有什么区别么作者回复: addtrack 和 ontrack 是最新的API， 慢慢 addstream 就不用了。
2019-10-314- Geek_leo长沙老师，我要在移动端实现点对点呼叫，A呼叫B的时候，B能被动的拉起视频界面(B事先不知道A想和他视频)，我Android移动端是不是要有一个service服务一直在监听socketio的广播消息，例如在socket.on()监听协商好的指令，然后B在主动选择是否加入房间。不知道是否
作者回复: 是的，你要自己做一个 service 一直侦听着服务端的消息，当有消息呼叫你的时候，你用service将应用拉起来，同时加入到同一个房间里，这样就可以了。
2019-09-1123 - Geek_ab346c老师你好，我下载了你的音视频通话那个，但是我运行了报错，http://file/socket.io/?EIO=3&transport=polling&t=NYh1GRl net::ERR_NAME_NOT_RESOLVED
作者回复: 你需要将它部署到web 服务器上
2021-04-071 
微笑老师你好,我在局域网能实现1v1直播, 但是不同网络下有小概率能成功，请问是什么原因呢？作者回复: 在国内基本是对称性NAT
2021-03-2121- Geek_fe19fe老师，pcConfig中的主机、用户名、密码不是暴露出去了吗，这样别人也可以用，怎么保证安全呢
作者回复: 可以通过动态获取用户名密码的方式，你可以在网上查一下；
2021-01-1521 
白马李工你好， 我想在内网实现每个房间中都是多端（学生）向一端（老师）传输媒体流，只有老师端能看到所有学生的画面，学生只能看到自己的画面。在这种情况下：1. 还需要使用TURN和STUN服务器吗？2. 由于老师端无需传输媒体流数据，在代码实现上是否只需要教师端不向连接addTrack就可以？作者回复: 1，内网就不需要turn 服务了；2. 你可以使用Mesh 方案，并且老师端不调用addtrack
2020-11-2621- Geek_015508老师好，麻烦请教一下，我的服务器是没有域名的，在服务器仅仅将turnserver.conf 中的ream设置为一个IP(如1.2.3.4)，在jsWebRTC中的iceServices仅仅配置为turn:1.2.3.4:3478 这样可否实现relay？
作者回复: relay是不需要域名的，真正需要域名的是web(js)的客户端代码，因为它要访问用户的摄像头或mic
2020-04-151 
王皓月老师您好，WebRTC是否支持浏览器端1对1语音通话，仅语音，不视频作者回复: 当然，你把采集中的视频关掉就好了呀
2020-04-011
Joseph老师我遇到了个新问题，就是createAnswer的时候生成的sdp中并没有candidate信息。配置的参数和您给的一样，只是修改为我的stun/turn服务器地址。请问candidate信息的生成和什么参数有关系？作者回复: 现在的candidate都不会在 SDP 中出现了，都是通过事件触发的，看一下媒体协商的那篇文章
2019-09-1121
橦魚老师，有个问题想请教一下，网页端支持播放avi格式视频，改怎么实现作者回复: 系统默认应该是不支持的，你可以用ffmpeg将 avi 转成浏览器支持的格式，一般都是这样做
2019-09-051
收起评论
