Plik http_request.js:
Kod
var request = null;
/* Funkcja opakowująca do skonstruowania obiektu żądania.
Parametry:
reqType: typ żądania HTTP, na przykład GET lub POST.
url: adres URL programu serwerowego.
asynch: czy żądanie będzie wysyłane asynchronicznie, czy też nie
respHandle: nazwa funkcji, która będzie obsługiwała odpowiedź.
Każde pięć parametrów przedstawione przez arguments[4] stanowią dane
żądania POST przeznaczonego do wysłania. */
function httpRequest(reqType,url,asynch,respHandle,optional){
// Przeglądarki na bazie Mozilli.
if(window.XMLHttpRequest){
request = new XMLHttpRequest();
} else if (window.ActiveXObject){
request=new ActiveXObject("Msxml2.XMLHTTP");
if (! request){
request=new ActiveXObject("Microsoft.XMLHTTP");
}
}
// Bardzo mało prawdopodobne, ale sprawdzamy, czy występują żądania null,
// jeśli także obiekt ActiveXObject nie został zainicjalizowany.
if(request) {
// Jeżeli parametr reqType jest typu POST, wówczas
// piąty argument funkcji stanowią dane przesyłane metodą POST.
if(reqType.toLowerCase() != "post") {
initReq(reqType,url,asynch,respHandle);
} else {
// Dane przekazywane metodą POST.
var args = arguments[4];
if(args !=null && args.length > 0){
initReq(reqType,url,asynch,respHandle,args);
}
}
} else {
alert("Używana przeglądarka nie pozwala na wykorzystanie "+
"wszystkich funkcji tej aplikacji!");
}
}
/* Inicjalizacja obiektu żądania, który został już skonstruowany. */
function initReq(reqType,url,bool,respHandle,args){
try{
/* Określamy funkcję, która bedzie obsługiwała odpowiedź HTTP */
request.onreadystatechange=respHandle;
request.open(reqType,url,bool);
// Jeżeli parametr reqType jest typu POST, wówczas
// piąty argument funkcji stanowią dane przesyłane metodą POST.
if(reqType.toLowerCase() == "post") {
request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=iso-8859-2");
request.send(arguments[4]);
} else {
request.send(null);
}
} catch (errv) {
alert(
"W tym momencie aplikacja "+
"nie może połączyć się z serwerem. "+
"Proszę spróbować ponownie w ciągu kilku sekund.\n"+
"Szczegółowe informacje o błędzie: "+errv.message);
}
}
Plik script.js:
Kod
var url="ajax.php";
var str="x=" + screen.width + "&y=" + screen.height;
httpRequest("POST",url,true,handleResponse,str);
function handleResponse(){
try{
if(request.readyState == 4){
if(request.status == 200){
alert(request.responseText);
} else {
// Wartość właściwości request.status wynosi 503,
// jeżeli aplikacja jest niedostępna, oraz
// wartość 500, jeśli aplikacja zawiera błąd.
alert(
"Wystąpił problem z komunikacją między obiektem XMLHttpRequest, "+
"a programem serwera.");
}
}// Koniec zewnętrznej pętli if.
} catch (err) {
alert("Serwer nie jest dostępny "+
"dla tej aplikacji. Proszę wkrótce spróbować"+
" ponownie. \nBłąd: "+err.message);
}
}
Plik index.php:
// coś tam coś tam
?>
<script type="text/javascript" src="http_request.js"></script>
<script type="text/javascript" src="script.js"></script>
<?php
Plik ajax.php:
<?php
// połączenie z bazą, zmienne $_POST['x'] i $_POST['y'] wskazują na wielkość ekranu, zapisujesz je w bazie, to już umiesz zrobić
?>
Pisane z palca, więc mogą być błędy, chociaż nie powinny wystąpić.
Użyłem kodu napisanego przez autorów książki `80 sposobów na AJAX`, wszelkie prawa zapewne zastrzeżone.
Przekierowanie rzeczywiście nie jest najlepszym sposobem, najlepsze wydaje się użycie właśnie obiektu żądania, nie da się tego zrobić w inny sposób. Nie można z JS przekazać zmiennej do PHP bez użycia XMLHttpRequest, albo bez przekierowywania. No a w PHP nie odczytasz nijak właściwości ekranu, bo to działa po stronie serwera - więc to jedyna opcja. Mam nadzieję, ze trochę Ci się rozjaśni po tym kodzie, są tam komentarze w pliku http_request.js (nie moje, ale są), wiec powinieneś zrozumieć, jak to działa.