ANEXIA Development and Managed Hosting
JUL
10
2017

Mit CodeIgniter zum eigenen URL-Shortener (inkl. Statistik)

Geschrieben am 10. Juli 2017 von Manuel Wutte

Kurz-URL-Dienste (bzw. auch URL-Shortener genannt) gibt es im Internet mittlerweile zahlreiche – doch was genau machen sie, und wozu braucht man diese eigentlich?

Diese Dienste bieten, wie der Name erahnen lässt, kurze URLs für beliebige Internetadressen an. Das bedeutet, du übergibst dem jeweiligen Dienstleister eine beliebige Internetadresse, und bekommst im Gegenzug von diesem eine Kurze zurück.
Dies ist insbesondere dann interessant, wenn man Freunden oder Bekannten anstatt einem extrem langen Link, diesen einfach einen Kurzen übermitteln kann. Auch viele soziale Medien beispielsweise limitieren die Anzahl an Zeichen pro Nachricht, und hier erfreuen sich dann solche Kurz-URL-Dienste ebenfalls großer Bedeutung, da sich so gewisse Limits “umgehen” lassen. Der derzeit weltweit am häufigsten genutzte Kurz-URL-Dienst ist  der von den USA aus betriebene Service Bit.ly.

Im Folgenden werde ich euch zeigen, wie einfach ihr euch selbst einen solchen Service basierend auf dem CodeIgniter-Framework bauen könnt:

 

Wie funktioniert ein Kurz-URL-Dienst in der Praxis?

So ziemlich alle Kurz-URL-Anbieter haben deren Service in etwa nach dem gleichen Prinzip aufgebaut:

Auf der Homepage des Anbieters kann man in der Regel in ein Textfeld seine Original-URL angeben, aus welcher dann eine individuelle Kurz-URL generiert wird. Versucht jemand dann diese Kurz-URL zu besuchen, wird man direkt an die jeweilige Ziel-Adresse weitergeleitet, also an jene, welche bei der Generierung dieser URL angegeben wurde. Viele Anbieter stellen zusätzlich auch noch Statistiken über Zugriffe (etc.) zur Verfügung.

 

Das CodeIgniter-Setup

Im folgenden Teil werde ich nun zeigen, wie das Setup mit Codeigniter funktioniert.

CodeIgniter Logo

 

Grundstruktur vorbereiten

Damit wir mit unserem Kurz-URL-Dienst starten können, brauchen wir erstmal eine Basis, auf der wir aufbauen können. Dazu laden wir uns von der CodeIgniter-Homepage mal die aktuellste Version des Frameworks herunter. Dies ist in diesem Fall Version 3.1.5.

Nun kopieren wir alle Dateien am besten in einen Unterordner „ci-urlshortener“ auf den Webserver (z.B. XAMPP, LAMP, etc.) und rufen dessen Rootverzeichnis im Browser auf, z.B. http://localhost/ci-urlshortener/.

Wenn alle Anforderungen des Frameworks erfüllt sind, sollte hier nun die Willkommensseite von CodeIgniter sichtbar sein.

Damit die Speaking-URLs auch korrekt aufgerufen werden können, legen wir uns eine .htaccess mit folgendem Inhalt an:

Bei Bedarf kann hier auch eine optionale Umgebungsvariable zur Unterscheidung von Entwicklungssytem (“development“), Testsystem (“testing“) oder Produktivsystem (“production“) angegeben werden.
Dies würde dann so aussehen:

 

In der Autoloader-Konfiguration unter /application/config/autoload.php fügen wir als nächstes den URL- und den Form-Helper sowie die Datenbank-Library hinzu. Wir werden diese Komponenten später brauchen.

 

In der Routenkonfiguration unter /application/config/routes.php ändern wir als nächstes den Standard-Controller von „welcome“ auf „home“, da wir später möchten, dass standardmäßig unsere URL-Shortener-Applikation aufgerufen wird.

Zusätzlich definieren wir hier noch zwei weitere Routen: eine für die Redirects (als Catch-All) und eine für die Statistiken.

Die Redirect-Route (Catch-All) ist bewusst als Letztes definiert, da diese sonst alle anderen Routen abfangen würde und so das Routing nicht ordnungsgemäß funktionieren würde.

 

Index-Seite erstellen, und URLs speichern

Nachdem wir in der Routen-Konfiguration nun auf einen “Home”-Controller verweisen, sollten wir uns diesen auch anlegen. Dazu erstellen wir unter /application/controller eine Home.php (Groß-/Kleinschreibung beachten!).
In dieser legen wir als Nächstes das Grundgerüst an – das wären 3 Actions: eine für die Index-Seite, eine für die eigentliche Weiterleitung (“Redirect”) und eine für die Statistiken.

Im Constructor oben werden wir später unsere Models laden, sodass wir dies nicht in jeder einzelnen Action separat machen müssen.

Nun haben wir unseren Controller, sowie die notwendigen Actions erstmal definiert. Jetzt legen wir unsere Datenbank-Tabellen wie folgt an:

Wir erhalten dadurch eine Tabelle für die Weiterleitungen (Speicherung von URL mit zugehörigem Alias), sowie eine für Statistiken (Protokollierung von jedem einzelnen Zugriff für eine bestimmte URL).

Legen wir uns nun ein Model für die URL-Tabelle an. Dazu erstellen wir unter /application/models eine neue Datei Url_model.php.

Wir brauchen hier folgende Funktionen: Hinzufügen einer neuen URL (via add_url()) und Auslesen einer URL mittels ID (via get_url_by_id()) bzw. via Alias (via get_url()).

Die beide Funktionen get_url_by_id() sowie get_url() sind soweit identisch, jedoch mit dem Unterschied, dass wir auf unterschiedliche Datenbank-Felder abfragen.

Nachdem wir nun unser primäres Model für die URLs haben, laden wir dieses wie folgt im Constructor unseres Home-Controllers:

Nun können wir auch den nächsten Schritt in Angriff nehmen: Wir erstellen uns unsere Index-Seite.

Dazu definieren wir uns ein Daten-Array mit ein paar Standard-Werten, und definieren eine Logik, was passieren soll, wenn ein POST-Request kommt – in unserem Fall soll hier eine neue URL mit Alias angelegt werden:

In diesem Beispiel-Code findet eine zusätzliche Validierung seitens PHP statt, welche überprüft, ob die vom Benutzer übermittelte URL auch tatsächlich eine gültige URL darstellt.

Wäre dies nicht der Fall, könnte es zu unerwarteten Nebeneffekten bei der eigentlichen Weiterleitung kommen.

Sobald die neue URL in der Datenbank gespeichert wurde, holen wir uns von dort diesen Datensatz und übergeben ihn mit an unsere View – wir wollen dem Benutzer ja auch zeigen, wie sein Alias für die von ihm übermittelte URL aussieht.

Um das machen zu können, fehlt uns nun allerdings noch die zugehörige Home-View (basierend auf dem Bootstrap-Framework) als /application/views/home.php:

Beim verlinkten bootstrap_flatly.min.css handelt es sich um das kostenlose Bootstrap-Theme “Flatly” von Bootswatch.
Dieses CSS-Theme ist optional und kann daher also gerne auch weggelassen werden.

In der style.css definieren wir uns lediglich ein paar Basis-Styles:

Die Home-View selbst stellt lediglich ein Formular zum Absenden einer beliebigen URL sowie unterhalb eine Bereich zum Anzeigen des generierten Alias an.

Nun können wir zum ersten Mal unsere Anwendung testen, indem wir eine beliebige URL ins Formular eingeben, und dieses dann absenden.
In der Datenbank sollten wir nun diese inkl. einem Alias vorfinden, welcher uns auf der Index-Seite unterhalb des Formulars angezeigt werden sollte.

 

Weiterleitung konfigurieren

Da wir anstatt einfach nur auf die Ziel-URL weiterzuleiten, die Anfragen an unser System auch auswerten möchten, legen wir uns nun ein Model für die Statistik-Tabelle an. Dazu erstellen wir unter /application/models eine neue Datei Statistics_model.php mit folgendem Inhalt:

Die Funktion hier beschränkt sich auf das Anlegen eines neuen Eintrags (via add_log()) für eine bestimmte URL, sowie dem Auslesen aller Einträge zu einer URL (via get_logs()).

Bei Letzterem wird nach Datum gruppiert, und zusätzlich die Gesamtzahl der Zugriffe pro Tag als sum zurückgegeben.

Dieses Model laden wir anschließend gleich wie das URL-Model im Constructor des Home-Controllers:

 

Nachdem wir vorhin bereits eine leere “redirect“-Action definiert haben, wird es Zeit, dieser auch eine Funktion zu geben.

Der als $alias übergebene Parameter ist jener, welcher zuvor bei der Speicherung der URL generiert wurde.

Mit dessen Hilfe suchen wir nun mittels der zuvor erstellten get_url()-Funktion in der Datenbank nach dem gewünschten Eintrag.

Wenn der entsprechende Datenbank-Eintrag gefunden wurde, können wir die eigentliche Weiterleitung mittels des Location-Headers durchführen.

(Die “302” am Ende gibt den HTTP-Status-Code an, welcher mitgesendet werden soll. In der Regel wäre dies allerdings eine “301” (auf Produktiv-System aus SEO-Sicht zu bevorzugen) – nachdem aber eine Weiterleitung mit einem 301-Header von den Browser gecacht wird, wäre es zum Testen äußert unpraktisch – daher in diesem Fall “302”.)

Vor diesem Redirect erfassen wir aber noch den Zugriff auf die URL über unser Statistics-Model und speichern diesen.

Wichtig ist, dass nach dem Location-Header (oder generell nach einer Header-Ausgabe) keine weitere Ausgabe erfolgt – daher vorsichtshalber noch ein exit() danach.

 

Für den Fall, dass wir zu einem Alias keinen Datenbank-Eintrag finden können, verweisen wir einfach auf eine “Not found”-View:

Diese View wird als /application/views/not_found.php gespeichert. Sie kann individuell gestaltet werden. In unserem Fall hat sie keine besondere Funktion.

Ab nun kann die beim letzten Test zuvor generierte Kurz-URL getestet werden – wenn wir alles richtig gemacht haben, wird man nun auf die Ziel-URL weitergeleitet und ein Log-Eintrag über den Zugriff in der Statistik-Tabelle gespeichert.

 

Statistiken anzeigen

Die “stats“-Action wird auf den ersten Blick der “redirect“-Action ähneln. Das liegt daran liegt, dass auch die Funktion ziemlich gleich ist: bei beiden wird anhand eines übergebenen Alias eine Suche in der Datenbank durchgeführt.

Bei der “redirect“-Action erfolgt eine Weiterleitung, und bei der “stats“-Action fragen wir anhand dieser Daten alle vorhanden Log-Einträge zu dieser URL ab.

Auch hier kommt für den Fall, dass es keinen Datenbank-Eintrag für einen bestimmten Alias gibt, unsere “Not found”-View von oben zum Einsatz.

Die zugehörige View (/application/views/stats.php) würde dann folgendermaßen aussehen:

Wir iterieren in einer foreach-Schleife über alle vorhanden Log-Einträge drüber und zeigen diese in Form einer Tabelle an.

Wer möchte, kann diese Daten auch gerne in Form eines Diagramms anzeigen. Im Internet finden sich hierfür jedenfalls zahlreiche jQuery-Plugins.

Für den Fall, dass es keine Log-Einträge gibt (wenn z.B. die Kurz-URL noch nie aufgerufen wurde), folgt ein entsprechender Hinweis-Text.

 

Fazit

Kurz-URL-Dienste sind vom Aufbau her trivial. Ihr Einsatz ist allerdings nicht immer so einfach: Sie können leicht missbraucht werden, da für den End-Nutzer nicht ersichtlich ist, wohin er weitergeleitet werden wird.

Zwar haben die großen Anbieter teilweise bereits ziemlich gute Malware- und Phishing-Schutzfunktionen implementiert, aber dennoch bleibt die Sicherheit trotz des relativ hohen Sicherheitslevels umstritten.

Die mögliche Tracking-Option (in diesem Tutorial auf das Logging von Zugriffen beschränkt) kann auch beliebig erweitert werden – z.B. um die Erfassung der IP des Benutzers (sofern möglich, wäre es aus Datenschutzgründen empfehlenswert die letzten Teile der IP nicht bzw. nur anonymisiert zu speichern), und daraus resultierend dessen Land (via GeoIP) oder auch eventuelle Referrers, etc.

Die Auswertung solcher Daten ist gerade im Marketing-Bereich wichtig, da man auf diese Art Werbekampagnen (etc.) gezielter und auch kosteneffizienter schalten kann.

Aus diesem Grund sind solche Kurz-URL-Dienste besonders für Unternehmen interessant. Solche Short-URLs werden beispielsweise in Newslettern verwendet, um so herauszufinden, wie oft ein Link angeklickt wurde. 😉


facebooktwittergoogle_pluslinkedinmail