Как создать новостную ленту (новостная лента AJAX)

У меня есть информационная система, точнее, информационная система, которая является системой продажи билетов. Информационная система будет содержать учетные записи, которые будут иметь бесконечное или n количество пользователей. Я хочу, чтобы пользователи могли видеть действия других пользователей или изменения контента в ленте новостей. (Так же, как Facebook). Я буду использовать PHP, MySQL и AJAX (или jQuery) для реализации новостной ленты. Я буду знать, как настроить таблицы и запросы.

Как использовать PHP и AJAX или jQuery для извлечения контента и его отображения в ленте новостей (в стиле ленты новостей Facebook с эффектом исчезновения или прокрутки?).

Я искал хороший учебник и не нашел его. Я хотел бы, желательно, кодировать это с нуля, если возможно.

У меня все еще есть несколько проблем: Вот что у меня есть:

ajax.php

<?php require_once('../../Connections/f12_database_connect.php'); ?>
<?php
if (!function_exists("GetSQLValueString")) {
function GetSQLValueString($theValue, $theType, $theDefinedValue = "", $theNotDefinedValue = "") 
{
  if (PHP_VERSION < 6) {
    $theValue = get_magic_quotes_gpc() ? stripslashes($theValue) : $theValue;
  }

  $theValue = function_exists("mysql_real_escape_string") ? mysql_real_escape_string($theValue) : mysql_escape_string($theValue);

  switch ($theType) {
    case "text":
      $theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
      break;    
    case "long":
    case "int":
      $theValue = ($theValue != "") ? intval($theValue) : "NULL";
      break;
    case "double":
      $theValue = ($theValue != "") ? doubleval($theValue) : "NULL";
      break;
    case "date":
      $theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
      break;
    case "defined":
      $theValue = ($theValue != "") ? $theDefinedValue : $theNotDefinedValue;
      break;
  }
  return $theValue;
}
}

mysql_select_db($database_f12_database_connect, $f12_database_connect);
$query_newsfeed_a = "SELECT * FROM newsfeed";
$newsfeed_a = mysql_query($query_newsfeed_a, $f12_database_connect) or die(mysql_error());


while($row_newsfeed_a = mysql_fetch_assoc($newsfeed_a))
{
        echo("<div class='feedItem'>");
    echo("<div class='title'>" . $feedItem['title'] . "</div>");
    echo("<div class='body'>" . $feedItem['body'] . "</div>");
    echo("</div>");



}
$totalRows_newsfeed_a = mysql_num_rows($newsfeed_a);
?>

<?php
mysql_free_result($newsfeed_a);
?>

feed.php

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>

<script>
    function refreshNews()
    {
        $("#news").load("ajax.php")
    }
</script>
</head>

<body>





<div id="news"></div>
</body>
</html>

Что я делаю неправильно?

Источник

2 ответа

Решение

Если вы хотите закодировать его с нуля, основной процесс заключается в создании сценария PHP, который собирает данные и отправляет их обратно в запрос AJAX. Обычно я создаю отдельный PHP-файл, который обрабатывает любую нужную мне операцию.

Все, что ваш PHP-скрипт обычно выводит, отправляется обратно в AJAX-запрос. Таким образом, любые теги HTML, любые операторы echo / print. Такие вещи, как header(), также создают вывод, просто предупреждение.

В зависимости от дизайна страницы, вы можете создать HTML в PHP, а затем использовать jQuery для добавления этого HTML на страницу по мере необходимости. Другой вариант - использовать PHP json_encode() и отправить все данные обратно в виде JSON и построить клиентскую часть HTML-структуры.

Если каждый элемент канала будет иметь одинаковую базовую структуру, то, вероятно, проще всего создать сторону HTML-сервера в PHP, как для любой обычной страницы. Вам нужен только фрагмент кода HTML, который является фидом.

Самым простым методом будет jQuery.load () http://api.jquery.com/load/

Внутри HTML-страницы:

<script>
    function refreshNews()
    {
        $("#news").load("path/to/ajax.php")
    }
</script>

<div id="news"></div>

В PHP:

$sql = "SQL TO GET NEWS FEED";

$result = mysql_query($sql);

while($feedItem = mysql_fetch_assoc($result))
{
    echo("<div class='feedItem'>");
    echo("<div class='title'>" . $feedItem['title'] . "</div>");
    echo("<div class='body'>" . $feedItem['body'] . "</div>");
    echo("</div>");
}

Затем вы можете вызвать refreshNews() из другого события (кнопка обновления, событие по времени и т. Д.).

Очевидно, ваш HTML и структура данных могут отличаться. Просто убедитесь, что это единственное, что выводит этот PHP-файл. Это включает в себя все, что находится за пределами тегов.

Есть более эффективные способы сделать это, этот скрипт будет по существу перезагружать весь список новостей при каждом вызове refreshNews(). На данный момент это один из самых простых способов заставить его работать, так что попробуйте, и в случае необходимости есть более эффективные способы.

Источник

Ответ Криса дает хороший общий обзор концепции, но он не будет предоставлять обновления в реальном времени.

Мы используем Ajax Push Engine для наших приложений реального времени на работе.

Если вы не можете использовать PHP и Jquery, вы можете использовать что-то похожее на то, что Крис рекомендовал на стороне сервера, и на стороне клиента собирать таймер, который запускает ajax-запрос очень часто.

Это просто идея, не рабочий код, который я тестировал, но что-то похожее на:

setInterval ( 
    function(){
        $.get("yourScriptName.php", { userID: 555},
            function(data){
                //update your news feed with data received via ajax request here.
            });
    }, 30000 );

См. Документацию w3c setInterval() и документацию $.get() Jquery для получения более подробной информации.

Источник
Другие вопросы по тегам