PHP 및 XML을 사용하여 Weibo 담벼락 및 실시간 업데이트 구현-PHP 튜토리얼-php.cn

PHP 및 XML을 사용하여 Weibo 담벼락 및 실시간 업데이트 구현

WBOY

풀어 주다： 2023-08-09 08:08:02

원래의

1306명이 탐색했습니다.

PHP 및 XML을 사용하여 Weibo 담벼락 및 실시간 업데이트 구현

PHP와 XML을 사용하여 Weibo 담벼락 및 실시간 업데이트 구현

소셜 미디어의 인기로 Weibo는 사람들이 일상을 공유하고 소통하는 중요한 플랫폼이 되었습니다. 웹페이지에 웨이보 담벼락을 추가하면 사용자는 웨이보 메시지를 실시간으로 보고 업데이트할 수 있습니다. 이 기사에서는 PHP와 XML을 사용하여 간단한 Weibo 월을 구현하고 새로운 Weibo가 게시될 때 자동으로 업데이트하는 방법을 소개합니다.

먼저 Weibo 담벼락을 표시하고 사용자가 입력한 Weibo 메시지를 수신하기 위한 HTML 페이지를 만들어야 합니다. index.html이라는 파일이 이미 있다고 가정하면 기본 구조는 다음과 같습니다.

<!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>

로그인 후 복사

HTML 파일에는 jQuery 라이브러리와 "script.js"라는 JavaScript 파일이 도입되었습니다. 다음으로 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>");
      });
    });
  }
});

로그인 후 복사

script.js 파일에서는 먼저 jQuery의 $(document).ready() 메서드를 사용하여 다음 작업을 수행하기 전에 웹 페이지가 로드되었는지 확인합니다. loadData() 함수를 통해 기존 웨이보 메시지를 로드하고, setInterval() 함수를 사용하여 5초마다 자동으로 웨이보 메시지를 업데이트합니다.

사용자가 양식에 메시지를 입력하고 "게시" 버튼을 클릭하면 양식을 제출하면 $("#weiboForm").submit() 함수가 실행됩니다. 이 함수는 양식의 기본 제출 작업을 방지하고 $.post() 메서드를 사용하여 백엔드의 post.php 파일에 메시지를 보냅니다. post.php 파일에서는 수신된 메시지를 XML 파일로 저장합니다.

loadData() 함수는 Weibo 메시지를 로드하고 Weibo 담벼락에 표시하는 데 사용됩니다. $.get() 메소드를 사용하여 백엔드의 get.php 파일에서 저장된 Weibo 메시지의 XML 데이터를 가져옵니다. 그런 다음 $.parseXML() 메서드를 사용하여 반환된 XML 데이터를 JavaScript 개체로 구문 분석하고 $(xml).find() 및 $(this).find() 메서드를 사용하여 내용을 가져와 표시합니다. 각 Weibo 메시지와 시간.

마지막으로 프런트 엔드에서 보낸 요청을 처리하고 해당 응답을 제공하기 위해 두 개의 PHP 파일을 만들어야 합니다.

post.php 파일에서는 SimpleXML 라이브러리를 사용하여 사용자가 보낸 Weibo 메시지를 XML 파일로 저장합니다.

<?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');
}
?>

로그인 후 복사

get.php 파일에서 XML 파일의 내용을 읽고 다음으로 반환합니다. 프론트 엔드:

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

로그인 후 복사

지금까지 PHP와 XML을 사용하여 Weibo 월과 실시간 업데이트를 구현하는 작업을 완료했습니다. Weibo 월과 HTML 파일로 사용자 입력을 받을 수 있는 양식을 추가하고 PHP를 사용하여 백엔드 로직을 처리하고 Weibo 메시지를 XML 파일을 통해 저장함으로써 간단한 Weibo 월을 구현하고 다음과 같은 경우 실시간으로 표시할 수 있습니다. 새로운 웨이보가 갱신되었습니다. 물론 이는 기본 버전일 뿐이며 필요에 따라 확장하고 최적화할 수 있습니다.

위 내용은 PHP 및 XML을 사용하여 Weibo 담벼락 및 실시간 업데이트 구현의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!