2010-06-11 6 views
8

Aktualnie mam czat oparty na technologii Ajax, który staram się usprawnić, ładując skrypt czatu tylko po wystąpieniu aktualizacji. Dlatego nic nie musi się ładować, jeśli nic się nie zmieniło w bazie danych.Czat Ajax - aktualizacja tylko w przypadku zmiany

Mój obecny logika mówi:

  • funkcja JavaScript pożary każdą 1/2 sekundy, aby uzyskać czat dzienniki (setInterval())

Jeśli nic się nie zmieniło, choć wydaje się dość nieefektywne wzywasz to. Zamiast tego, co chciałbym zrobić, to:

  1. sprawdza JavaScript funkcyjne, czy są jakieś nowedzienniki w bazie danych
  2. Jeśli TAK - załadować nowe dzienniki, jeśli nie - zostaw aktualnie wyświetlane dzienniki sam.

Co mam jednak zrobić? Obecnie używam funkcji:

function updateShouts() { 
    $('#chatArea').load('chat.php'); // load chat logs 
} 
setInterval("updateShouts()", 500); // call function every half a second 

Odpowiedz

0

Jak wiadomo, funkcja .load wypełnia element danymi wyjściowymi zwracanymi przez plik chat.php. Ta funkcja .load wykonuje dwa kroki: tworzy zapytanie ajax do pliku chat.php, a następnie ustawia wartość elementu na wynik działania chat.php. To, co chcesz zrobić, to tylko pierwszy krok. Aby to zrobić, należy użyć funkcji .ajax

http://api.jquery.com/jQuery.ajax/

Zamiast plik chat.php Proponuję powołanie innego scenariusza jak isChatUpdated.php. Ten skrypt będzie działał tak, jak sugeruje nazwa i sprawdza, czy nastąpiły jakieś zmiany na czacie. Następnie możesz użyć tego wyniku, aby dowiedzieć się, czy musisz wywołać funkcję .load.

+0

Dzięki funkcji Ajax jak masz zwrócona wartość ze sprawdzania skryptu php? – Dave

+0

Musisz określić funkcję zwrotną "sukces". Zobaczysz, jak to działa na stronie, do której Cię przyłączyłem. –

0

W obu przypadkach należy wykonać zapytanie do bazy danych po stronie serwera, więc prawie nie ma znaczenia, jeśli zwraca dane dziennika lub jedną wartość.
Możesz zrezygnować z aktualizacji # chatArea, bazując na wartości zwracanej, ale musisz wykonać kolejne wywołanie, aby pobrać logi, w przeciwnym razie.

1

Jednym ze stosunkowo prostych sposobów na to jest użycie AJAX do pobrania strony, która po prostu informuje, czy nastąpiła jakakolwiek aktualizacja. Na przykład możesz pobrać stronę taką jak checkForUpdate.php, która ma 1 lub 0, aby wskazać, czy na czacie jest coś nowego. Jeśli masz 1 back, możesz iść dalej i załadować pełną stronę chat.php.

(jeśli nie był używany AJAX wcześniej, jest to całkiem dobry tutorial: http://www.tizag.com/ajaxTutorial/)

Innym rozwiązaniem (i jeden, który myślę, że jest to prawdopodobnie lepiej) jest, aby załadować stronę, która ma tylko najnowsze linie czatu. Na przykład powiedz, że aktualnie wyświetlasz linie 1-14 na czacie. Następnie można użyć AJAX do pobrania treści, na przykład getLines.php?s=14. Ta strona wyświetlałaby linie linii po linii 14. Następnie dodajesz te linie na końcu bieżącego okna czatu.

+0

+1 tylko do ładowania wierszy "nowych" (do klienta). – timdev

3

Będę przekazywać timestamp s (lub message_id s) wraz z wszelkimi wiadomościami czatu wysyłanymi przez skrypt po stronie serwera do klienta. Następnie klient prosi o nowe wiadomości, a serwer wysyła tylko to, co nowe.

Wyobraź sobie, że każda wiadomość na czacie ma identyfikator. Chciałbym zaprojektować chat.php przyjąć parametr tak:

chat.php?since=12345 

12345 byłoby id ostatniej wiadomości klient widział. chat.php zasadniczo robi coś takiego:

SELECT * FROM chatmessages WHERE id > $since 

... i przechodzi z powrotem ładny mały struktury danych (tablicę obiektów, zakodowany w formacie JSON, powiedzmy).

Tak więc, jeśli nie ma nowych wiadomości czatu, serwer właśnie przekazuje pustą tablicę.

Nie sądzę, że możesz być bardziej wydajny niż to.

EDIT:

Zdaję sobie sprawę, że robią to w ten sposób wymaga trochę więcej kodowanie po stronie klienta. Nie aktualizujesz już tylko diva w całej historii czatu. Będziesz także potrzebował pomocy w wywołaniu ajax, które będzie iterować po wynikach, a dla każdej wiadomości programowo skonstruuj div dla tej linii, a następnie dołączy ją do twojego czatu div.

0

bym najpierw utworzyć plik o nazwie np messages.php który wyglądał mniej więcej tak:

<?php header('Content-Type: application/json'); 

$messages_since = !empty($_POST['since']) 
    ? mysql_real_escape($_POST['since']) 
    : '0000-00-00 00:00:00'); 

// Get all messages from database since the $messages_since date_time 

echo json_encode($array_with_messages); 

następnie na stronie klienta przy użyciu jQuery czy coś takiego chciałbym zrobić coś takiego:

  1. się komunikaty za pomocą czegoś podobnego $.post('messages.php', new_messages_handler)
  2. W obsługi chciałbym tworzyć html dla każdej nowej wiadomości wróciliśmy i dołącz/poprzedź go do pojemnika na czacie, a także przechowywać co czas aktualne mes szał został stworzony.
  3. trochę poczekać
  4. Otrzymuj nowe wiadomości za pomocą czegoś podobnego $.post('messages.php', {since: latest_datetime_we_have}, new_messages_handler)
  5. idź do 2

Przynajmniej to działa całkiem dobrze w głowie: P