Implementieren Sie Weibo-Wall- und Echtzeit-Updates mit PHP und XML-PHP-Tutorial-php.cn

Implementieren Sie Weibo-Wall- und Echtzeit-Updates mit PHP und XML

WBOY

Freigeben： 2023-08-09 08:08:02

Original

1279 Leute haben es durchsucht

Implementieren Sie Weibo-Wall- und Echtzeit-Updates mit PHP und XML

Verwenden Sie PHP und XML, um die Weibo-Wall und Echtzeit-Updates zu implementieren.

Mit der Popularität sozialer Medien ist Weibo zu einer wichtigen Plattform geworden, auf der Menschen ihr tägliches Leben teilen und kommunizieren können. Durch das Hinzufügen einer Weibo-Pinnwand zu einer Webseite können Benutzer Weibo-Nachrichten in Echtzeit anzeigen und in Echtzeit aktualisieren. In diesem Artikel erfahren Sie, wie Sie mit PHP und XML eine einfache Weibo-Wall implementieren und automatisch aktualisieren, wenn neues Weibo veröffentlicht wird.

Zuerst müssen wir eine HTML-Seite erstellen, um die Weibo-Pinnwand anzuzeigen und von Benutzern eingegebene Weibo-Nachrichten zu empfangen. Angenommen, wir haben bereits eine Datei namens index.html, hier ist ihre Grundstruktur:

<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<h2>微博墙</h2>
<div id="weiboWall"></div>
<form id="weiboForm">
  <input type="text" id="message" placeholder="输入你的消息">
  <input type="submit" value="发布">
</form>
</body>
</html>

Nach dem Login kopieren

In der HTML-Datei haben wir die jQuery-Bibliothek und eine JavaScript-Datei namens „script.js“ eingeführt. Als Nächstes schreiben wir den Code für die Interaktion mit dem Backend in die Datei script.js.

$(document).ready(function() {
  // 当页面加载完毕后，执行以下操作
  loadData();   // 加载已有的微博消息
  setInterval(loadData, 5000);   // 每隔5秒自动更新微博消息

  $("#weiboForm").submit(function(event) {
    event.preventDefault();   // 阻止表单的默认提交动作

    // 获取用户输入的消息
    var message = $("#message").val();

    // 发送消息到后端
    $.post("post.php", {message: message}, function(response) {
      // 发布成功后刷新微博墙
      loadData();
      $("#message").val("");   // 清空输入框
    });
  });

  function loadData() {
    $.get("get.php", function(response) {
      // 清空微博墙
      $("#weiboWall").empty();
      // 将返回的XML数据解析为JavaScript对象
      var xml = $.parseXML(response);
      // 遍历解析后的数据，并将消息显示在微博墙上
      $(xml).find("message").each(function() {
        var message = $(this).find("content").text();
        var time = $(this).find("time").text();
        $("#weiboWall").append("<p>" + message + " - " + time + "</p>");
      });
    });
  }
});

Nach dem Login kopieren

In der Datei script.js verwenden wir zunächst die Methode $(document).ready() von jQuery, um sicherzustellen, dass die Webseite geladen wird, bevor wir den nächsten Vorgang ausführen. Wir laden vorhandene Weibo-Nachrichten über die Funktion „loadData()“ und verwenden die Funktion „setInterval()“, um Weibo-Nachrichten automatisch alle 5 Sekunden zu aktualisieren.

Wenn der Benutzer eine Nachricht in das Formular eingibt und auf die Schaltfläche „Veröffentlichen“ klickt, löst das Absenden des Formulars die Funktion $(„#weiboForm“).submit() aus. Diese Funktion verhindert die standardmäßige Absendeaktion des Formulars und verwendet die Methode $.post(), um eine Nachricht an die Datei post.php des Backends zu senden. In der Datei post.php speichern wir die empfangene Nachricht in einer XML-Datei.

Mit der Funktion „loadData()“ werden Weibo-Nachrichten geladen und auf der Weibo-Pinnwand angezeigt. Wir verwenden die Methode $.get(), um die XML-Daten der gespeicherten Weibo-Nachricht aus der get.php-Datei im Backend abzurufen. Anschließend verwenden wir die Methode $.parseXML(), um die zurückgegebenen XML-Daten in ein JavaScript-Objekt zu analysieren, und verwenden die Methoden $(xml).find() und $(this).find(), um den Inhalt abzurufen und anzuzeigen jede Weibo-Nachricht und Uhrzeit.

Schließlich müssen wir zwei PHP-Dateien erstellen, um die vom Frontend gesendeten Anfragen zu verarbeiten und entsprechende Antworten bereitzustellen.

In der post.php-Datei verwenden wir die SimpleXML-Bibliothek, um die vom Benutzer gesendeten Weibo-Nachrichten in einer XML-Datei zu speichern:

<?php
if(isset($_POST['message'])){
  $message = $_POST['message'];
  $time = date("Y-m-d H:i:s");

  $xml = new SimpleXMLElement('<messages></messages>');
  $messageElement = $xml->addChild('message');
  $messageElement->addChild('content', $message);
  $messageElement->addChild('time', $time);
  $xml->asXML('messages.xml');
}
?>

Nach dem Login kopieren

In der get.php-Datei lesen wir den Inhalt der XML-Datei und geben ihn an zurück das Frontend:

<?php
if(file_exists('messages.xml')){
  $xml = simplexml_load_file('messages.xml');
  header('Content-Type: text/xml');
  echo $xml->asXML();
}
?>

Nach dem Login kopieren

Bisher haben wir die Arbeit an der Implementierung der Weibo-Wand und Echtzeit-Updates mithilfe von PHP und XML abgeschlossen. Indem wir eine Weibo-Wall und ein Formular zum Empfangen von Benutzereingaben in einer HTML-Datei hinzufügen und PHP verwenden, um die Back-End-Logik zu verwalten und Weibo-Nachrichten über eine XML-Datei zu speichern, können wir eine einfache Weibo-Wall implementieren und diese in Echtzeit anzeigen, wenn Ein neues Weibo wird veröffentlicht. Natürlich handelt es sich dabei nur um eine Basisversion, die Sie je nach Bedarf erweitern und optimieren können.

Das obige ist der detaillierte Inhalt vonImplementieren Sie Weibo-Wall- und Echtzeit-Updates mit PHP und XML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!