Go最全利用Swoft实现PHP+websocket直播，即时通讯代码_php webrtc实现，2024年最新快速从入门到精通

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上Go语言开发知识点，真正体系化！

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频，并且后续会持续更新

如果你需要这些资料，可以戳这里获取

} else {
// 浏览器不支持 WebSocket123
alert(“您的浏览器不支持 WebSocket!”);
return true;
}
}

if(websocketOpen()){
console.log(‘链接失败’)
}

let ws = new WebSocket(“wss://localhost.com/con_camera/camera”);

ws.onopen = function (evt) {
alert(‘连接成功’)
}

ws.onmessage = function (evt) {
let received_msg = evt.data
console.log(received_msg);
}

ws.onclose = function (){
alert(‘关闭链接’)
}

*new WebSocket(“wss://localhost.com/con\_camera/camera”)*
  
 这里 
 **wss**代表服务器配置了https证书，如果服务器没有配置证书需要用 
 **ws**
  

![在这里插入图片描述](https://img-blog.csdnimg.cn/20190613163217358.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpYW9mZWlxYXE=,size_16,color_FFFFFF,t_70)



> 
> 以上内容是PHP部分，没有多少需要编辑的。php.swoft只做转发和广播
> 
> 
> 




---


## webRtc部分


#### 首先需要了解WebSocket，MediaDevices，RTCPeerConnection，信令服务器作用


###### WebSocket


基本都知道吧，不懂的看 [官方文档]( )


WebSocket 对象提供了用于创建和管理 WebSocket 连接，以及可以通过该连接发送和接收数据的 API。


基本理解成 它是一个双向管道










 浏览页面 
 







 股票服务器 
 







 管理人员 
 















 我们搭建个管道吧 
 




 ok,我一有消息就通知你 
 




 操作服务器,A股涨了30元 
 




 服务器通知：A股涨了30元 
 




 操作服务器,B股涨了20元 
 




 服务器通知：B股涨了20元 
 




 我关闭了,不用推送了 
 






 服务器关闭浏览页面 
 

 的管道不在推送 
 






 浏览页面 
 






 股票服务器 
 






 管理人员 
 






---


###### MediaDevices 媒体设备


简单的理解成。调用媒体设备，获取 摄像头媒体设备 输入的信息 [官方文档]( )




---


###### RTCPeerConnection


简单理解成**本地到远端**的连接 [官方文档]( )  
 官方推荐引入[Adapter.js]( )保持浏览器的兼容性




---


###### 信令服务器


作为webRTC中极为重要的一部分，会话管理需要建立服务器端与客户端之间的连接。  
 有人就问了：webRTC建立的是点对点连接，流数据是从浏览器直接传输到另一个浏览器，不需要服务器周转，怎么还需要建立服务器端与客户端连接呢？  
 这是个很好的问题！尽管webRTC建立的是P2P连接，但由于流数据传输需要一条信道，而这个信道则是由信令服务器提供的。而在webRTC中并没有这一过程，所以需要我们手动建立信号的传递和交涉过程。


信令服务器的实现软件有很多，我们这里用**coturn**[官方文档]( )



> 
> 参考原文：https://blog.csdn.net/vainfanfan/article/details/82632737
> 
> 
> 




---


###### 我们组合一下信息


![看着应该能明白了](https://img-blog.csdnimg.cn/20190614140852872.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpYW9mZWlxYXE=,size_16,color_FFFFFF,t_70)


1. 主播与客户端建立**websocket**通道
2. 通过**web**获取流媒体**MediaDevices**
3. 主播生成流媒体通道**插座信息**，通过**websocket**传输给客户，客户受到信息后设置**插销信息**  
与主播建立流媒体通道**RTCPeerConnection**。并且把**主播**把**流媒体**通过流媒体通道传给**客户端**
4. 这中间通过**coturn信令服务器**把流媒体穿透给外网，让客户端可以在外网获取


**步骤很简单，但是中间遇到很多坑，我会把遇到的问题，也列出来**




---


#### 实现MediaDevices获取流媒体


 
 
 需要的文件 
 
 
[jquery-3.2.1.min.js]( )


[adapter.js]( )这个最好用迅雷下载 
 

<meta charset="utf-8">
<meta name="description" content="php web-rtc例子,一对一聊天-基于workerman">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
<meta itemprop="description" content="Video chat using the reference WebRTC application">
<meta itemprop="name" content="AppRTC">
<meta name="mobile-web-app-capable" content="yes">
<meta id="theme-color" name="theme-color" content="#1e1e1e">
<title>webRtc视频通话</title>

![在这里插入图片描述](https://img-blog.csdnimg.cn/20190614145159556.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpYW9mZWlxYXE=,size_16,color_FFFFFF,t_70)  
 我的电脑摄像头坏了




---


#### 实现链接媒体通道RTCPeerConnection 在局域网内可测试


###### 用上面的代码修改下

<meta charset="utf-8">
<meta name="description" content="php web-rtc例子,一对一聊天-基于workerman">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
<meta itemprop="description" content="Video chat using the reference WebRTC application">
<meta itemprop="name" content="AppRTC">
<meta name="mobile-web-app-capable" content="yes">
<meta id="theme-color" name="theme-color" content="#1e1e1e">
<title>webRtc视频通话</title>

---


###### 主播页面和粉丝页面不同的地方

<meta charset="utf-8">
<meta name="description" content="php web-rtc例子,一对一聊天-基于workerman">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
<meta itemprop="description" content="Video chat using the reference WebRTC application">
<meta itemprop="name" content="AppRTC">
<meta name="mobile-web-app-capable" content="yes">
<meta id="theme-color" name="theme-color" content="#1e1e1e">
<title>webRtc主播</title>