Mobile Device Detection

Im Zuge der Erstellung einer mobilen Website stößt man früher oder später an den Punkt, an dem man Nutzer mit mobilen Devices erkennen möchte.

Ein Anwendungsfall kann z.B. sein, dass man Nutzer mit Smartphones (iPhone, Android-Phones, etc.) auf eine gesonderte mobile Site weiterleiten möchte. Oder man will zwischen verschiedenen Devices unterscheiden, um Seiteninhalte oder gar Funktionalitäten auf die unterschiedlichen Fähigkeiten der Geräte anzupassen.

Im Folgenden ein Überblick mit verschiedenen Open-Source-Bibliotheken, die für die Erkennung von mobilen Devices gedacht sind. Die Bandbreite reicht von einfachen Skripten zum Einbinden bis zur Device-Datenbank mit tausenden Geräten samt deren Eigenschaften.

Mobile Devices simulieren

Vorab ein kurzes Hinweis: Um die Erkennung von mobilen Devices auf schnelle Weise bereits ohne Device zu testen, modifiziert man einfach den User Agent des Browsers. Safari ist recht praktisch: Man aktiviert das Entwickler-Menü unter „Einstellungen > Erweitert > Menü ‚Entwickler‘ in der Menüleiste anzeigen”. Dann findet man dann über „Entwickler > User Agent” die die hinterlegten User Agents der Apple-Devices und kann diese aktivieren.

Grundsätzliche gibt es zum Testen und Simulieren auf dem Desktop-Rechner aber viele Wege, abhängig vom präferierten Browser.

Detect Mobile Browsers

Eine sehr einfache Device-Detection erhält man über die Website detectmobilebrowsers.com. Das dortige Skript steht in recht vielen Sprachen und Varianten zum Download bereit (Apache, ASP, C#, IIS, JSP, JavaScript, jQuery, PHP, Python, Rails). Es analysiert den User Agent des Browsers und liefert ein true zurück, wenn es sich um ein mobiles Devices handelt. Wenn ja, leitet es auf eine einstellbare URL weiter.

Link: detectmobilebrowsers.com/

Webkit Detection JavaScript

Schon etwas älter, aber trotzdem noch einsatzfähig, ist die WebKit-Erkennung, die von der offiziellen WebKit-Seite heruntergeladen werden kann. Sie macht vor allem dann Sinn, wenn man lediglich Erkennen will, ob es sich um einen WebKit-Browser (Safari, Chrome, etc.) oder ein iOS-Gerät mit Mobile Safari handelt. Es lässt sich auch einfach unterscheiden, ob gerade ein iPhone, iPad oder iPod verwendet wird.

Hier ein kurzes Beispiel, das zwischen normalen und mobilem Browser unterscheidet.

Ein Erkennung und Weiterleitung könnte z.B. so aussehen:
[js]
var isMobile = WebKitDetect.isMobile();

if (isMobile) {
window.location.href = „http://m.example.com“;
} else {
// kein mobiler
}
[/js]

Link: trac.webkit.org/wiki/DetectingWebKit

[ad]

WURFL

Weitaus ausgefeilter und komplexer gegenüber den vorigen Varianten ist WURFL. Es handelt sich um eine unabhängige und umfangreiche Open-Source-Datenbank mit Device-Informationen, die direkt über eine mitgelieferte API genutzt werden kann. Die API steht beispielsweise für Java, PHP und .NET zur Verfügung.

WURFL is a Device Description Repository (DDR), i.e. a software component which contains the descriptions of thousands of mobile devices. In its simplest incarnation, WURFL is an XML configuration file plus a set of programming APIs to access the data in real-time environments.

Der Umfang an hinterlegten Devices in WURFL ist enorm: Es sind tausende Geräte enthalten. Zu jedem dieser Gerät sind Detailinformationen hinterlegt, die sogenannten WURFL Capabilities. Diese reichen von allgemein Informationen wie Betriebsystem, Browser über HTML-,XHTML,CSS-Fähigkeiten bis hin zu Displaygrößen oder unterstützte Videoformate. Einen Eindruck über die genauen Abfragemöglichkeite bietet die Übersicht der WURFL Capabilities.

Hier ein Demo-File mit der PHP-API, das einige verschiedene Eigenschaften anzeigt: WURFL-Demo.

Eigentlich ist WURFL nicht schwer zu verwenden, wie der Code zum Beispiel zeigt. Man lädt WURFL herunter und entpackt es. Parallel dazu erstellt man eine neue PHP-Datei mit dem unterstehenden Code.

Beim ersten Start schreibt sich WURFL einen Cache auf die Platte ins Verzeichnis „/examples/resources/storage/persistence”, was etwas dauern kann. Danach ist WURFL einsatzbereit.

Der Code definiert zunächst die Pfade als Konstanten, die man ggf. anpassen muss. Der nachfolgende Codeteil initialisiert WURFL und liest den User Agent. Danach kann man sich daran machen, mit Eigenschaften abzufragen ($requestingDevice -> getCapability()).

Anzumerken ist, dass der Standard-Download von WURFL nur Demodaten für die Devices enthält. Für den echten Einsatz lädt man sich zusätzlich eine rund 20 MB große XML-Datei mit den tatsächlichen Device-Information und ersetzt die Demodaten. Dies zeigt nebenbei auch einer der Vorteile: Kommen zukünftig neue Devices auf den Markt, spielt man einfach eine neue XML-Datei ein. Kombiniert mit dem Abfragen von Eigenschaften (z.B. is_tablet) ergibt dies ein leistungsfähiges Gesamtpaket, das der Schnelllebigkeit auf dem mobilen Sektor gewachsen ist.

[php]
create();
$wurflInfo = $wurflManager -> getWURFLInfo();

// Device identifizieren
$requestingDevice = $wurflManager -> getDeviceForHttpRequest($_SERVER);

// jetzt kann man Capabilities abfragen, z.B:
echo $requestingDevice -> getCapability(„mobile_browser_version“);

?>
[/php]

Link: WURFL