WebSockets API는 실시간 영상 및 음성 채팅을 구현하는 데 중요한 부분으로, 양방향 통신을 실현할 수 있는 이벤트 기반 메커니즘을 기반으로 하는 통신 방법을 제공하여 브라우저와 서버 간의 통신을 더욱 간단하고 빠르며 안전하게 만듭니다. . 이 기사에서는 실시간 비디오 및 오디오 채팅을 위해 PHP에서 WebSockets API를 사용하는 방법을 소개합니다.
PHP에서 WebSockets API를 사용하려면 먼저 WebSocket 서버를 설치해야 합니다. PHP에서 가장 널리 사용되는 WebSocket 서버인 Rachet을 사용하는 것이 좋습니다. Composer를 사용하여 설치할 수 있습니다:
composer require cboden/ratchet
Rachet을 사용하여 WebSocket 서버를 생성하는 것은 매우 간단하며 몇 줄의 코드만 필요합니다.
require dirname(__DIR__) . '/vendor/autoload.php';
use RatchetMessageComponentInterface;
use RatchetConnectionInterface;
use RatchetServerIoServer;
use RatchetHttpHttpServer;
use RatchetWebSocketWsServer;
class Chat implements MessageComponentInterface {
protected $clients;
public function __construct() {
$this->clients = new SplObjectStorage;
}
public function onOpen(ConnectionInterface $conn) {
$this->clients->attach($conn);
echo "New connection! ({$conn->resourceId})
";
}
public function onMessage(ConnectionInterface $from, $msg) {
broadcast($msg);
}
public function onClose(ConnectionInterface $conn) {
$this->clients->detach($conn);
echo "Connection {$conn->resourceId} has disconnected
";
}
public function onError(ConnectionInterface $conn, Exception $e) {
echo "An error has occurred: {$e->getMessage()}
";
$conn->close();
}
public function broadcast($msg) {
foreach ($this->clients as $client) {
$client->send($msg);
}
}
}
$server = IoServer::factory(
new HttpServer(
new WsServer(
new Chat()
)
),
8080
);
echo "Server started!
";
$server->run();이 서버는 모든 연결을 수락하고 도착하는 메시지를 브로드캐스트합니다. . Grad 스트림 객체를 사용하여 모든 연결을 저장합니다.
WebSockets API를 사용하면 크로스 플랫폼과 크로스 브라우저에서 프런트 엔드 애플리케이션을 만들 수 있습니다. JavaScript를 사용하여 프런트 엔드 애플리케이션을 만드는 방법은 다음과 같습니다.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Chat</title>
<meta name="description" content="Chat">
<meta name="author" content="Chat">
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.4.5/socket.io.min.js"></script>
<style>
#log {
height: 200px;
overflow: auto;
}
</style>
</head>
<body>
<div id="log"></div>
<input type="text" id="message">
<button id="send">Send</button>
<script>
var socket = io('http://localhost:8080');
socket.on('message', function (data) {
$('#log').append('<p>' + data + '</p>');
});
$('#send').click(function() {
var message = $('#message').val();
socket.emit('message', message);
});
</script>
</body>
</html>Socket.io를 사용하여 연결하면 애플리케이션이 메시지를 받고 보냅니다.
Ratchet 및 WebSockets API를 통해 양방향 실시간 영상 및 음성 채팅이 가능하며, 이를 위해서는 몇 가지 추가 라이브러리와 도구를 사용해야 합니다. 브라우저 간 P2P 통신을 허용하는 실시간 통신의 최신 표준인 WebRTC를 사용하는 것이 좋습니다.
PHP에서 WebSocket 서버와 WebRTC DSP를 사용하면 양방향 실시간 비디오 및 오디오 채팅 애플리케이션을 만들 수 있습니다. 이를 위해서는 몇 가지 추가 JavaScript 코드가 필요하며 SimpleWebRTC를 사용하여 구현할 수 있습니다.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Chat</title>
<meta name="description" content="Chat">
<meta name="author" content="Chat">
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.4.5/socket.io.min.js"></script>
<script src="//simplewebrtc.com/latest-v3.js"></script>
<style>
#log {
height: 200px;
overflow: auto;
}
#localVideo {
width: 200px;
height: 150px;
margin-bottom: 10px;
}
#remoteVideos video {
width: 400px;
height: 300px;
margin-bottom: 10px;
}
</style>
</head>
<body>
<div id="log"></div>
<div id="localVideo"></div>
<div id="remoteVideos"></div>
<script>
var server = {
url: 'http://localhost:8080',
options: {},
// Use media servers for production
signalingServerUrl: 'https://localhost:8888'
};
var webrtc = new SimpleWebRTC({
localVideoEl: 'localVideo',
remoteVideosEl: 'remoteVideos',
autoRequestMedia: true,
url: server.url,
socketio: {'force new connection': true},
debug: false,
detectSpeakingEvents: true,
autoAdjustMic: false,
peerConnectionConfig: {
iceServers: [
{url: 'stun:stun.l.google.com:19302'},
{url:'stun:stun1.l.google.com:19302'},
{url:'stun:stun2.l.google.com:19302'}
]
},
receiveMedia: {
mandatory: {
OfferToReceiveAudio: true,
OfferToReceiveVideo: true
}
}
});
webrtc.on('readyToCall', function () {
console.log('readyToCall');
webrtc.joinRoom('chat');
});
webrtc.on('localStream', function (stream) {
console.log('localStream');
$('#localVideo').show();
});
webrtc.on('videoAdded', function (video, peer) {
console.log('videoAdded');
$('#remoteVideos').append('<video id="' + peer.id + '" autoplay></video>');
webrtc.attachMediaStream($('#' + peer.id), video);
});
webrtc.on('videoRemoved', function (video, peer) {
console.log('videoRemoved');
$('#' + peer.id).remove();
});
webrtc.on('channelMessage', function (peer, label, message) {
console.log('channelMessage');
console.log('peer: ' + peer);
console.log('label: ' + label);
console.log('message: ' + message);
});
</script>
</body>
</html>SimpleWebRTC는 여기에서 비디오 및 오디오 채팅을 구현하는 데 사용됩니다. 코드에는 클라이언트 및 서버 코드가 포함되어 있으며, 사용자가 페이지를 방문하면 클라이언트는 WebSocket 서버에 연결하고 룸에 참여하려고 시도합니다. 서버는 WebSocket 이벤트를 SimpleWebRTC에 전달합니다.
요약
Rachet 및 WebSockets API를 사용하면 양방향 실시간 영상 및 음성 채팅이 가능합니다. SimpleWebRTC를 사용하면 실시간 오디오 및 비디오 채팅을 지원하도록 애플리케이션을 쉽게 확장할 수 있습니다. WebRTC는 온라인 교육 시스템, 협업 애플리케이션, 온라인 게임 등 다양한 애플리케이션에서 사용할 수 있는 강력한 기술입니다. PHP에서 WebSockets API와 WebRTC를 사용하면 강력한 실시간 애플리케이션을 만들 수 있습니다.
위 내용은 라이브 비디오 및 오디오 채팅을 위해 PHP에서 WebSockets API를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
