Wpisy oznaczone etykietk▒ 'ajax'

AJAX w praktyce na phpBB

Ajax w praktyce na phpBBO tym, co to jest AJAX mo┬┐na przeczyta├Ž na:
http://pl.wikipedia.org/wiki/AJAX
Mo┬┐na te┬┐ przeczyta├Ž artyku┬│ (w j├¬zyku angielskim), kt├│ry jako jeden z pierwszych poruszy┬│ t├¬ kwesti├¬:
http://www.adaptivepath.com/publications/essays/archives/000385.php

W tym tek┬Âcie postaram si├¬ w miar├¬ przyst├¬pnie opisa├Ž proces instalacji AJAXa na forum phpBB. Zadaniem tej prostej aplikacji b├¬dzie powiadamianie forumowicz├│w o nowych postach bez potrzeby prze┬│adowywania samego forum.

Na wst├¬pie pragne zaznaczy├Ž, ┬┐e jest to bardzo prosta wersja, kt├│ra ma raczej rzuci├Ž ┬Âwiat┬│o na zastosowanie AJAXa i pos┬│u┬┐y├Ž jako podstawa do budowania bardziej rozbudowanych aplikacji.

Aby wprowadzi├Ž prosty mechanizm powiadamiania o nowych postach na forum phpBB potrzebujemy zrobi├Ž kilka rzeczy:
– napisa├Ž skrypt w javaskrypcie stanowi┬▒cy serce ca┬│ej aplikacji
– zmodyfikowa├Ž jeden plik szablonu forum phpBB
– zmodyfikowa├Ž jeden plik silnika forum phpBB
– napisa├Ž ma┬│y skrypt zewn├¬trzny operuj┬▒cy na bazie forum phpBB

Idea dzia┬│ania jest taka:
– u┬┐ytkownik wchodzi na (pod)forum (wchodz┬▒c zarazem uruchamia skrypt wykonywuj┬▒cy si├¬ co zadany okres czasu)
– pobierany jest czas wej┬Âcia na forum
– pobierany jest numer identyfikacyjny forum
– na podstawie czasu wej┬Âcia na forum oraz numeru forum jest odpytywana baza danych, czy aby czasem nie pojawi┬│y si├¬ od wej┬Âcia na tym forum nowe posty
– otrzymujemy odpowied┬╝ z bazy danych czy s┬▒ nowe posty
– je┬Âli s┬▒ nowe posty, pokazujemy stosowny komunikat, je┬Âli nie, pokazujemy nie mniej stosowny komunikat ;)

A teraz do rzeczy.

Dla u┬│atwienia ca┬│y skrypt w javaskrypcie umie┬Âci┬│em w oddzielnym pliki, kt├│ry zapisa┬│em pod nazw┬▒ nowe.js i umie┬Âci┬│em w g┬│├│wnym katalogu, w kt├│rym znajduje si├¬ forum.

Zawarto┬Â├Ž pliku forum/nowe.js:

var http_request = false;
function makeRequest(url) {
http_request = false;
if (window.XMLHttpRequest) { // Mozilla, Safari,...
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {
http_request.overrideMimeType('text/xml');
}
} else if (window.ActiveXObject) { // IE
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!http_request) {
alert('Giving up :( Cannot create an XMLHTTP instance');
return false;
}
http_request.onreadystatechange = alertContents;
http_request.open('GET', url, true);
http_request.send(null);
}

function alertContents() {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
var xmldoc = http_request.responseXML;
var root_node = xmldoc.getElementsByTagName('root').item(0);
var qReply = root_node.firstChild.data;
if(qReply != 0)
{
// mamy qReply nowych postow, mozna te informacje wykorzystac
nowe.innerHTML = "Nowe posty na forum (" + qReply + ")";
}
else
{
// brak nowych postow, mozemy nic nie robic
nowe.innerHTML = "Brak nowych postow na forum";
}
} else {
alert('There was a problem with the request.');
}
}

}

function checker(tstamp, fid) {
makeRequest("q.php?t=" + tstamp + "&f=" + fid);
}

Plik ten jest pod³±czony do forum poprzez dodanie poni¿szej linii do pliku forum/templates/subSilver/overall_header.tpl tu¿ przed zamkniêciem sekcji nag³ówkowej (czyli linijke przed tekstem ):

<script language="javascript" type="text/javascript" src="nowe.js"></script>

R├│wnie┬┐ w tym samym pliku (forum/templates/subSilver/overall_header.tpl) w tagu umie┬Âci┬│em instrukcj├¬, kt├│ra uruchamia ca┬│y mechanizm:

onLoad='setInterval("checker({TSTAMP},{FORUM_ID})", 10000);'

oznacza ona tyle, i┬┐ w momencie za┬│adowania strony ma zosta├Ž uruchomiona funkcja odpowiedzialna za okresowe wykonywanie instukcji – setInterval() z dwoma parametrami:
– nazw┬▒ funkcji wraz z jej dwoma parametrami (znacznik czasu oraz numer forum) – checker({TSTAMP},{FORUM_ID})
– oraz interwa┬│em (trudne s┬│owo ;P) czyli odst├¬pem czasowym wyra┬┐onym w milisekundach 1000 milisekund = 1 sekunda

Ostatnia modyfikacja pliku forum/templates/subSilver/overall_header.tpl to dodanie na samym jego ko├▒cu:

<div id="nowe"></div>

czyli na razie puste miejsce na wy┬Âwietlanie informacji o nowych postach, kt├│re b├¬dziemy mogli dynamicznie uzupe┬│nia├Ž za pomoc┬▒ javaskryptu.

W nast├¬pnej kolejno┬Âci wypada┬│oby nada├Ž zmiennym szablonowym z pliku overall_header.tpl warto┬Âci.
Jak wida├Ž wy┬┐ej do funckji checker({TSTAMP},{FORUM_ID}) nale┬┐y przekaza├Ž dwa parametry:
TSTAMP – czyli znacznik czasowy (unix timestamp, wiadomo)
FORUM_ID – numer id forum
Mo┬┐emy to osi┬▒gn┬▒├Ž (na przyk┬│ad, poniwa┬┐ osoby bardziej do┬Âwiadczone mog┬▒ wpa┬Â├Ž na inne rozwi┬▒zanie) poprzez dodanie poni┬┐szego kodu PHP:


$fid = intval($_GET['f']);
if(!$fid) { $fid=0; }
$tstamp = time();
$template->assign_vars(array(
'FORUM_ID' => $fid,
'TSTAMP' => $tstamp)
);

do pliku forum/includes/page_header.php na samym jego ko├▒cu tu┬┐ przed:


$template->pparse('overall_header');

Tworzymy plik q.php w g┬│├│wnym katalogu forum o poni┬┐szej zawarto┬Âci, nie zapominaj┬▒c o wpisaniu w┬│a┬Âciwych danych potrzebnych do po┬│┬▒czenia z baz┬▒ danych:


<?php
// ustawiamy zmienne potrzebne do po┬│┬▒czenia z baz┬▒ danych
// kt├│re mo┬┐na wyci┬▒gn┬▒├Ž z pliku config.php
$DBhost = 'localhost';
$DBuser = 'uzytkownik';
$DBpassword = 'haslo';
$DBname = 'baza_forum';

// pobieramy zmienne
$tstamp = intval($_GET['t']);
$fid = intval($_GET['f']);

// nawi┬▒zujemy po┬│┬▒czenie
$mysql_link = @mysql_connect($DBhost, $DBuser, $DBpassword);
// wybieramy baze danych
@mysql_select_db($DBname, $mysql_link);

if($fid != 0) {
// zapytanie dla konkretnego forum_id
$sql = "SELECT count(*) FROM phpbb_posts WHERE forum_id = " . $fid . " AND post_time > " . $tstamp;
} else {
// zapytanie dla ca┬│ego forum
$sql = "SELECT count(*) FROM phpbb_posts WHERE post_time > " . $tstamp;
}
$res = mysql_query($sql);
$w = mysql_fetch_row($res);
$postow = $w[0];

// ustawiamy nag┬│├│wki
header('Content-Type: text/xml');

// wy┬Âwietlamy XMLa
echo '<?xml version="1.0" ?>';
echo '<root>';
if( $postow > 0 ) {
echo $postow;
} else {
echo '0';
}
echo '</root>';
?>

I to wszystko, teraz po wej┬Âciu na forum i odczekaniu minimum 10 sekund od napisania pierwszego nowego posta powinien pojawi├Ž si├¬ tekst z informacj┬▒.

Powy┬┐sze dzia┬│aj┬▒ce rozwi┬▒zanie mo┬┐ecie przetestowa├Ž jak si├¬ sprawdza w praktyce na forum rotfl.pl.

wersja 1.00

22 wrze┼Ťnia, 2005


Kalendarz

Pa┼║dziernik 2020
P W Ś C P S N
« Lut    
 1234
567891011
12131415161718
19202122232425
262728293031  

Wpisy w miesi´┐Żcach

Tagi