Subdomains im Basecamp-Stil mit CodeIgniter

German (Deutsch) translation by Nikol Angelowa (you can also view the original English article)

CodeIgniter ist ein einfaches und leichtes PHP-Framework, mit dem leistungsstarke Webanwendungen erstellt werden. Heute werden wir etwas Feines tun: Wir werden Benutzernamen und Subdomains kombinieren, um eine kohärentere Benutzererfahrung zu erzielen.

Wenn Sie etwas verwirrt sind, können Ihre Benutzer mit dieser Funktion auf ihre Konten zugreifen, indem Sie eine benutzerdefinierte URL eingeben, die ihrem Benutzernamen zugeordnet ist, z. B. harbinger.yourapp.com.

Überblick

In diesem Tutorial erstellen wir sowohl eine Front-End-Ansicht als auch eine Back-End-Anwendungsansicht, ähnlich der in Basecamp verwendeten Konfiguration, bei der beim Besuch von basecamphq.com die Startseite angezeigt wird, beim Besuch einer Subdomain jedoch die Anmeldeseite angezeigt wird.

Wir werden die fiktive Adresse nettutsapp.com verwenden und eine Beispielseite für das "Dashboard" erstellen. Sie können dies jedoch relativ einfach in ein vorhandenes Projekt integrieren.

Bevor Sie beginnen, stellen Sie sicher, dass Sie einen Webserver mit PHP installiert haben. Sie müssen auch CodeIgniter herunterladen. Im Beispiel verwende ich CodeIgniter 2.0, aber der Code sollte unter 1.7.2 funktionieren. Also lasst uns anfangen!

Schritt 1: DNS-Konfiguration

Zuerst müssen wir unsere DNS-Einstellungen konfigurieren, damit alle Subdomains in eine einzige Adresse aufgelöst werden. Wenn Sie auf einem Live-Server arbeiten, müssen Sie Ihre DNS-Einstellungen bei der Firma ändern, die Ihr DNS verwaltet. Dies ist am häufigsten Ihr Webhost oder Domain-Registrar.

Es würde zu viel Zeit in Anspruch nehmen, jede Konfiguration in diesem Tutorial zu behandeln. Bitten Sie stattdessen Ihren Host um Hilfe beim Einrichten von Platzhalter-Subdomänen. Sie können erwarten, dass Sie Ihrer DNS-Konfiguration so etwas wie die folgende Zeile hinzufügen.

1	*.nettutsappapp.com. IN A 91.32.913.343

Wenn Sie stattdessen auf einem lokalen Server arbeiten, ist das Hinzufügen einer Platzhalter-Subdomäne zur Hosts-Datei ziemlich schwierig. Ich bevorzuge es, einzelne Einträge zu Testzwecken hinzuzufügen. Diese können nach Abschluss gelöscht werden. Für unsere Domain müssen wir vier Einträge wie folgt hinzufügen:

127.0.0.1 nettutsapp.com
127.0.0.1 user1.nettutsapp.com
127.0.0.1 user2.nettutsapp.com
127.0.0.1 user3.nettutsapp.com

Konfiguration der Mac-Hosts

Öffnen Sie dazu auf einem Mac das Terminal und geben Sie sudo nano/etc/hosts ein. Verwenden Sie die Pfeiltasten, um zum Ende des Dokuments zu gelangen, und fügen Sie die Einträge am Ende der Datei hinzu. Drücken Sie anschließend Strg + X und Y, um das Speichern zu bestätigen.

Konfiguration der Windows-Hosts

Wenn Sie Windows verwenden, navigieren Sie zum Verzeichnis C:\Program Files\system32\drivers\etc und öffnen Sie die Hosts-Datei im Editor oder in Ihrem bevorzugten Texteditor. Fügen Sie vier oben gezeigte Einträge hinzu und speichern Sie die Datei.

Wenn Sie DNS-Änderungen an einem Live-Server vorgenommen haben, dauert es eine Weile, bis Sie einen Effekt bemerken. Wenn Sie Änderungen an Ihrer Hosts-Datei vorgenommen haben, werden die Änderungen sofort wirksam.

Schritt 2: Apache-Konfiguration

Ziel ist es, zwei virtuelle Hosts in der Apache-Konfiguration einzurichten: Einer dient der Front-End-Seite (Basecamp-Homepage) und der andere der Seite, die beim Zugriff über eine Subdomain (Dashboard-Seite) angezeigt wird.

Um neue Einträge hinzuzufügen, müssen Sie die Datei httpd.conf öffnen, die sich im Apache-Installationsverzeichnis befindet. Es befindet sich häufig im Ordner bin/apache/conf. Abhängig von Ihrer Serverkonfiguration kann der Speicherort jedoch variieren.

Nach dem Öffnen müssen Sie die beiden unten gezeigten Einträge hinzufügen. Stellen Sie sicher, dass Sie DocumentRoot an einem von Ihnen erstellten Speicherort Ihrer Wahl ändern.

Hinweis: Merken Sie sich den Platzhalter und den anderen Verzeichnispfad auf dem zweiten VirtualHost.

WAMP-Benutzer: Ich empfehle, diesen Beitrag zu lesen, in dem beschrieben wird, wie VirtualHosts eingerichtet werden. Möglicherweise treten auch Berechtigungsprobleme auf. Daher empfehle ich, Ihre VirtualHost-Verzeichnisse im www-Verzeichnis abzulegen.

	<VirtualHost *:80>
		DocumentRoot "/Users/densepixel/Sites/MAMP PRO/nettutsappfront"
		ServerName nettutsapp.com
		ServerAlias nettutsapp.com
	
		<Directory "/Users/densepixel/Sites/MAMP PRO/nettutsappfront">
			Options -Indexes 
			Options FollowSymLinks
			AllowOverride All
		</Directory>
	</VirtualHost>
	
	<VirtualHost *:80>
		DocumentRoot "/Users/densepixel/Sites/MAMP PRO/nettutsapp"
		ServerName nettutsapp.com
		ServerAlias *.nettutsapp.com
	
		<Directory "/Users/densepixel/Sites/MAMP PRO/nettutsapp">
			Options -Indexes 
			Options FollowSymLinks
			AllowOverride All
		</Directory>
	</VirtualHost>

Nachdem Sie die Datei gespeichert haben, müssen Sie Apache neu starten, damit die Änderungen wirksam werden.

Stellen Sie sicher, dass Sie die Verzeichnisse erstellt haben, die Sie in der Datei httpd.conf angegeben haben, bevor Sie den Server starten.

Schritt 4: Testen unserer Serverkonfiguration

Bevor wir die Konfiguration testen, platzieren Sie eine einfache html-Seite in jedem der zuvor erstellten Verzeichnisse. Fügen Sie möglicherweise jeweils eine einzelne Textzeile hinzu, damit Sie sie unterscheiden können. Ich habe ein Beispiel für Sie kopiert.

<!DOCTYPE html>
<html lang="">
<head>  
	<meta charset="utf-8">
	<title>NetTuts App Front</title>
</head>
<body>
	NetTutsApp Front
</body>
</html>

Öffnen Sie dann Ihren bevorzugten Browser und überprüfen Sie zunächst die Adresse nettutsapp.com. Wenn alles funktioniert, sollten Sie sich die Seite ansehen, die Sie im Verzeichnis 'nettutsappfront' abgelegt haben.

Überprüfen Sie dann eine Subdomain, z. B. user1.nettutsapp.com; Dies sollte Ihnen die andere Seite anzeigen, die Sie im Verzeichnis erstellt haben.

Sie können die anderen Subdomains überprüfen, die Sie in der Hosts-Datei angegeben haben. Alle sollten die in unserem Verzeichnis gespeicherte Seite anzeigen.

Schritt 5: CodeIgniter-Installation

In diesem Tutorial wird davon ausgegangen, dass Sie wissen, wie CodeIgniter installiert wird. Wenn nicht, sollten Sie sich dieses Video-Tutorial von Jeffrey Way ansehen, in dem der Vorgang ausführlich erläutert wird.

Platzieren Sie die CodeIgniter-Dateien in unserem Verzeichnis, nachdem Sie die zuvor erstellte html-Seite gelöscht haben. Wenn Sie CodeIgniter 1.7.2 verwenden, möchten Sie möglicherweise den application ordner aus dem system ordner entfernen.

Testen Sie die Installation, indem Sie zur URL user1.nettutsapp.com navigieren. Die CodeIgniter-Begrüßungsseite sollte angezeigt werden.

Schritt 6: Einrichten von CodeIgniter

Richten Sie CodeIgniter wie gewohnt ein, wie in diesem Tutorial beschrieben. Möglicherweise möchten Sie die Datei index.php aus der URL entfernen, einige Bibliotheken oder Helfer automatisch laden usw. Für die Zwecke dieses Tutorials müssen wir die database bibliothek und den url-Helfer automatisch laden. Öffnen Sie die Datei autoload.php im config verzeichnis und fügen Sie die entsprechenden Einträge hinzu.

Wir müssen auch den Standard-Controller in einen von uns erstellten Controller namens dashboard ändern. Dieser Wert kann in der Datei /config/routes.php geändert werden.

Base_url

Für die Benutzer-Subdomänen müssen wir die Variable base_url dynamisieren, da die Anwendung Anforderungen von einer Reihe potenzieller Subdomänen empfängt.

Der einfachste Weg, dies zu tun, ist die Verwendung der Variablen HTTP_HOST. Öffnen Sie die Datei config.php, suchen Sie die Variable $config['base_url'] und ersetzen Sie sie durch den folgenden Code:

1	if(isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] == "on"){$ssl_set = "s";} else{$ssl_set = "";}
2	$config['base_url'] = 'http'.$ssl_set.'://'.$_SERVER['HTTP_HOST'];

Dieser Code ermöglicht HTTPS-Verbindungen. Wenn Sie jedoch nie vorhaben, HTTPS zu verwenden, können Sie ihn zu base_url = $_SERVER['HTTP_HOST'] vereinfachen.

Datenbankeinstellungen

Bevor wir die Datenbankeinstellungen zu unserer CodeIgniter-Anwendung hinzufügen, müssen wir sowohl die Datenbank als auch eine Beispieltabelle erstellen.

Diese Beispielanwendung verwendet eine Datenbank und eine Tabelle. Diese Tabelle enthält alle aktuell zugewiesenen Subdomains sowie einige grundlegende Informationen dazu. Wenn Sie diesen Code in Ihrer eigenen Anwendung verwenden möchten, müssen Sie im Allgemeinen mehrere Benutzer einer einzelnen Subdomain zuweisen. Dieses Datenbankschema geht jedoch über den Rahmen dieses Lernprogramms hinaus.

Die Tabelle heißt nt_subdomains in der Datenbank ntapp und enthält vier Felder:

subdomain_id(primary, auto_increment)
subdomain_name
user_fname
user_sname

Ich habe die Tabelle auch mit zwei Datensätzen gefüllt, die mit den Subdomains übereinstimmen, die wir unserer Hosts-Datei hinzugefügt haben:

Jetzt können wir die Datenbankkonfiguration öffnen, die sich in /application/config/database.php befindet, und die folgenden Werte so bearbeiten, dass sie Ihren persönlichen Konfigurationseinstellungen entsprechen.

1	$db['default']['hostname'] = 'localhost';
2	$db['default']['username'] = 'root'; //MAMP default
3	$db['default']['password'] = 'root'; //MAMP default
4	$db['default']['database'] = 'ntapp';

Und wir sind mit der Einrichtung unserer CodeIgniter-Installation fertig. Beginnen wir mit der Verwendung der Subdomains in unserer Anwendung.

Schritt 7: Erstellen unserer Controller und Ansichten

Für diese Anwendung werden wir zwei Controller erstellen. Der erste ist ein error controller, der einen Fehler anzeigt, wenn die Subdomain nicht für die Verwendung in der Anwendung registriert wurde. Der andere Controller ist unser Haupt-Dashboard-Controller. Dies sieht der Benutzer, wenn die Subdomain zu unserer Datenbank hinzugefügt wurde.

Fehlerkontrolle

Lassen Sie uns fortfahren und unseren Fehlercontroller erstellen. Erstellen Sie zunächst eine neue Datei im Verzeichnis /application/controller und nennen Sie sie error.php. Hinweis: Der Name der Datei ist wichtig

<?php

class Error extends Controller {

	function Error()
	{
		parent::Controller();
	}

	function index()
	{
		$this->load->view('error');
	}
}

Fügen Sie den obigen Code zu unserer neuen Datei error.php hinzu. Die index funktion lädt eine Ansicht namens 'error', die wir später erstellen werden.

Dashboard-Controller

Jetzt müssen wir den Haupt-Dashboard-Controller erstellen, der geladen wird, wenn ein Benutzer eine der Subdomains betritt. Der Controller prüft dann, ob die Subdomain registriert wurde, und leitet sie bei Bedarf um. Wir werden diesen Code später hinzufügen, aber zuerst müssen wir den Basis-Controller erstellen.

Erstellen Sie eine neue Datei im controllers Verzeichnis und nennen Sie sie dashboard.php. In dieser Datei müssen wir den Controller erstellen und die Dashboard-Ansicht laden. Kopieren Sie den folgenden Code und speichern Sie die Datei.

<?php

class Dashboard extends Controller {

	function Dashboard()
	{
		parent::Controller();
	}

	function index()
	{
		$this->load->view('dashboard');
	}
}

Fehleransicht

Die Fehlerseite wird angezeigt, wenn ein Benutzer versucht, auf eine Subdomain zuzugreifen, die nicht für die Verwendung durch die Anwendung registriert wurde. Erstellen Sie für die Zwecke des Lernprogramms einfach eine Basisseite mit der Meldung Subdomain Not Registered. Fügen Sie den folgenden Code zu einer neuen Datei mit dem Namen error.php hinzu und speichern Sie ihn im Ordner application/views.

<html>
<head>
	<title>Application Error : Nettuts App</title>
</head>
<body>

	<h1>Nettuts Application Error</h1>

	<p>Subdomain Not Registered</p>

</body>
</html>

Dashboard-Ansicht

Derzeit werden wir nur eine grundlegende Dashboard-Seite erstellen. Sie können dieselbe Struktur wie die Fehleransicht verwenden und sie einfach so ändern, dass Nettuts Dashboard oder ähnliches gelesen wird. Speichern Sie die Seite als dashboard.php im Ordner application/views.

Testen Sie die beiden Ansichten, indem Sie die URLs besuchen:

user1.nettutsapp.com/index.php/error
user1.nettutsapp.com/index.php/dashboard

Arbeiten? Lassen Sie uns weitermachen.

Schritt 8: Erweitern unseres Dashboard-Controllers (Teil 1)

Der nächste Schritt besteht darin, den Namen der Subdomain in unserem Controller zu extrahieren, damit wir ihn in einer Datenbankabfrage verwenden können.

Wir werden unseren Subdomain-Überprüfungscode in die construct funktion innerhalb des Dashboard-Controllers einfügen. (Unter dem parent::Controller()). Dies bedeutet, dass die Subdomain überprüft wird, wenn auf eine der Funktionen im Dashboard-Controller zugegriffen wird.

Der einfachste Weg, den Namen der Subdomain zu extrahieren, besteht darin, die PHP explode funktion zu verwenden und das Trennzeichen auf '.' Zu setzen. Da wir nur den ersten Teil benötigen, können wir ihn in zwei Teile aufteilen und dann den ersten Teil (den Namen der Unterdomäne) einer Variablen zuweisen.

Um einen Test zu machen, können echo die Variable im Controller selbst wiedergeben. Siehe den folgenden Code:

<?php

class Dashboard extends Controller {

	function Dashboard()
	{
		parent::Controller();
		
		$subdomain_arr = explode('.', $_SERVER['HTTP_HOST'], 2); //creates the various parts
		$subdomain_name = $subdomain_arr[0]; //assigns the first part
		echo $subdomain_name; // for testing only
	}


}

Greifen Sie auf Ihre Subdomain-URLs zu, und Sie sollten die richtige Subdomain wie unten auf Ihrer Seite wiedergeben.Hinweis: Sie können die Echoanweisung jetzt löschen.

Nachdem wir nun Zugriff auf den Namen der Subdomain in unserem Controller haben, können wir überprüfen, ob die zuvor erstellte Tabelle hinzugefügt wurde.

Wir werden die ActiveRecord-Klasse von CodeIgniter verwenden, um unsere Abfragen zu erstellen, die die Tabelle auf die Subdomäne überprüfen, auf die zugegriffen wird. Wenn es vorhanden ist, kann der Benutzer auf die Dashboard-Seite zugreifen. Wenn andererseits die Subdomain nicht eingegeben wurde, wird ihnen der Zugriff verweigert und sie werden auf die zuvor erstellte Fehlerseite umgeleitet.

In diesem Tutorial werden keine Modelle verwendet, da das Tutorial dadurch viel einfacher zu befolgen ist. CodeIgniter ist sehr flexibel, da es Sie nicht zwingt, sie zu verwenden.

Zuerst müssen wir die Abfrage wie unten gezeigt zusammenstellen. Dieser Code funktioniert nur in PHP5, da er die Methodenverkettung verwendet. Sie können es jedoch nach Ihren Wünschen ändern.

1	// adds on from rest of construct //
2	$this->db->from('nt_subdomains')->where('subdomain_name', $subdomain_name);
3	$query = $this->db->get();

Mit der CodeIgniter-Funktion row() können wir überprüfen, ob diese Subdomain in der Tabelle vorhanden ist. Wenn dies nicht der Fall ist, müssen wir die Umleitungsfunktion verwenden, um unsere Benutzer zum Fehlercontroller umzuleiten. Der nächste Teil des Codes ist unten:

// adds on from previous code //
if($query->num_rows() < 1)
		{
		redirect ('error');
		}

Testen Sie dies, indem Sie auf user1.nettutsapp.com zugreifen, das Sie zur Dashboard-Seite weiterleiten soll. Versuchen Sie nun user3.nettutsapp.com, das Sie zur Fehlerseite weiterleiten sollte, da diese nicht in die Tabelle eingegeben wurde.

Schritt 9: Erweitern unseres Dashboard-Controllers (Teil 2)

Jetzt können wir die Informationen in der Tabelle verwenden, um spezifische Informationen für jede Subdomain anzuzeigen.

Wir werden die index funktion in unserem Dashboard-Controller erweitern. Kopieren Sie zuerst den Subdomain-Namenscode und die zuvor verwendete Datenbankabfrage.

function index()
	{
		$subdomain_arr = explode('.', $_SERVER['HTTP_HOST'], 2);
		$subdomain_name = $subdomain_arr[0];
		
		$this->db->from('nt_subdomains')->where('subdomain_name', $subdomain_name);
		$query = $this->db->get();
		
	}

Wir verwenden die row() -Funktion von CodeIgniter, um das Ergebnis der Abfrage abzurufen. Die row funktion gibt eine einzelne Ergebniszeile zurück, was bedeutet, dass wir keine foreach-Schleife verwenden müssen. es ist unnötig.

1	// adds on from rest of index function //
2	$subdomain_info = $query->row();

Weisen Sie dann dem array, $data die Spaltenwerte user_fname und user_sname zu, die dann an die view übergeben werden.

1	$data['fname'] = $subdomain_info->user_fname;
2	$data['sname'] = $subdomain_info->user_sname;
3	$this->load->view('dashboard', $data);

Wir können diese Werte in unserer Ansicht verwenden, indem wir die Variablen $fname und $sname verwenden. Öffnen Sie die Dashboard-Ansicht und bearbeiten Sie sie wie folgt:

1	<p>Welcome to your dashboard
2	<b><?php echo $fname; ?> <?php echo $sname ?></b>
3	</p>

Und wir sind fertig! Lassen Sie uns es testen.

Schritt 10: Testen

Probieren Sie alle URLs aus, und wenn hoffentlich alles nach Plan lief, sollten die Ergebnisse wie folgt aussehen:

nettutsapp.com → Frontend-Seite
user1.nettutsapp.com → Dashboard (John Doe)
user2.nettutsapp.com → Dashboard (Steve Smith)
user3.nettutsapp.com → Fehlerseite

Controller und Code anzeigen

Hier ist die vollständige Cote, die für unsere Controller und Ansichten verwendet wird:

Dashboard-Controller

<?php

class Dashboard extends Controller {

	function Dashboard()
	{
		parent::Controller();
		
		$subdomain_arr = explode('.', $_SERVER['HTTP_HOST'], 2);
		$subdomain_name = $subdomain_arr[0];
		
		
		$this->db->from('nt_subdomains')->where('subdomain_name', $subdomain_name);
		$query = $this->db->get();
		
		if($query->num_rows() < 1)
		{
		redirect ('error');
		}

	}

	function index()
	{
		$subdomain_arr = explode('.', $_SERVER['HTTP_HOST'], 2);
		$subdomain_name = $subdomain_arr[0];
		
		$this->db->from('nt_subdomains')->where('subdomain_name', $subdomain_name);
		$query = $this->db->get();
		
		$subdomain_info = $query->row();
		$data['fname'] = $subdomain_info->user_fname;
		$data['sname'] = $subdomain_info->user_sname;
		$this->load->view('dashboard', $data);
	}
}

Fehlerkontrolle

<?php

class Error extends Controller {

	function Error()
	{
		parent::Controller();
	}

	function index()
	{
		$this->load->view('error');
	}
}

Dashboard-Ansicht

<html>
<head>
	<title>Dashboard : Nettuts App</title>
</head>
<body>

	<h1>Nettuts Dashboard</h1>

	<p>Welcome to your dashboard 
	<b><?php echo $fname; ?> <?php echo $sname ?></b>
	</p>
	
</body>
</html>

Fehleransicht

<html>
<head>
	<title>Application Error : Nettuts App</title>
</head>
<body>

	<h1>Application Error</h1>

	<p>Subdomain Not Registered</p>

</body>
</html>

Abschluss

Natürlich beschreibt dieses Tutorial nur einen Weg, um diese raffinierte Funktionalität zu erhalten. Ich bin sicher, es gibt noch viel mehr. Fühlen Sie sich also frei, Ihre Gedanken und Meinungen im Kommentarbereich unten mitzuteilen.