Comment développer un salon de discussion en ligne simple en utilisant PHP

Comment développer un salon de discussion en ligne simple en utilisant PHP ?

Avec le développement rapide d'Internet, la communication entre les personnes dépend de plus en plus d'Internet. En tant qu'outil social courant, les forums de discussion en ligne sont devenus un élément indispensable de la vie quotidienne des gens. Dans cet article, nous présenterons comment utiliser le langage PHP pour développer un salon de discussion en ligne simple et donnerons des exemples de code spécifiques.

1. Préparation
   Avant de commencer, assurez-vous que l'environnement d'exploitation PHP et le serveur Apache ont été installés sur votre ordinateur. Vous pouvez créer un environnement de développement PHP grâce à des outils tels que XAMPP ou WAMP. Dans le même temps, vous devez également connaître les connaissances de base en HTML, CSS et JavaScript.

2. Créer une base de données et des tables
   Tout d'abord, créez une table dans votre base de données pour stocker les enregistrements de discussion. Vous pouvez utiliser l'instruction SQL suivante pour créer une table :

   CREATE TABLE chat (
     id INT(6) UNSIGNED AUTO_INCREMENT PRIMARY KEY,
     username VARCHAR(30) NOT NULL,
     message TEXT NOT NULL,
     created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
   )

   Cette table contient un identifiant auto-incrémenté, le nom d'utilisateur de l'expéditeur, le contenu du message et l'heure à laquelle le message a été envoyé.

3. Créer une page de discussion
   Créez un fichier nommé index.php dans le répertoire de votre projet. Ce fichier nous servira de page de discussion. Importez les styles et scripts suivants dans le fichier :

   <link rel="stylesheet" href="style.css">
   <script src="jquery.min.js"></script>
   <script src="script.js"></script>

   Dans la page, créez un élément div pour afficher l'historique des discussions :

   <div id="chat-box"></div>

   En même temps, ajoutez un formulaire pour saisir le nom d'utilisateur et envoyer des messages :

   <form id="chat-form">
     <input type="text" id="username" placeholder="用户名" required>
     <input type="text" id="message" placeholder="消息" required>
     <button type="submit">发送</button>
   </form>

4. Écrivez le code de traitement backend
   Créez un fichier nommé chat.php dans le même répertoire pour gérer le stockage et la lecture des enregistrements de discussion. Tout d'abord, connectez-vous à la base de données :

   <?php
   $servername = "localhost";
   $username = "root";
   $password = "";
   $dbname = "chatroom";
   
   $conn = new mysqli($servername, $username, $password, $dbname);
   if ($conn->connect_error) {
     die("连接失败: " . $conn->connect_error);
   }
   ?>

   Ensuite, écrivez une fonction pour enregistrer les messages :

   <?php
   function saveMessage($username, $message)
   {
     global $conn;
     
     $sql = "INSERT INTO chat (username, message) VALUES ('$username', '$message')";
     
     if ($conn->query($sql) === TRUE) {
    return true;
     } else {
    return false;
     }
   }
   ?>

   Ensuite, créez une fonction pour obtenir les enregistrements de chat :

   <?php
   function getChatHistory()
   {
     global $conn;
     
     $sql = "SELECT * FROM chat";
     $result = $conn->query($sql);
     
     if ($result->num_rows > 0) {
    while($row = $result->fetch_assoc()) {
      echo "<p>{$row['username']}: {$row['message']}</p>";
    }
     }
   }
   ?>

   Enfin, ajoutez le code suivant au fichier chat.php avec Pour traiter les données du formulaire envoyées par le front-end :

   <?php
   if ($_SERVER["REQUEST_METHOD"] == "POST") {
     $username = $_POST["username"];
     $message = $_POST["message"];
     
     if (saveMessage($username, $message)) {
    echo "消息发送成功！";
     } else {
    echo "消息发送失败！";
     }
   }
   ?>

5. Écrivez un script front-end
   Créez un fichier nommé script.js dans le répertoire du projet pour envoyer les données du formulaire et obtenir des enregistrements de discussion. Utilisez la méthode ajax de jQuery pour traiter :

   $(document).on("submit", "#chat-form", function(e) {
     e.preventDefault();
     
     var username = $("#username").val();
     var message = $("#message").val();
     
     $.ajax({
    url: "chat.php",
    method: "POST",
    data: { username: username, message: message },
    success: function(response) {
      $("#message").val("");
    }
     });
   });
   
   function getChatHistory() {
     $.ajax({
    url: "chat.php",
    method: "GET",
    success: function(response) {
      $("#chat-box").html(response);
    }
     });
   }
   
   setInterval(getChatHistory, 1000);

6. Styles d'écriture
   Créez un fichier nommé style.css dans le répertoire du projet pour styliser la page de discussion :

   body {
     background: #f2f2f2;
     font-family: Arial, sans-serif;
     margin: 0;
     padding: 0;
   }
   
   #chat-box {
     background: #fff;
     border: 1px solid #ccc;
     border-radius: 5px;
     height: 200px;
     margin: 20px auto;
     overflow: auto;
     padding: 10px;
     width: 400px;
   }
   
   #chat-form {
     display: flex;
     margin: 0 auto;
     width: 400px;
   }
   
   #chat-form input[type="text"] {
     flex: 1;
     padding: 5px;
   }

7. Exécutez le projet
   Ouvrez dans le fichier index.php du navigateur, vous pouvez maintenant saisir votre nom d'utilisateur et envoyer des messages. Vos messages seront stockés dans la base de données et affichés sur la page de chat en temps réel.

Grâce aux étapes ci-dessus, nous avons développé une salle de discussion en ligne simple en utilisant PHP. Bien entendu, il ne s’agit que d’une implémentation d’entrée de gamme, et vous pouvez la développer et l’optimiser davantage en fonction de vos propres besoins. J'espère que cet article pourra vous être 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!