So verwenden Sie die WebSockets-API in PHP für Live-Video- und Audio-Chat-PHP-Tutorial-php.cn

So verwenden Sie die WebSockets-API in PHP für Live-Video- und Audio-Chat

王林

Freigeben： 2023-06-17 14:38:01

Original

1489 Leute haben es durchsucht

Die WebSockets-API ist ein wichtiger Bestandteil bei der Realisierung von Echtzeit-Video- und Audio-Chat. Sie bietet eine Kommunikationsmethode, die auf einem ereignisgesteuerten Mechanismus basiert und eine bidirektionale Kommunikation ermöglichen kann, wodurch die Kommunikation zwischen Browser und Server einfacher, schneller und sicherer wird . In diesem Artikel wird erläutert, wie Sie die WebSockets-API in PHP für Echtzeit-Video- und Audio-Chat verwenden.

WebSocket-Server installieren

Um die WebSockets-API in PHP zu verwenden, müssen Sie zunächst den WebSocket-Server installieren. Es wird empfohlen, Rachet zu verwenden, den beliebtesten WebSocket-Server in PHP. Es kann mit Composer installiert werden:

composer require cboden/ratchet

Nach dem Login kopieren

Erstellen Sie einen WebSocket-Server

Das Erstellen eines WebSocket-Servers mit Rachet ist sehr einfach und erfordert nur ein paar Codezeilen:

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();

Nach dem Login kopieren

Dieser Server akzeptiert alle Verbindungen und sendet Nachrichten, sobald sie eingehen . Es verwendet Grad-Stream-Objekte, um alle Verbindungen zu speichern.

Frontend-Anwendungen erstellen

Mit der WebSockets-API können Frontend-Anwendungen plattform- und browserübergreifend erstellt werden. So erstellen Sie eine Front-End-Anwendung mit 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>

Nach dem Login kopieren

Mit Socket.io zum Herstellen einer Verbindung empfängt und sendet die Anwendung Nachrichten.

Video- und Audio-Chat implementieren

Über die Ratchet- und WebSockets-API kann ein bidirektionaler Video- und Audio-Chat in Echtzeit erreicht werden, was die Verwendung einiger zusätzlicher Bibliotheken und Tools erfordert. Es wird empfohlen, WebRTC zu verwenden, einen modernen Standard für Echtzeitkommunikation, der eine Peer-to-Peer-Kommunikation zwischen Browsern ermöglicht.

Mit dem WebSocket-Server und WebRTC DSP in PHP können Sie eine bidirektionale Echtzeit-Video- und Audio-Chat-Anwendung erstellen. Dies erfordert etwas zusätzlichen JavaScript-Code und kann mit SimpleWebRTC implementiert werden:

<!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>

Nach dem Login kopieren

SimpleWebRTC wird hier verwendet, um Video- und Audio-Chat zu implementieren. Der Code enthält Client- und Servercode. Wenn ein Benutzer die Seite besucht, versucht der Client, eine Verbindung zum WebSocket-Server herzustellen und dem Raum beizutreten. Der Server übermittelt WebSocket-Ereignisse an SimpleWebRTC.

Zusammenfassung

Mithilfe der Rachet- und WebSockets-API kann ein bidirektionaler Echtzeit-Video- und Audio-Chat erreicht werden. Mit SimpleWebRTC können Anwendungen problemlos erweitert werden, um Echtzeit-Audio- und Video-Chat zu unterstützen. WebRTC ist eine leistungsstarke Technologie, die in einer Vielzahl von Anwendungen eingesetzt werden kann, darunter Online-Bildungssysteme, Kollaborationsanwendungen und Online-Spiele. Mithilfe der WebSockets-API und WebRTC in PHP können Sie leistungsstarke Echtzeitanwendungen erstellen.

Das obige ist der detaillierte Inhalt vonSo verwenden Sie die WebSockets-API in PHP für Live-Video- und Audio-Chat. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!