Nov 8 2009

Raportowanie bledow strony klienta

Back-end aplikacji webowej, mozna kontrolowac przegladajac raporty i logi, lecz nijak ma sie to do front-endu wyswietlanego po stronie klienta. Nie dowiemy sie czy i kiedy wystapi blad, dopoki jakis nawiedzony klient nie zwymysla nam do sluchawki, chyba, ze mamy 105 srodowisk testowych, na ktorych mozemy sprawdzic kazda funkcjonalnosc aplikacji.

I tutaj nasuwa sie pytanie, czy nie ma innej mozliwosci?
Sa, a to jedna z nich, dzieki asynchronicznym zapytaniom, raport o bledzie klienta trafi do back-endu, i zapisany zostanie, do bazki czy pliku logow.

Przechwytywanie bledow

1. Dodajemy wymagane pliki bibliotek

<script type="text/javascript" src="http://www.losoft.org/blog/download/ajax/loajax_v1.1.js"></script>

plik mozna pobrac z dzialu Download, albo zamiast klasy loAJAX, linkujemy wlasnego wrappera ajax.

2. Tworzymy metode akcyjna zdarzenia window.onerror

// on/off powiadomienie klienta o bledzie
var suppressErrors = true;
// nowy obiekt ajax
var ajax = new loAJAX(this, "http://www.losoft.org/blog/examples/ajax/errorreport.php", null, AJAX_POST);
// akcja zdarzenia onerror
function errorReport(msg, url, lineNumber)
{
	ajax.reset();
	ajax.addParam("msg", msg);
	ajax.addParam("url", url);
	ajax.addParam("lineNumber", lineNumber);
	ajax.request();
 
	if (suppressErrors) {
		return true;
	}
	alert("Error occurred: " + msg + "\nURL: " + url + "\nLine Number: " + lineNumber);
};

3. Podpiecie akcji

window.onerror = errorReport;

Jak mamy juz gotowa metode, to teraz … zajmijmy sie odebraniem raportu po stronie serwera

4. Skrypt naslychujacy w PHP

<?php
$msg = $_REQUEST["msg"];
$url = $_REQUEST["url"];
$lineNumber = $_REQUEST["lineNumber"];
// tutaj zapis do pliku, bazki, lub ...
// naprzyklad wysylamy sformatowana wiadomosc do klienta
echo "AJAX Response.\nError occurred: ".$msg."\nURL: ".$url."\nLine Number: ".$lineNumber;
?>

Aby wyswietlic wynik dzialania, mozemy podpiac listenera przed wywolaniem metody ajax.request(); w ten sposob

ajax.setListener(ajaxListener);

tego wlasnie nasluchiwacza

// funkcja listenera
function ajaxListener()
{
	if (ajax.xmlHttp.readyState == 4) {
		alert(ajax.xmlHttp.responseText);
	}
};

Testujemy…

Pobierz przyklad

Przyklad:

Tagi: , , ,

Wpis zostal dodany w Sunday, November 8th, 2009 o 19:24i umieszczony w JS/AJAX, PHP, Web. Mozesz sledzic wszystkie odpowiedzi do tego postu przez RSS 2.0. Mozesz tez zostawic odpowiedz lub trackbacknac z wlasnej strony.

Zostaw odpowiedz