Maison >développement back-end >tutoriel php >PHP développe un système de chat en temps réel pour le partage de musique et la lecture en ligne

PHP développe un système de chat en temps réel pour le partage de musique et la lecture en ligne

PHPz
PHPzoriginal
2023-08-25 22:34:49669parcourir

PHP développe un système de chat en temps réel pour le partage de musique et la lecture en ligne

PHP développe un système de chat en temps réel pour le partage de musique et la lecture en ligne

Avec le développement d'Internet, le système de chat en temps réel est devenu un outil de communication important dans la vie quotidienne des gens. Afin d'augmenter l'expérience utilisateur, nous pouvons ajouter des fonctions de partage de musique et de lecture en ligne au système de chat, afin que les utilisateurs puissent profiter de la musique en même temps pendant le processus de chat, augmentant ainsi le plaisir de la communication. Cet article présentera comment utiliser PHP pour développer les fonctions de partage de musique et de lecture en ligne du système de discussion en temps réel, et donnera des exemples de code correspondants.

1. Préparation de l'environnement

Avant de commencer le développement, nous devons préparer l'environnement du serveur pour exécuter PHP. Il est recommandé d'utiliser des environnements de développement intégrés tels que XAMPP ou WAMP, qui incluent un serveur Apache, une base de données MySQL et un interpréteur PHP pour faciliter notre développement et nos tests.

2. Créer une base de données

Tout d'abord, nous devons créer une base de données pour stocker les enregistrements de discussion et les informations musicales. Exécutez l'instruction SQL suivante dans MySQL pour créer la table de données correspondante :

CREATE TABLE users (
    id INT PRIMARY KEY AUTO_INCREMENT,
    username VARCHAR(50) NOT NULL,
    password VARCHAR(50) NOT NULL
);

CREATE TABLE messages (
    id INT PRIMARY KEY AUTO_INCREMENT,
    sender_id INT NOT NULL,
    receiver_id INT NOT NULL,
    content TEXT NOT NULL,
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);

CREATE TABLE music (
    id INT PRIMARY KEY AUTO_INCREMENT,
    title VARCHAR(100) NOT NULL,
    artist VARCHAR(100) NOT NULL,
    url VARCHAR(255) NOT NULL
);

3. Connexion et enregistrement de l'utilisateur

Dans le système de chat, les utilisateurs doivent s'inscrire et se connecter pour utiliser la fonction de chat. Ensuite, nous utilisons PHP pour écrire le code de connexion et d’enregistrement des utilisateurs.

  1. Page d'enregistrement de l'utilisateur (register.php)

    <!DOCTYPE html>
    <html>
    <head>
     <title>用户注册</title>
    </head>
    <body>
     <h1>用户注册</h1>
     <form action="register.php" method="POST">
         <input type="text" name="username" placeholder="用户名" required>
         <br><br>
         <input type="password" name="password" placeholder="密码" required>
         <br><br>
         <button type="submit">注册</button>
     </form>
    </body>
    </html>
  2. Traitement de l'enregistrement de l'utilisateur (register.php)

    <?php
    if ($_SERVER['REQUEST_METHOD'] == 'POST') {
     $username = $_POST['username'];
     $password = $_POST['password'];
    
     // 将用户名和密码插入数据库中
     $connection = mysqli_connect('localhost', 'root', '', 'chat_system');
     $query = "INSERT INTO users (username, password) VALUES ('$username', '$password')";
     mysqli_query($connection, $query);
     // 注册成功后跳转到登录页面
     header('Location: login.php');
     exit();
    }
    ?>

Connexion et vérification de l'utilisateur

  1. Page de connexion de l'utilisateur (login.php)

    <!DOCTYPE html>
    <html>
    <head>
     <title>用户登录</title>
    </head>
    <body>
     <h1>用户登录</h1>
     <form action="login.php" method="POST">
         <input type="text" name="username" placeholder="用户名" required>
         <br><br>
         <input type="password" name="password" placeholder="密码" required>
         <br><br>
         <button type="submit">登录</button>
     </form>
    </body>
    </html>
    .
  2. Vérification de la connexion utilisateur (login.php)

    <?php
    session_start();
    
    if ($_SERVER['REQUEST_METHOD'] == 'POST') {
     $username = $_POST['username'];
     $password = $_POST['password'];
    
     // 根据用户名查询数据库
     $connection = mysqli_connect('localhost', 'root', '', 'chat_system');
     $query = "SELECT * FROM users WHERE username='$username' AND password='$password'";
     $result = mysqli_query($connection, $query);
    
     // 验证用户名和密码是否正确
     if (mysqli_num_rows($result) == 1) {
         // 登录成功后保存用户信息到session中
         $user = mysqli_fetch_assoc($result);
         $_SESSION['user_id'] = $user['id'];
         $_SESSION['username'] = $user['username'];
         // 登录成功后跳转到聊天页面
         header('Location: chat.php');
         exit();
     } else {
         echo '用户名或密码错误';
     }
    }
    ?>

5. Fonction de chat en temps réel

Dans la page de chat, nous utilisons Ajax pour implémenter la fonction de chat en temps réel. Lorsqu'un utilisateur envoie un message, nous envoyons le message au serveur et le stockons dans la base de données, puis affichons le message dans la fenêtre de discussion en temps réel.

  1. Chat Page (chat.php)

    <?php
    session_start();
    
    if (!isset($_SESSION['user_id'])) {
     header('Location: login.php');
     exit();
    }
    
    $connection = mysqli_connect('localhost', 'root', '', 'chat_system');
    
    // 查询历史消息
    $query = "SELECT * FROM messages";
    $result = mysqli_query($connection, $query);
    $messages = mysqli_fetch_all($result, MYSQLI_ASSOC);
    ?>
    
    <!DOCTYPE html>
    <html>
    <head>
     <title>实时聊天</title>
     <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    </head>
    <body>
     <h1>实时聊天</h1>
    
     <div id="chat-box">
         <?php foreach ($messages as $message): ?>
             <p><?php echo $message['content']; ?></p>
         <?php endforeach; ?>
     </div>
    
     <form id="message-form">
         <input type="text" name="message" placeholder="输入消息" required>
         <button type="submit">发送</button>
     </form>
    
     <script>
         // 页面加载完成后,滚动到底部
         $(document).ready(function() {
             $('#chat-box').scrollTop($('#chat-box')[0].scrollHeight);
         });
    
         // 提交消息表单
         $('#message-form').submit(function(event) {
             event.preventDefault();
             var message = $('input[name="message"]').val();
    
             $.ajax({
                 url: 'send_message.php',
                 method: 'POST',
                 data: {message: message},
                 success: function() {
                     // 清空输入框内容
                     $('input[name="message"]').val('');
                 }
             });
         });
    
         // 定时刷新消息
         setInterval(function() {
             $.ajax({
                 url: 'get_messages.php',
                 method: 'GET',
                 dataType: 'json',
                 success: function(response) {
                     var messages = response.messages;
                     var html = '';
    
                     // 生成消息HTML
                     for (var i = 0; i < messages.length; i++) {
                         html += '<p>' + messages[i].content + '</p>';
                     }
    
                     // 更新聊天窗口内容
                     $('#chat-box').html(html);
    
                     // 滚动到底部
                     $('#chat-box').scrollTop($('#chat-box')[0].scrollHeight);
                 }
             });
         }, 1000);
     </script>
    </body>
    </html>
  2. send Code de message (Send_Message.php)

    <?php
    session_start();
    
    if (!isset($_SESSION['user_id']) || $_SERVER['REQUEST_METHOD'] != 'POST') {
     exit();
    }
    
    $sender_id = $_SESSION['user_id'];
    $receiver_id = 0; // 这里可以根据实际情况设置接收者的ID
    $content = $_POST['message'];
    
    $connection = mysqli_connect('localhost', 'root', '', 'chat_system');
    $query = "INSERT INTO messages (sender_id, receiver_id, content) VALUES ($sender_id, $receiver_id, '$content')";
    mysqli_query($connection, $query);
    ?>
  3. get Code de message (get_messages.php)

    <?php
    $connection = mysqli_connect('localhost', 'root', '', 'chat_system');
    $query = "SELECT * FROM messages";
    $result = mysqli_query($connection, $query);
    $messages = mysqli_fetch_all($result, MYSQLI_ASSOC);
    
    echo json_encode(['messages' => $messages]);
    ?>

6. Partage de musique et lecture en ligne

Afin de mettre en œuvre les fonctions de partage de musique et de lecture en ligne, nous devons d'abord stocker les informations sur le titre, l'artiste et l'URL de la musique dans la base de données. Les utilisateurs peuvent ajouter de la musique et la partager avec d'autres utilisateurs, et d'autres utilisateurs peuvent cliquer sur les liens dans la page de discussion pour écouter la musique.

  1. Ajouter une page de musique (add_music.php)

    <?php
    session_start();
    
    if (!isset($_SESSION['user_id'])) {
     header('Location: login.php');
     exit();
    }
    
    if ($_SERVER['REQUEST_METHOD'] == 'POST') {
     $title = $_POST['title'];
     $artist = $_POST['artist'];
     $url = $_POST['url'];
    
     // 将音乐信息插入数据库中
     $connection = mysqli_connect('localhost', 'root', '', 'chat_system');
     $query = "INSERT INTO music (title, artist, url) VALUES ('$title', '$artist', '$url')";
     mysqli_query($connection, $query);
     // 添加成功后跳转到聊天页面
     header('Location: chat.php');
     exit();
    }
    ?>
    
    <!DOCTYPE html>
    <html>
    <head>
     <title>添加音乐</title>
    </head>
    <body>
     <h1>添加音乐</h1>
     <form action="add_music.php" method="POST">
         <input type="text" name="title" placeholder="标题" required>
         <br><br>
         <input type="text" name="artist" placeholder="艺术家" required>
         <br><br>
         <input type="text" name="url" placeholder="URL" required>
         <br><br>
         <button type="submit">添加</button>
     </form>
    </body>
    </html>
  2. Code de lecture de musique (play_music.php)

    <?php
    if ($_SERVER['REQUEST_METHOD'] == 'GET' && isset($_GET['id'])) {
     $id = $_GET['id'];
    
     // 根据ID查询音乐信息
     $connection = mysqli_connect('localhost', 'root', '', 'chat_system');
     $query = "SELECT * FROM music WHERE id=$id";
     $result = mysqli_query($connection, $query);
     $music = mysqli_fetch_assoc($result);
     // 输出音乐信息,并自动播放
     echo <<<HTML
     <h1>{$music['title']}</h1>
     <p>{$music['artist']}</p>
     <audio controls autoplay>
         <source src="{$music['url']}" type="audio/mpeg">
         Your browser does not support the audio element.
     </audio>
     HTML;
    } else {
     exit();
    }
    ?>

Résumé

Cet article développe les fonctions de partage de musique et de lecture en ligne du temps réel. système de chat utilisant PHP, montre comment réaliser cette fonction en combinant les technologies de base de données, AJAX et front-end. Les utilisateurs peuvent partager de la musique et jouer en ligne en même temps pendant le chat, enrichissant ainsi le contenu et l'expérience du chat. En plus de fournir des exemples de code, il présente également le processus de développement de la conception de bases de données associées et la vérification des connexions des utilisateurs. J'espère que cet article vous aidera à comprendre et à mettre en œuvre cette fonction.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn