Comment le navigateur accède-t-il à Swoole

Comment le navigateur accède à swoole

Avant-propos

Swoole est un framework de communication réseau asynchrone hautes performances écrit en langage PHP. Swoole peut être utilisé pour créer facilement des applications réseau hautement concurrentes, particulièrement adaptées au développement de protocoles WebSocket, HTTP, TCP, UDP et autres.

Lors du processus d'utilisation de Swoole, vous devez parfois accéder à l'application réseau écrite par Swoole via le navigateur. Cet article présentera comment le navigateur accède à Swoole pour faciliter le débogage et les tests pendant le développement.

1. Protocole HTTP

Nous devons d'abord comprendre le protocole HTTP. HTTP (Hypertext Transfer Protocol) est un protocole de couche application permettant de transférer des documents hypermédia, généralement basé sur le protocole TCP.

Le protocole HTTP adopte le mode client-serveur Le client initie une requête et le serveur renvoie une réponse. Les requêtes HTTP sont constituées d'en-têtes et de corps de requête, et les réponses sont constituées d'en-têtes et de corps de réponse. Les en-têtes de requête et les en-têtes de réponse sont exprimés sous la forme de paires clé-valeur, par exemple :

En-tête de requête :

GET /index.html HTTP/1.1
Host: www.example.com
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:88.0) Gecko/20100101 Firefox/88.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
Accept-Language: zh-CN,zh;q=0.8,en-US;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate, br
Connection: keep-alive
Upgrade-Insecure-Requests: 1

En-tête de réponse :

HTTP/1.1 200 OK
Date: Tue, 22 Jun 2021 06:59:43 GMT
Server: Apache/2.4.41 (Ubuntu)
Last-Modified: Mon, 21 Jun 2021 01:53:04 GMT
ETag: "2eab-5c4965a6870bb"
Accept-Ranges: bytes
Content-Length: 11947
Vary: Accept-Encoding
Content-Type: text/html

2. Serveur HTTP Swoole

Swoole fournit un serveur HTTP qui peut facilement créer des sites Web. applications basées sur le protocole HTTP. L'utilisation du serveur HTTP Swoole permet aux navigateurs d'accéder aux applications Web écrites en Swoole. Voici un exemple simple :

<?php

$http = new Swoole\Http\Server("0.0.0.0", 9501);

$http->on("start", function ($server) {
    echo "Swoole http server is started at http://127.0.0.1:9501\n";
});

$http->on("request", function ($request, $response) {
    $response->header("Content-Type", "text/plain");
    $response->end("Hello, World!\n");
});

$http->start();

Dans cet exemple, nous créons un serveur HTTP Swoole et écoutons sur le port 9501. Lorsqu'un navigateur accède à ce serveur, une simple chaîne de texte "Hello, World!" est renvoyée.

3. Accédez au serveur HTTP Swoole

Ensuite, nous verrons comment accéder au serveur HTTP Swoole dans le navigateur. En supposant que le serveur HTTP Swoole s'exécute sur le port 9501 de l'hôte local, nous pouvons accéder au serveur en utilisant l'URL suivante :

http://127.0.0.1:9501/

Entrez cette URL dans le navigateur et vous verrez la chaîne de texte "Hello, World renvoyée par !" le navigateur.

Dans le serveur HTTP Swoole, nous pouvons utiliser l'objet $request pour obtenir les informations de requête envoyées par le client, par exemple :

$http->on("request", function ($request, $response) {
    $message = "Method: " . $request->server["request_method"] . "\n";
    $message .= "URI: " . $request->server["request_uri"] . "\n";
    $message .= "Headers: " . json_encode($request->header) . "\n";
    $message .= "Content: " . $request->rawContent() . "\n";
    $response->header("Content-Type", "text/plain");
    $response->end($message);
});

Cet exemple utilise l'objet $request pour obtenir les informations de requête, y compris la méthode de requête, l'URI , l'en-tête de la demande et le corps de la demande. De cette façon, il est facile de comprendre les informations de requête envoyées par le navigateur.

4. Protocole WebSocket

En plus du protocole HTTP, Swoole prend également en charge le protocole WebSocket. Le protocole WebSocket est un protocole basé sur le protocole TCP, qui permet une communication bidirectionnelle et convient parfaitement aux scénarios de communication en temps réel. Swoole fournit un serveur WebSocket pour implémenter facilement la fonctionnalité WebSocket en PHP.

Voici un exemple simple :

<?php

$server = new Swoole\WebSocket\Server("0.0.0.0", 9501);

$server->on("start", function ($server) {
    echo "Swoole WebSocket server is started at ws://127.0.0.1:9501\n";
});

$server->on('open', function (Swoole\WebSocket\Server $server, $request) {
    echo "WebSocket connection opened: {$request->fd}\n";
});

$server->on('message', function (Swoole\WebSocket\Server $server, $frame) {
    echo "Received message: {$frame->data}\n";
    $server->push($frame->fd, "Received message: {$frame->data}");
});

$server->on('close', function (Swoole\WebSocket\Server $server, $fd) {
    echo "WebSocket connection closed: {$fd}\n";
});

$server->start();

Dans cet exemple, nous créons un serveur Swoole WebSocket et écoutons sur le port 9501. Lorsqu'un client envoie un message, le serveur renvoie le message inchangé au client.

5. Accéder au serveur Swoole WebSocket

Accéder au serveur Swoole WebSocket dans le navigateur est un peu compliqué. Puisque le protocole WebSocket n'est pas basé sur le protocole HTTP, nous ne pouvons pas utiliser d'URL comme pour accéder aux serveurs HTTP.

Nous pouvons utiliser l'API JavaScript WebSocket pour communiquer avec le serveur Swoole WebSocket dans le navigateur. Voici un exemple de communication à l'aide de l'API JavaScript WebSocket :

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>WebSocket Test</title>
</head>
<body>
    <input type="text" id="message" placeholder="Type your message here">
    <button onclick="sendMessage()">Send Message</button>
    <ul id="messages"></ul>
    <script>
        var socket = new WebSocket("ws://127.0.0.1:9501/");

        socket.onopen = function(event) {
            console.log("WebSocket is open now.");
        };

        socket.onmessage = function(event) {
            var messages = document.getElementById("messages");
            var message = document.createElement("li");
            var content = document.createTextNode(event.data);
            message.appendChild(content);
            messages.appendChild(message);
        };

        function sendMessage() {
            var input = document.getElementById("message");
            var message = input.value;
            socket.send(message);
            input.value = "";
        }
    </script>
</body>
</html>

Cet exemple crée un objet WebSocket et se connecte au serveur Swoole WebSocket. Lorsque l'utilisateur saisit un message dans la zone de texte et clique sur le bouton Envoyer, le code JavaScript envoie le message au serveur. Après avoir reçu le message, le serveur renvoie le message au client tel quel et le client affiche le message dans la liste des messages.

6. Résumé

Cet article présente comment le navigateur accède aux applications réseau écrites par Swoole, y compris les protocoles HTTP et WebSocket. Grâce à l'introduction de cet article, je pense que vous maîtrisez les compétences nécessaires pour déboguer et tester les applications Swoole dans le navigateur.

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!