Dass sich mit Macromedias Middleware ColdFusion und einer beliebigen ODBC-kompatiblen Datenbank schnell und komfortabel ansprechende Anwendungen entwickeln lassen, haben wir bereits in einem früheren InfoWeek-Workshop gezeigt (IW 21/2001). Leser, die diesen Artikel verpasst haben, können den Text genauso wie auch den betreffenden Quellcode von der InfoWeek-Site beziehen.
In der vorliegenden Ausgabe gehen wir einen Schritt weiter und zeigen, wie sich auch eine Warenkorb-Anwendung für einen E-Shop ohne grosse Schwierigkeiten generieren lässt. Wieder arbeiten wir mit dem ColdFusion Express Server sowie einer Access-Datenbank, die über das ODBC-Interface zugänglich gemacht wird.
Was die grundlegenden Installations- und Konfigurationsarbeiten betrifft, verweisen wir auf das in der InfoWeek-Ausgabe 21/2001 geschilderte Prozedere.
Im vorliegenden Workshop erläutern wir lediglich die Kernfunktionen des Codes und verzichten auf das komplette Listing. Der Quelltext mitsamt der dazugehörenden Access-Datenbank kann wiederum von der InfoWeek-Site bezogen werden.
Es empfiehlt sich grundsätzlich, zuerst die ColdFusion-Dateien für diesen Workshop herunterzuladen und zu installieren, womit die folgenden Ausführungen besser nachvollzogen werden können.
Wenn der Online-Kunde die Webseite aufruft, wird ihm zuerst ein Link zur Verfügung gestellt, der in den eigentlichen Shop verweist. Dieser präsentiert sich zuerst als Drop-Down-Liste, welche die angebotenen Produktkategorien und Subkategorien auflistet. Bei einem Bekleidungsgeschäft wären dies beispielsweise "Herrenmode" und "Herrenhemden". Im vorliegenden Workshop gehen wir von einem fiktiven Comic-Antiquariat aus.
Wird eine Kategorie, in unserem Beispiel "Verlag" und "Verlagsreihe", ausgewählt, werden alle Produkte aufgelistet, die darauf zutreffen.
Klickt der Kunde auf das bei jedem Produkt verfügbare Einkaufswagen-Icon, wird der Artikel in den Warenkorb gelegt, und die Preisangabe wechselt in der Farbe von Schwarz auf Rot, damit der User weiss, welche Artikel er bereits angeklickt hat.
In der unteren Hälfte des Browser-Fensters wird wiederum die Drop-Down-Liste eingeblendet, womit der Kunde weitere Kategorien anwählen kann. Dazu findet sich ein Link zum Warenkorb, wo einzelne Einträge einerseits wieder gelöscht, andererseits aber auch die gewünschte Anzahl geändert werden kann. Letztere Funktion macht zwar bei einem Comic-Antiquariat wenig Sinn, dürfte sich aber bei einem Shop mit Neuwaren als unerlässlich erweisen.
Ist der Site-Besucher mit den im Warenkorb aufgelisteten Artikeln einverstanden, muss er sich registrieren, wobei die Passwort-Kontrolle, die wir im oben angesprochenen Workshop vorgestellt haben, zum Zug kommt. Hat sich der Kunde bereits bei einem früheren Einkauf registriert, genügt die Eingabe von User-Kennung und Passwort.
Last but not least werden auf der letzten Seite des Shopping-Durchgangs alle bestellten Produkte mitsamt den Adressdaten des Bestellers aufgelistet, und der Kunde hat die Möglichkeit, den Bezahl-Modus zu bestimmen, wobei die Optionen "Rechnung", "Vorauskasse" oder "Nachnahme" zur Verfügung gestellt werden.
Bestätigt der Online-User an dieser Stelle definitiv die Bestellung, werden alle eingetragenen Produkte und die Adressdaten in der Datenbank gespeichert, womit sich von hier aus bequem über einen entsprechenden Report auch gleich eine Rechnung ausdrucken lässt.
Was die Installation von ColdFusion Express Server, des Webservers wie auch die Anbindung der Datenbank an den ODBC-Treiber betrifft, verweisen wir auf den oben genannten früheren Workshop.
Unserer E-Shop-Lösung liegt einmal mehr eine Access-Datenbank zugrunde. Diese besteht insgesamt aus den vier Tabellen "Adressen", "Produkte", "Positionen" und "Debitoren". Nachfolgend die Stuktur der Datenbank:
Tabelle Adressen
Adressnummer = Zahl
Anrede = Text
Vorname = Text
Nachname = Text
Strasse = Text
PLZ = Zahl
Ort = Text
EMail = Text
Benutzer = Text
Passwort = Text
Tabelle Produkte
Produktnummer = Autowert
Kategorie1 = Text
Kategorie2 = Text
Produktname = Text
Preis = Währung
Tabelle Positionen
Adressnummer = Zahl
Artikelnummer = Zahl
Preis = Währung
Debitornummer = Zahl
Anzahl = Zahl
Tabelle Debitoren
Debitornummer = Zahl
Adressnummer = Zahl
Total = Währung
Debitordatum = Datum
Buchungsdatum = Datum
Nachdem die Datenbankstruktur in der geschilderten Form generiert wurde, wird das .mdb-File an den ODBC-Treiber angebunden und unter der Bezeichnung "easyshop" im ODBC-Applet registriert.
Wie oben erwähnt, wird es dem Website-Besucher zuerst ermöglicht, über eine Drop-Down-Liste die einzelnen Produktkategorien anzeigen zu lassen.
Dies wird über eine gruppierte Abfrage bewerkstelligt, die sich mit der ColdFusion-typischen SQL-Syntax bzw. der GROUP-BY-Anweisung recht einfach programmieren lässt. Vergleicht man die Syntax mit einer entsprechenden Abfrage in Access ,stellt man fest, dass die Struktur weitgehend übereinstimmt.
Im nächsten Schritt wird der Output der Abfrage in einem
Mit obigem Code werden alle in der Datenbank vorhandenen Produktkategorien aufgelistet, wobei die Sortierung primär nach der ersten und dann nach der zweiten Kategorie erfolgt.
Als Ziel-Seite für die Anzeige der übermittelten Formularwerte wird die Datei katalog_list.cfm angegeben. Die beiden Produktkategorien werden dabei als Formularinhalt in der Variablen "produktx" übermittelt.
Da bei einem Online-Shop meist mehrere Anwender die Site durchstöbern, muss zudem jedem einzelnen Anwender eine eindeutige Session-ID vergeben werden. Diese ID wird über die komplette Session als Variable entweder via Formular oder dann gleich in der URL übermittelt.
ColdFusion bietet zwar eine eigentliche Session-Variable, doch ist das Handling dieser Funktion eher kompliziert, weshalb wir dafür eine selbstgestrickte Lösung einsetzen.
Wir generieren hierbei für jeden Besucher eine Session-ID, die aus einer achtstelligen Zahl besteht. Hierfür erstellen wir eine Variable mit dem Namen "randomcode", der wir mit dem CF-Befehl RANDRANGE(0,9) nach dem Zufallsprinzip eine Zahl zwischen 0 und 9 zuordnen. Damit schliesslich die Session-ID nur dann generiert wird, falls noch keine vorhanden ist, wird dies über eine if-Abfrage zuerst überprüft. Der Code für eine zweistellige Zahl sieht demnach wie folgt aus:
