PHPGangsta - Der praktische PHP Blog

PHP Blog von PHPGangsta


Archive for the ‘PHP’ Category

GeoLocation mit modernen Browsern

with 8 comments

Der ein oder andere von euch hat vielleicht schonmal mit GeoLocations experimentiert. Es gibt freie GeoDatenbanken und GeoIP-Datenbanken, mit denen man eine IP-Adresse umwandeln kann in einen Ort (bzw. Region/Land).

Als ich nun vor einigen Monaten hörte, dass der Firefox bald eine neue GeoLocation-Funktionalität erhält, womit dann viele neue standortabhängige Dienste möglich sind, war ich gespannt was tolles neues dabei rauskommt. Zuerst dachte ich, dass man im Browser seine Daten eingibt, und dann sendet das der Browser an die Webseite, falls die das wissen möchte.

Doch ich habe die Rechnung ohne die ganzen mobilen Geräte gemacht, für die das Feature primär interessant ist (ich selbst habe zwar einen PDA, aber keinen Internet-Daten-Tarif, deshalb hab ich daran nicht wirklich gedacht).

Was kann das Feature nun? Es passiert folgendes: Falls die Webseite die GeoLocation ermitteln möchte, bekommt der Benutzer eine Frage präsentiert:

geolocation1

Man kann dann entscheiden, ob man diese Informationen senden möchte oder nicht. Falls man „Ja“ klickt, wird die IP-Adresse an einen Google-Service geschickt. Außerdem werden noch GPS-Informationen und erreichbare WLAN-Netze (incl. ermittelter Empfangsstärke) versendet an Google Location Services. Daraus kann Google dann eine mehr oder weniger genaue Position ermitteln (bei GPS natürlich sehr genau bis auf wenige Meter, bei WLAN-Informationen kann es auch schon sehr ungenau werden, je nachdem wieviele WLANs da sind und ob diese bereits kartographiert wurden).

Diese Standort-Information erhält dann der Browser, und dann kann diese Information mittels Javascript API abgefragt werden. Das hier sind die Informationen, die man erhält:

geolocation3

Man erhält also die Angaben in Form von Latitude und Longitude, sowie evtl. weitere GPS-Informationen wie Höhe, Geschwindigkeit usw. Falls man diese Informationen in einen Ortsnamen umwandeln möchte, benötigt man entweder wieder eine Datenbank mit Informationen oder man nutzt einen Webservice, der das selbe tut.
In meiner Demo nutze ich letzteres, und lasse anhand der Latitude/Longitude den Namen der Stadt ermitteln, dazu nutze ich www.geonames.org.

Inklusive Stadt sieht das Endergebnis dann so aus:

geolocation5

Wie sieht das nun im Quelltext aus? Eigentlich sehr übersichtlich:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>

    <title>PHP Gangsta Geolocation</title>
    <SCRIPT TYPE="text/javascript" SRC="http://ajax.googleapis.com/ajax/libs/dojo/1.3/dojo/dojo.xd.js"></SCRIPT>

    <script type="text/javascript">
        function startgeolocation() {
            // Check for geoLocation Support
            if (navigator.geolocation) {
                // the location is looked up only once
                navigator.geolocation.getCurrentPosition(renderPosition, renderError);
                // every time the location changes
                // navigator.geolocation.watchPosition(renderPosition, renderError);
            } else {
            	dojo.byId('geoResults').innerHTML = '<p>Your browser does not support geolocation.</p>';
            }
        }

        // I use Dojo to render the output and do an AJAX call to get city name
        function renderPosition(position) {
            if (!window.count) window.count = 0;

            count ++;
            // var urlJSON = 'http://ws.geonames.org/findNearbyPlaceNameJSON?lat=-36.9104718&lng=174.9133483';
            var urlJSON = 'geonames.php?lat='+position.coords.latitude+'&lon='+position.coords.longitude;

            dojo.byId('d').innerHTML = '<div id="results" style="width: 200px; height: 200px; text-align: left"><p>'
                            + 'Latitude: ' + position.coords.latitude + '<br />'
                            + 'Longitude: ' + position.coords.longitude + '<br />'
                            + 'Accuracy: ' + position.coords.accuracy + '<br />'
                            + 'Update number: ' + count + '<br />'
                            + 'Altitude: ' + position.coords.altitude + '<br />'
                            + 'Altitude accuracy: ' + position.coords.altitudeAccuracy + '<br />'
                            + 'Heading: ' + position.coords.heading + '<br />'
                            + 'Speed: ' + position.coords.speed + '<br />'
                            + 'Google Maps: <a href="http://maps.google.com/maps?geocode=&q=' +
                            			position.coords.latitude + '+' + position.coords.longitude +
                            			'">Click</a><br />'
                            + '</p></div>';

            // now get the XML reverse geo data
           dojo.xhrGet( { //
		        // The following URL must match that used to test the server.
		        url: urlJSON,
		        handleAs: "json",
		        timeout: 5000, // Time in milliseconds
		        // The LOAD function will be called on a successful response.
		        load: function(responseObject, ioArgs) {
		        	for each (var item in responseObject.geonames) {
		        		dojo.byId('jsonResults').innerHTML = '<p>You live in: ' + item.name + '</p>';
		        	}
		          	return responseObject;
		        },
		        // The ERROR function will be called in an error case.
		        error: function(responseObject, ioArgs) { //
		          	console.error("HTTP status code: ", ioArgs.xhr.status); //
		          	return responseObject;
	          	}
		    });
        }

        function renderError() {
        	dojo.byId('geoResults').innerHTML = '<p>The page could not get your location.</p>';
        }
    </script>
</head>

<body onload="startgeolocation();">

	<div align="center">
	<h1>GeoLocation Demo</h1>
	<div id="geoResults">
	    <div id="d"><img src="loadingAnimation.gif" /></div>
	    <div id="jsonResults">city information are fetched...</div>
	</div>

</body>
</html>

Das einzig verwunderliche ist vielleicht der AJAX-Aufruf. Ich hatte ja geschrieben, dass ich den Namen der Stadt von geonames.org holen möchte. Da die Cross-Domain-Policy nur einen Ajax-Aufruf zum selben Server erlaubt, brauchen wir ein kleines „Proxy-Script“, welches so aussieht:

<?php
echo file_get_contents('http://ws.geonames.org/findNearbyPlaceNameJSON?lat='.$_GET['lat'].'&lng='.$_GET['lon']);
?>

Damit umgehen wir die Cross-Domain-Policy und erhalten unser Ergebnis in JSON-Form. Das war auch schon der ganze Zauber.

Aktuell beherrschen meines Wissens nach der Firefox 3.5, Chrome und die aktuellen Beta-Versionen von Safari und Opera diese Funktionalität. Google Gears bietet eine ähnliche Funktionalität (browserübergreifend), aber ich kennen niemanden, der Gears installiert hat.
Man kann übrigens im Firefox den Location Service ändern, falls man Google nicht mag:
geolocation4

Falls ihr ein Handy mit Internet habt, könnt ihr auch mal Google Maps Mobile ausprobieren. Außerdem könnt ihr hier mein Demo-Script ausprobieren.

Ich bin gespannt, was für interessante Dienste da bald aus dem Boden sprießen. Ich meine schonmal etwas gehört zu haben von „gucken wo Freunde gerade sind“ und sowas. Ich bin auch gespannt, wann ich endlich ein neues Handy mit Datentarif bekomme…

Written by Michael Kliewe

September 10th, 2009 at 10:33 am

Posted in PHP

Tagged with , ,

PHP-Unconference 2009 am Wochenende

without comments

Die PHP-Unconference findet dieses Jahr wieder statt, und zwar vom 12.09. – 13.09.2009 (also nächstes Wochenende!) im Hamburger Geomatikum.

Da ich den Termin letztes Jahr verpasst habe, bin ich umso glücklicher, dieses Jahr dabei sein zu können. Da ich dort privat hinfahre, kommt mir der Preis von 25 Euro natürlich sehr entgegen. Andere (größere) PHP-Konferenzen kosten häufig pro Tag mehr als 500 Euro, und hier gibt es 2 Tage für 25 Euro. Cool!

Organisiert wird es von der PHP-User-Group Hamburg und der Informatik-Abteilung Uni Hamburg.

Falls sich jemand fragt, was eine Unconference ist: Es handelt sich hierbei nicht um eine klassische Konferenz mit fester Agenda und starren Vorträgen, sondern vielmehr um kleine Präsentationen, Diskussionen und Gesprächen rund um alle Themen. Jeder Teilnehmer kann auch selbst auf der Bühne stehen. Es bleibt aufgrund der Größe (ca. 200 Leute werden da sein) im kleineren Rahmen. In der ersten Session wird abgestimmt, welche Themen auf die Bühne kommen. Ich bin gespannt, ist meine erste Unconference!

Ich freue mich auch schon besonders auf mein Wunschthema „PHP im Enterprise. Skalierbarkeit und Sicherheit“, das ziemlich beliebt ist, denn aktuell ist es auf Platz 1 der Vorschlags-Liste. Auch 3 bekannte Persönlichkeiten/Firmen haben schon angeboten, Vorträge dazu zu halten. Hier könnt ihr schauen, welche Themen sonst noch interessant sind.

Ob ich wohl einen meiner Leser dort treffen werde? Ich lasse mich überraschen.

PS: Falls jemand von euch eine günstige Möglichkeit kennt, dort für <30 Euro zu übernachten (nein, Auto zählt nicht), möge er sich schnell melden!

Written by Michael Kliewe

September 9th, 2009 at 4:32 pm

CSS Sprites

with one comment

In einem meiner letzten Artikel zum Thema „ Externe Javascript Dateien zusammenfassen“ haben wir bereits gemerkt, dass man HTTP-Requests verringern sollte, um die Performance auf dem Client und die Benutzererfahrung zu verbessern. Dies kann im Falle von CSS-Dateien weniger effektiv sein als beispielsweise bei Javascript-Dateien.

Bei Bildern in großer Anzahl muss der Browser diese auch nacheinander laden, was zu Verzögerungen bei der Anzeige führen kann. Nehmen wir an, wir haben eine Webseite mit vielen Grafiken. Das Menu besteht aus 10 Bildern, jedes davon hat einen Mouseover-Effekt, und es gibt noch einige weitere Bilder. Es resultiert also in >25 Bildern, die der Browser einzeln laden muss. Außerdem stehen dann die Mouseover-Bilder bereits von Anfang an zur Verfügung, und müssen nicht erst geladen werden, wenn die Maus darüber bewegt wird, wir haben also eine Art eingebauten Preload.

Um die Anzahl von HTTP-Requests zu verringern, kann man alle Bilder in ein großes Bild packen, und mit Hilfe von CSS dann den richtigen Abschnitt anzeigen. In diesem Schritt kann man auch nochmal diese Bilder etwas komprimieren, um noch Bandbreite zu sparen, denn häufig sehen die Bilder auch mit weniger Farben genausogut aus.

Ein solches Bild könnte zB. so aussehen:

nav-final

Wir haben also viele kleine Bilder in einem Bild untergebracht. Um diese Bildchen dann nutzen zu können und nur einen kleinen Ausschnitt dieses großen Bildes anzeigen zu können, nutzen wir die CSS-Funktion „background-position“.

Beispielsweise könnte der HTML-Code so aussehen:

<ul id=”navigation”>
	<li id=”navigation-01"><a href=”#”><span>Blog</span></a></li>
	<li id=”navigation-02"><a href=”#”><span>Portfolio</span></a></li>
	<li id=”navigation-03"><a href=”#”><span>Resume</span></a></li>
	<li id=”navigation-04"><a href=”#”><span>Contact</span></a></li>
</ul>

Wir schreiben die einzelnen Menupunkte noch als Text rein, damit Suchmaschinen sie lesen können. Das entsprechende CSS sieht dann so aus:

#navigation {
	background:url(”/images/navigation.jpg”) no-repeat;
	width:490px;
	height:40px;
	margin:0;
	padding:0;
}

#navigation span {
	display: none;
}

#navigation li, #navigation a {
	height:40px;
	display:block;
}

#navigation li {
	float:left;
	list-style:none;
	display:inline;
}

#navigation-01 {width: 98px;}
#navigation-02 {width: 131px;}
#navigation-03 {width: 123px;}
#navigation-04 {width: 138px;}

#navigation-01 a:hover {background:url(”/images/navigation.jpg”) 0px -40px no-repeat; }
#navigation-02 a:hover {background:url(”/images/navigation.jpg”) -98px -40px no-repeat; }
#navigation-03 a:hover {background:url(”/images/navigation.jpg”) -229px -40px no-repeat; }
#navigation-04 a:hover {background:url(”/images/navigation.jpg”) -352px -40px no-repeat; }

Standardmäßig soll die „erste Zeile“ des Bildes angezeigt werden. Das erreichen wir, indem wir das ganze Bild nehmen, aber nur 490*40 Pixel anzeigen (Zeilen 2-6). Wir blenden die spans aus (Zeile 10), ändern noch das Verhalten der Liste, damit die einzelnen Punkte nicht untereinander, sondern nebeneinander erscheinend (Zeilen 19-21). Wir definieren die Breite der einzelnen Listenelemente, und spezifizieren zum Schluss noch den Hover-Effekt, der einen anderen Ausschnitt anzeigen soll.

Es gibt auch Online CSS Sprite Generatoren, mit deren Hilfe es einfach ist, viele einzelne Bilder zu einem großen Bild zusammenzufassen, und dann die entsprechenden Koordinaten zu erhalten. Schaut euch einfach die folgenden Webseiten an:

http://www.csssprites.com

http://spritegen.website-performance.org

Written by Michael Kliewe

September 3rd, 2009 at 1:09 am

Traffic pro eingeloggtem User herausfinden

with 7 comments

Den Traffic einer ganzen Seite herauszufinden ist nicht sonderlich schwer in Zeiten von awstats, webalizer und diversen anderen Apache-Log-Analyzern.

Doch ich wollte damals bei meinem eigenen Browsergame den Traffic pro eingeloggtem User messen. Idee war damals, den „Free Accounts“ 100MB pro Monat zu schenken, falls mehr benötigt wird, muss ein Premium-Account her.

Doch wie stellt man das an? Das Apache-Log hilft nicht wirklich, denn dort kann man nicht die einzelnen (eingeloggten) User unterscheiden. Ich habe damals 3 Lösungen gefunden:

  • mit dem Output Buffer von PHP arbeiten, Stringlänge bestimmen und mitloggen, dann Seite an den Browser schicken
  • Irgendwie die IP-Adressen des Users merken, und dann das Apache-Log durchparsen und rechnen.
  • die Apache-Extension mod_log_sql

Möglichkeit 1 sieht dann ungefähr so aus:

<?php
ob_start();

// some html content here

$trafficbytes = strlen(ob_get_flush());
// insert traffic into database

?>

Habe es nie ausführlich getestet, aber ich denke es ist langsam (da das HTML erst am Ende geflushed wird anstatt zwischendurch schon Häppchen zu verschicken). Außerdem muß man sich noch um Bilder kümmern, denn die sollen ja auch mitgezählt werden. Dazu würde ich eine Rewrite-Rule empfehlen, die bei jedem Bildrequest noch schnell ein php-Script ausführt. Auch das beeinflusst natürlich die Performance des Besuchers und des Webservers.

Die zweite Möglichkeit ist nicht ganz einfach umzusetzen. Die IP-Adresse allein ist nicht sonderlich aussagekräftig, einen Benutzer damit zu verfolgen recht aufwändig. In Zeiten von Proxies (Grüße an AOL), Neueinwahl bei DSL, mehrere Benutzer hinter einem Heimrouter etc reicht das nicht aus, um darüber den Benutzer zu bestimmen, gerade wenn Bruder und Schwester gemeinsam über eine Leitung im Internet sind usw.

Die dritte Alternative ist das Apache-Modul, welches ich dann auch genutzt habe: mod_log_sql. Dieses bindet man einfach in die entsprechene Apache-Config ein, und schon wird ein zusätzliches Log erzeugt, nämlich in der Datenbank. Dies kann man entweder für alle Seiten tun, oder nur für bestimmte VirtualHosts. Welche Spalten dort gefüllt werden sollen, in welcher Reihenfolge und mit welchen Daten, konfiguriert man in der apache-Config. Hier eine Beispielkonfiguration (hier für Linux, für Windows sieht es ähnlich aus: .dll statt .so usw.):

LoadModule log_sql_module modules/mod_log_sql.so
LoadModule log_sql_mysql_module modules/mod_log_sql_mysql.so

LogSQLLoginInfo mysqli://apacheloguser:apachelogpwd@localhost/apachelogdb
LogSQLCreateTables On
LogSQLMachineID mylocalmaschine
LogSQLTransferLogFormat AbHIhMmpRSstTUuvz
LogSQLTransferLogTable ztraffic_access_log
#LogSQLNotesLogTable ztraffic_notes
LogSQLCookieLogTable ztraffic_cookies
#LogSQLHeadersInLogTable ztraffic_headers_in
#LogSQLHeadersOutLogTable ztraffic_headers_out
LogSQLWhichCookies UserID     # hier könnten noch mehr Cookies stehen

Man kann alternativ zur eigenen Cookie-Tabelle auch ein bestimmtes Cookie mit ‚c‘ und „LogSQLWhichCookie“ in die access_log schrieben lassen. Hier eine Liste der Informationen, die man speichern kann.

Damit das Modul funktioniert, muß man noch das Modul „unique“ aktivieren, entweder per

a2enmod unique_id

oder via Einkommentieren von

LoadModule unique_id_module modules/mod_unique_id.so

Apache reload. Wenn man danach eine Seite besucht, liest man folgendes im apache error log:

[Tue Sep 01 19:59:46 2009] [notice] mod_log_sql: child established database connection
[Tue Sep 01 19:59:46 2009] [error] mysql_query returned (1)
[Tue Sep 01 19:59:46 2009] [error] table does not exist, preserving query
[Tue Sep 01 19:59:46 2009] [error] table doesn't exist...creating now
[Tue Sep 01 19:59:47 2009] [error] tables successfully created - retrying query
[Tue Sep 01 19:59:47 2009] [notice] query successful after table creation

Die Tabelle wurde also erfolgreich angelegt. Das Ergebnis sieht dann so aus:

modlogsql0

Der Inhalt der Tabelle (nur 1 Zeile):

modlogsql

Wäre dieser Test-Request kein 304er (Not Modified), hätten wir bei „bytes_sent“ auch eine Traffic-Angabe.

Mit Hilfe der Cookie-Tabelle können wir dann zB einmal täglich den Traffic jeden Users berechnen und in die entsprechende User-Tabelle füllen. Die Log-Tabelle sollte man dann wieder aufräumen und nicht länger benötigte Zeilen löschen.

Übrigens ist das Modul nur für Linux supported. Unter Windows kann man es zwar auch kompilieren, das ist aber mehr hohem Aufwand verbunden. Ich habe damals (2004) durch Zufall eine kompilierte Version gefunden. Die ist aber heute nicht mehr brauchbar, da sie für eine sehr alte Apache-Version kompiliert wurde.

Wenn ihr Fragen habt, fragt! Oder wenn ihr evtl. bessere Lösungen kenn, her damit! Oder was könnte man noch alles anstellen mit diesen Apache-Logs in einer Datenbank?

—————————————————-

Weitere interessante Links zum Thema:

Anleitung für Debian Etch

Die offizielle Webseite des Moduls

Written by Michael Kliewe

September 1st, 2009 at 8:29 pm

Posted in PHP

Tagged with , , , , ,

Echo, Print und die Parameter

with 5 comments

Wenn man sehr viel mit Strings und Stringausgaben arbeitet, und dabei maximale Performance braucht, gibt es einige Tricks, die dabei helfen, die letzten Prozente rauszuholen.
Bedenkt also: Diese leichten Performance-Unterschiede bringen nur bei sehr großen Scripten etwas. Bei einer kleinen Webseite oder ähnlichem ist der Unterschied zu vernachlässigen, da zählt mehr die persönliche Vorliebe und Lesbarkeit.

Zuerst einmal: in PHP gibt es zur Ausgabe von Daten (das können ja auch Zahlen sein, nicht nur Strings) zwei einfache Funktionen: echo und print.

Diese beiden Funktionen sind etwas besonderes: Es sind Sprachkonstrukte, und keine Funktionen. Man kann sie also auch ohne Klammern benutzen, beispielsweise so:

echo 'Dies ist ein Text';
echo('Dies ist ein Text');

Aber das kann auch zu Problemen führen, beispielsweise in diesem Quelltext:

(1 === $i) ? echo 'gleich' : echo 'ungleich';

Bei dieser trinären Bedingung funktioniert echo nicht, da es keinen Rückgabewert hat. print funktioniert.

echo ist print immer vorzuziehen. Warum? echo ist leicht performanter (aber nur im tausendstel Bereich, siehe unten). Außerdem bietet es die Möglichkeit, mehrere Parameter zu übergeben. Auch das ist minimal schneller als einen String mit Punkten zu verbinden.

In den folgenden Scripten nutze ich jeweils den Output Buffer von PHP, um nur im Speicher zu arbeiten. Wenn man die ob_-Funktionen weglassen würde, würde ein sehr großer Teil der CPU-Belastung (und damit des Tests) auf die eigentliche Ausgabe in der Console (bzw. dem Browser) draufgehen und die Ergebnisse verfälschen.

<?php
$string1 = "_string1_";
$string2 = "_string2_";

$timeStartComma = microtime(true);
for ($i=0; $i<1000000; $i++) {
	ob_start();
	echo $string1, 'sometexthere', $string2, "\r\n";
	ob_get_clean();
}
$timeEndComma = microtime(true);

$timeStartDot = microtime(true);
for ($i=0; $i<1000000; $i++) {
	ob_start();
	echo $string1 . 'sometexthere' . $string2 . "\r\n";
	ob_get_clean();
}
$timeEndDot = microtime(true);

$timeStartPrint = microtime(true);
for ($i=0; $i<1000000; $i++) {
	ob_start();
	print $string1 . 'sometexthere' . $string2 . "\r\n";
	ob_get_clean();
}
$timeEndPrint = microtime(true);

echo "Comma needed " . ($timeEndComma-$timeStartComma) . " seconds\n";
echo "Dot needed " . ($timeEndDot-$timeStartDot) . " seconds\n";
echo "Print needed " . ($timeEndPrint-$timeStartPrint) . " seconds\n";
?>

echo1

<?php
$string1 = "_string1_";
$string2 = '_string2_';

$timeStartDouble = microtime(true);
for ($i=0; $i<1000000; $i++) {
	ob_start();
	echo "_string1__string1__string1__string1_";
	ob_get_clean();
}
$timeEndDouble = microtime(true);

$timeStartSingle = microtime(true);
for ($i=0; $i<1000000; $i++) {
	ob_start();
	echo '_string2__string2__string2__string2_';
	ob_get_clean();
}
$timeEndSingle = microtime(true);

echo "Double needed " . ($timeEndDouble-$timeStartDouble) . " seconds\n";
echo "Single needed " . ($timeEndSingle-$timeStartSingle) . " seconds\n";
?>

echo4

Es ist übrigens minimal schneller, wenn man keine Klammern nutzt.

<?php
$timeStartWithout = microtime(true);
for ($i=0; $i<1000000; $i++) {
	ob_start();
	echo '_string1_';
	ob_get_clean();
}
$timeEndWithout = microtime(true);

$timeStartWith = microtime(true);
for ($i=0; $i<1000000; $i++) {
	ob_start();
	echo('_string1_');
	ob_get_clean();
}
$timeEndWith = microtime(true);

echo "Without brackets needed " . ($timeEndWithout-$timeStartWithout) . " seconds\n";
echo "With brackets needed " . ($timeEndWith-$timeStartWith) . " seconds\n";
?>

echo5

Man beachte wie gesagt, dass wir hier von 1 Million Schleifendurchläufen reden. In 99,9% aller Fälle ist der Unterschied zu vernachlässigen. Wer also hoch performante Riesenscripte bauen möchte, sollte sich das ganze genau anschauen (oder solche Dinge gleich in C schreiben, aber ich will ja keine Werbung für andere Programmiersprachen machen 😉 )

Written by Michael Kliewe

September 1st, 2009 at 9:02 am

Posted in PHP

Tagged with , ,