Dienstag, 1. November 2011

8 - Die kleinen Helferlein

Direkt hier gelandet? Alle Beiträge über WebMatrix zeigen

WebMatrix ist sehr stark darauf ausgerichtet, dass fertige Quellen einfach eingebunden werden können. Ein wichtiges Instrument sind dabei die 'Helper'. Helper sind vom Prinzip her Klassen, deren Methoden und Eigenschaften äusserst einfach angesprochen werden können.

Auf eine Vielzahl von Helpern kann über die Admin Seite zugegriffen werden.Es gibt aber auch noch andere Quellen wie die Snippet Plattform Gist. Snippets sind kleine wiederverwendbare Codeschnipsel.

Im folgenden wollen wir einmal ein Gästebuch in die Bäckerei einbauen. Die Bäckerei wie in Folge 5 beschrieben, kann schon mal gestartet werden. Die dort gemachten Codeanpassungen werden für das Gästebuch nicht benötigt. Es kann also auch das Standardtemplate verwendet werden. Als Vorbereitung benötigen wir nun noch eine neue Seite (rechts-Click auf den Root Eintrag - New File - CSHTML) mit dem Namen '_AppStart.cshtml'. Ausserdem wird noch ein Folder 'App_Code' und eine Seite GuestbookHelper.cshtml benötigt. Die defaultmässigen Inhalte der neuen Seiten können gelöscht werden. Das Ganze sieht dann so aus:


Nun holen wir uns ein Helperscript von Gist:


Ein Click auf den Gästebuch Helper zeigt das Script. Um das Script kopieren zu können muss oben rechts 'raw' angewählt werden, sonst gibt es einen Buchstabensalat:


Das Script wird in den Kopierpuffer genommen und in die vorhin neu erstellte Seite 'GuestbookHelper.cshtml' kopiert. Anschliessend muss der Name der Datenbank in der ersten Codezeile eingetragen werden. Bei uns heisst die Datenbank 'bakery':

Nun initialisieren wir die Datenbank ....


.... und tragen auf der Seite 'Default.cshtml' folgenden Code ein:


Obiger Code bewirkt eine Anzeige des Gästebuchs. Man kann jetzt ruhig einmal die Seite mit Run ausführen. Auf 'Home' sihet man aber erst den Titel 'Gästebuch'. Noch nicht sehr sexy. Klar, wir brauchen noch Einträge. Somit ergänzen wir die Seite 'About' wie folgt:


Drückt man jetzt auf Run und wechselt auf About, sieht man ein Eingabeformular:


Nicht schlecht für eine Codezeile, oder? Leider hat das ganze nun noch einen Haken. 'Show Form' zeigt zwar das Eingabeformular, einen Befehl, den Eintrag zu speichern ist aber nirgens ersichtlich. In der konventionellen Programmierung würde nun der Befehl an die Datenbank folgen, nicht aber im Web. Hier wird das Formular mit 'Submit' abgeschickt und ruft sich selbst wieder auf. Im Kopf des Formulars wird dann geprüft, ob Einträge vorhanden sind. Wem das nicht geläufig ist, muss sich unbedingt in die Thematik einarbeiten.

Also brauchen wir im Kopf des Formulars noch folgenden Code:


Damit veranlassen wir den Eintrag in die Datenbank und springen nach dem Eintrag gleich auf die Seite Home. Der Helper verfügt über einen eigenen Test, ob ein Post Eintrag vorhanden ist. Auf die gezeigte Weise spart man sich aber einige CPU Takte, da der Helper nur bei einem Eintrag aufgerufen wird. Wenn nun alles richtig ist, müssten die Einträge jetzt vorgenommen werden und das sieht dann so aus:


Cool, nicht! Aber wo werden jetzt eigerntlich die Einträge gespeichert? Schauen wir unds doch mal die Datenbank an:


Wie man sieht, wurde eine Tabelle 'Guestbook' in der Datenbank 'bakery.sdf' angelegt. Hier werden die Daten verwaltet.

Zum Schluss wie üblich noch ein Linktipp. Im Webcast von Dariusz Paris werden die Helper und vieles mehr anschaulich erklärt.

9 - Login, Mail und Captchas


Direkt hier gelandet? Alle Beiträge über WebMatrix zeigen

Ich bin auf die Webmatrix gestossen, weil ich schon lange eine Pendenzenverwaltung der spezielleren Art mit einfacher 'Grafik'  aber ausgefeilten Datenbankfunktionen bauen wollte. Aus diesen Grund verlassen wir jetzt die Bäckerei und wenden uns dem Starter Template zu. In der letzten Folge haben wir mit wenigen Befehlen ein Gästebuch konstruiert. In dieser Folge bauen wir uns mit nicht viel mehr Befehlen eine komplette Webauthentifikation mit Captcha Sicherung und Mailversand, um sicherzustellen, dass sich die richtige Person auf der Seite registriert hat.

Mit 'new Site - Template' laden wir die englische Starterseite. Mit der neusten Betaversion von Webmatrix funktioniert das Template einwandfrei. Von älteren Versionen habe ich gehört, dass Bugs vorhanden sind.Ich habe die Seite mal 'Pendenzenliste' genannt. Wie weit ich das Projekt hier im Blog beschreibe, lasse ich vorderhand mal offen. Interessenten können aber gerne einen Kommentar hinterlassen.

Als ersten Schritt schalten wir die Administration frei, wie das in Folge 6 beschrieben wurde. Sinnvollerweise installiert man jetzt die neuste Webhelper Library, die unter 'Pakete - Anzeigen online' zu finden ist. Diese Library arbeitet im Hintergrund und wird z.B. bereits für die Funktion der Captchas benötigt.

Als zweiten Schritt richten wir das Mail ein. Dazu werden in der Seite _AppStart.cshtml die Kommentare entfernt und die Zugangsdaten des Mails eingetragen. Und o Wunder, o Wunder dem Mail Helper sei Dank, funktioniert das Mail bereits.

Mit 'Run - Registration' gelangt man auf die Anmeldeseite, die eigentlich bereits funktioniert. Es befindet sich eine Anleitung auf der Seite, wie man einen Captcha Code einbauen kann. Das machen wir übungshalber im dritten Schritt. Die 'Arbeit' besteht darin, sich auf der Seite reCaptcha zu registrieren, den Public und den Privat Key zu besorgen und am richtigen Ort einzutragen und einige Kommentare zu entfernen. Das war's dann bereits.

Jetzt kann man sich registrieren, bekommt einen Aktivierungslink per Mail und kann einen Account aktivieren.

Ging das zu schnell? Nochmals langsam zum mitschreiben findet sich hier eine Anleitung.

Montag, 31. Oktober 2011

10 - Layouts

Auch ein einfacher Webauftritt besteht aus vielen einzelnen Seiten. Es wäre mühsam, jedesmal den gesamten Rahmen in jede Seite einzubauen. Aus diesem Grund gibt es in WebMatrix die Layouts. Der Aufruf erfolgt natürlich via Razor und ist wie üblich sehr einfach gehalten:

Die erste Zeile spezifiziert die Layout Seite, auf der zweiten Zeile kann der Seitentitel angegben werden.
Die Seite '_SiteLayout.cshtml' enthält die allen Seiten gemeinsamen Spezifikationen. Der '_' bedeutet in WebMatrix dass die Seite von aussen nicht zugänglich ist. Gerade bei Privat Keys wie sie z.B. für die Captchas benötigt werden ist das natürlich essentiell. Beim Seitenlayout wäre ein direkter Zugriff zwar nicht schlimm aber sinnlos.

Nun bearbeiten wir noch die oben erwähnte Seite _SiteLayout.cshtml. Wir wollen hier nämlich noch die Menueinträge ergänzen:

Der Aufruf wird aber noch nicht funktionieren, weil wir die Seite 'Adress_Input' erst in der nächsten Folge erstellen.

Eine gute Übersicht über Layouts findet ihr hier und hier.

Sonntag, 30. Oktober 2011

11 - SOAP Service mit XML und LINQ parsen

In vorangehenden Beiträgen wurde schon ein paarmal aufgezeigt, was mit einigen wenigen Codezeilen alles erreicht werden kann.

Jetzt wollen wir uns einmal anschauen, wie die Mächtigkeit des .net Frameworks genutzt werden kann. Dazu gibt es das folgende Tutorial. Darin wird gezeigt, wie von einem amerikanischen Wetterdienst XML Daten geparst und in eine SQL Datenbank geschrieben werden können.


So sehen die Rohdaten aus. Uns interessieren die Minimum- und die Maximum Temperatur.





Leider enthält das Tutorial zwei kleine Fehler:
  • In der ersten Zeile der Seite 'Weather.cshtml' muss unbedingt die folgende Deklaration eingefügt werden: @using System.Xml.Linq;
  • Der Aufruf der Hauptfunktion muss natürlich 'public' deklariert sein und lautet dann wie folgt: public static Temperature GetWeather(string zipcode){
Man begegnet zunehmend dieser Art von Services, indem Daten in einem vorgegebenen Format (meistens XML) zur Verfügung gestellt und automatisch abgerufen werden können. In der Regel geschieht das mittels SOAP (Simple Object Access Protocol). Leider ist das Protokoll aber nicht wirklich simpel. Die Thematik ist recht komplex und sprengt den Rahmen dieses Blogs bei weitem. Es lohnt sich, jeweils nach entsprechenden Templates zu suchen. Ein prominente Seite ist. z.B. Amazon. So ist das Format auch im oben gezeigten Fall eigentlich nicht XML sondern DWML (Digital Weather Markup Language). DWML ist aber XML kompatibel.