How to use PHP and WebRTC protocol for real-time audio and video communication
In today's Internet era, real-time audio and video communication has become an indispensable part of people's daily lives. WebRTC (Web Real-Time Communication) technology, as an open real-time communication standard, provides powerful support for embedding real-time audio and video communication in Web applications. This article will introduce how to use PHP and WebRTC protocol for real-time audio and video communication, and provide corresponding code examples.
The following is an example of a simple signaling server implemented using the Ratchet WebSocket library:
<?php
use RatchetMessageComponentInterface;
use RatchetConnectionInterface;
require 'vendor/autoload.php';
class SignalingServer implements MessageComponentInterface
{
protected $clients;
public function __construct()
{
$this->clients = new SplObjectStorage;
}
public function onOpen(ConnectionInterface $conn)
{
$this->clients->attach($conn);
}
public function onMessage(ConnectionInterface $from, $msg)
{
foreach ($this->clients as $client) {
if ($client !== $from) {
$client->send($msg);
}
}
}
public function onClose(ConnectionInterface $conn)
{
$this->clients->detach($conn);
}
public function onError(ConnectionInterface $conn, Exception $e)
{
$conn->close();
}
}
$server = RatchetServerIoServer::factory(
new RatchetHttpHttpServer(
new RatchetWebSocketWsServer(
new SignalingServer()
)
),
8080
);
$server->run();Please note that the Ratchet WebSocket library is used in the above code to implement the WebSocket server. You can use Composer to install the library.
The following is a code example of a simple WebRTC application:
<!DOCTYPE html>
<html>
<head>
<title>WebRTC Video Chat</title>
</head>
<body>
<video id="localVideo" autoplay></video>
<video id="remoteVideo" autoplay></video>
<button id="startButton">Start Call</button>
<button id="hangupButton">Hang Up</button>
<script src="https://webrtc.github.io/adapter/adapter-latest.js"></script>
<script>
const startButton = document.getElementById('startButton');
const hangupButton = document.getElementById('hangupButton');
const localVideo = document.getElementById('localVideo');
const remoteVideo = document.getElementById('remoteVideo');
let localStream;
let peerConnection;
startButton.addEventListener('click', startCall);
hangupButton.addEventListener('click', hangup);
async function startCall() {
localStream = await navigator.mediaDevices.getUserMedia({audio: true, video: true});
localVideo.srcObject = localStream;
const configuration = {iceServers: [{urls: 'stun:stun.l.google.com:19302'}]};
peerConnection = new RTCPeerConnection(configuration);
peerConnection.addEventListener('icecandidate', handleIceCandidate);
peerConnection.addEventListener('track', handleRemoteStreamAdded);
localStream.getTracks().forEach(track => {
peerConnection.addTrack(track, localStream);
});
const offer = await peerConnection.createOffer();
await peerConnection.setLocalDescription(offer);
// 将信令通过WebSocket发送给信令服务器
sendSignaling(JSON.stringify(offer));
}
async function handleIceCandidate(event) {
if (event.candidate) {
sendSignaling(JSON.stringify({ice: event.candidate}));
}
}
async function handleRemoteStreamAdded(event) {
remoteVideo.srcObject = event.streams[0];
}
async function hangup() {
localStream.getTracks().forEach(track => {
track.stop();
});
peerConnection.close();
// 发送挂断信令给信令服务器
sendSignaling(JSON.stringify({hangup: true}));
}
function sendSignaling(message) {
const ws = new WebSocket('ws://localhost:8080');
ws.addEventListener('open', () => {
ws.send(message);
ws.close();
});
}
</script>
</body>
</html>In the above code, we first obtain the local audio and video stream through the getUserMedia API and display it on the page Make a presentation. Then, we created an RTCPeerConnection object and listened to the icecandidate and track events for it. Through the createOffer method, we generate an SDP (Session Description Protocol) for exchange between devices, and set the local description through the setLocalDescription method. Finally, we send this SDP signaling to the signaling server.
Signaling server:
<?php
// ...
public function onMessage(ConnectionInterface $from, $msg)
{
$data = json_decode($msg);
if (isset($data->sdp)) {
// 处理SDP信令（包括offer和answer）
foreach ($this->clients as $client) {
if ($client !== $from) {
$client->send($msg);
}
}
} elseif (isset($data->ice)) {
// 处理ICE候选信令
foreach ($this->clients as $client) {
if ($client !== $from) {
$client->send($msg);
}
}
} elseif (isset($data->hangup)) {
// 处理挂断信令
foreach ($this->clients as $client) {
if ($client !== $from) {
$client->send($msg);
$this->onClose($client);
}
}
}
}
// ...WebRTC application:
// ...
async function handleSignalingMessage(message) {
const data = JSON.parse(message);
if (data.sdp) {
await peerConnection.setRemoteDescription(new RTCSessionDescription(data.sdp));
if (data.sdp.type === 'offer') {
const answer = await peerConnection.createAnswer();
await peerConnection.setLocalDescription(answer);
// 发送回答信令给信令服务器
sendSignaling(JSON.stringify(answer));
}
} else if (data.ice) {
await peerConnection.addIceCandidate(new RTCIceCandidate(data.ice));
} else if (data.hangup) {
// 处理挂断信令
hangup();
}
}
// ...When device A initiates a call to device B through the signaling server When, device B will receive a WebSocket message containing offer signaling. Device B accepts the call request by setting the remote description and generates its own answer signaling, which it then sends back to Device A.
Once device A receives the reply signaling from device B, it will set its remote description and start establishing a connection with device B. By exchanging ICE candidate signaling, device A and device B will find an optimal communication path.
When device A or device B ends the call, they will send a hangup signaling to the signaling server and close the connection with the other party.
Summary
By using PHP and WebRTC protocols, we can easily achieve real-time audio and video communication. In this article, we learned about the basic principles and usage of WebRTC, and provided corresponding code examples. I hope that the introduction of this article can help readers understand how to use PHP and WebRTC protocols for real-time audio and video communication.
The above is the detailed content of How to use PHP and WebRTC protocol for real-time audio and video communication. For more information, please follow other related articles on the PHP Chinese website!
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
