Tutoriel de développement PHP Websocket pour créer une fonction de partage social en temps réel-tutoriel php-php.cn

Tutoriel de développement PHP Websocket pour créer une fonction de partage social en temps réel

PHPz

Libérer： 2023-12-02 11:50:01

original

1444 Les gens l'ont consulté

PHP Websocket开发教程，构建实时社交分享功能

Tutoriel de développement PHP WebSocket pour créer une fonction de partage social en temps réel

Présentation :
WebSocket est un protocole de communication full-duplex qui peut établir une connexion persistante entre le client et le serveur pour établir une communication en temps réel. Ce didacticiel vous guide dans le développement d'une application WebSocket à l'aide de PHP pour créer une fonctionnalité de partage social en temps réel. Dans cette fonctionnalité, les utilisateurs peuvent partager du texte, des images et des liens en temps réel et interagir avec d'autres utilisateurs.

Étape 1 : Configurer l'environnement
Tout d'abord, assurez-vous que les extensions PHP et WebSocket sont installées et configurées sur votre serveur. Vous pouvez vérifier l'installation et la configuration de PHP en accédant à la fonction phpinfo(). Si l'extension WebSocket n'est pas installée, vous pouvez l'installer à l'aide de la commande suivante :

sudo apt-get install php-websocket

Copier après la connexion

Étape 2 : Créer un serveur WebSocket
En PHP, nous utiliserons la bibliothèque Ratchet pour créer le serveur WebSocket. Vous pouvez installer la bibliothèque Ratchet via la commande suivante :

composer require cboden/ratchet

Copier après la connexion

Créez un fichier appelé websocket_server.php et ajoutez le code suivant :

<?php
use RatchetServerIoServer;
use RatchetHttpHttpServer;
use RatchetWebSocketWsServer;
use MyAppWebSocketHandler;

require 'vendor/autoload.php';

$server = IoServer::factory(
    new HttpServer(
        new WsServer(
            new WebSocketHandler()
        )
    ),
    8080
);

$server->run();
?>

Copier après la connexion

Étape 3 : Créez un gestionnaire WebSocket
Ensuite, nous créons un fichier appelé WebSocketHandler.php et ajoutez le code suivant :

<?php
namespace MyApp;

use RatchetMessageComponentInterface;
use RatchetConnectionInterface;

class WebSocketHandler 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) {
        foreach ($this->clients as $client) {
            $client->send($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 occurred: {$e->getMessage()}
";
        $conn->close();
    }
}
?>

Copier après la connexion

Étape 4 : Créez la page front-end
Créez un fichier appelé index.html et ajoutez le code suivant :

<!DOCTYPE html>
<html>
<head>
    <title>实时社交分享</title>
</head>
<body>
    <div id="messages"></div>
    <form id="message-form">
        <input type="text" id="message-input" placeholder="在此输入消息" required>
        <button type="submit">发送</button>
    </form>

    <script>
        var conn = new WebSocket('ws://localhost:8080');

        conn.onopen = function(e) {
            console.log("连接成功！");
        };

        conn.onmessage = function(e) {
            var message = JSON.parse(e.data);
            var msgDiv = document.createElement('div');
            var msgText = document.createTextNode(message.text);
            msgDiv.appendChild(msgText);
            document.getElementById('messages').appendChild(msgDiv);
        };

        document.getElementById('message-form').onsubmit = function() {
            var input = document.getElementById('message-input').value;
            var message = {
                text: input
            };
            conn.send(JSON.stringify(message));
            return false;
        };
    </script>
</body>
</html>

Copier après la connexion

Étape 5 : Exécutez l'application
Utilisez la fenêtre de ligne de commande pour saisir votre projet répertoire et exécutez la commande suivante pour démarrer le serveur WebSocket :

php websocket_server.php

Copier après la connexion

Ensuite, ouvrez le fichier index.html dans votre navigateur et vous verrez une interface simple. Vous pouvez saisir un message dans la zone de saisie et cliquer sur le bouton Envoyer pour envoyer le message. Tous les clients connectés au même serveur recevront les messages que vous envoyez en temps réel.

Conclusion :
Grâce à ce tutoriel, vous avez appris à développer une application WebSocket en utilisant PHP et la bibliothèque Ratchet et à créer une fonctionnalité de partage social en temps réel. Vous pouvez étendre davantage cette fonctionnalité pour prendre en charge le partage d'images et de liens, et ajouter d'autres fonctionnalités interactives. J'espère que ce tutoriel vous sera utile !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!