Entwicklung einer Webanwendung mittels HTML, ASP, C# und SQL am Beispiel einer Publikationsverwaltung Philipp Kühne 15.12.2012 Erstprüfer: Prof. Dr. Wilhelm Hanrath Zweitprüfer: Elena Schevardo 1. Einleitung ............................................................................................................. 1 2. Allgemeines zu verwendeten Technologien ......................................................... 2 1. Webapplikationen im Allgemeinen................................................................. 2 2. HTML............................................................................................................. 2 3. ASP.NET ....................................................................................................... 2 4. ASP-Seiten .................................................................................................... 3 5. SQL ............................................................................................................... 3 6. C# .................................................................................................................. 4 3. Projektplanung ..................................................................................................... 5 1. Anforderungsanalyse ..................................................................................... 5 2. Modell ............................................................................................................ 6 4. Datenbankstruktur ................................................................................................ 7 1. Veröffentlichungen......................................................................................... 8 5. Inhalt .................................................................................................................... 9 1. Übersichtstabelle ........................................................................................... 9 2. Erstellung einer Veröffentlichung ................................................................... 9 3. Suchen ........................................................................................................ 11 4. Bearbeitung und Upload einer Veröffentlichung .......................................... 12 5. Detailansicht einer Veröffentlichung ............................................................ 14 6. Download von Dateien ................................................................................ 15 7. Export einer Worddatei ................................................................................ 17 8. Versenden einer E-Mail ............................................................................... 17 6. Schlusswort ........................................................................................................ 18 7. Quellenangaben ................................................................................................. 19 8. Abbildungsverzeichnis ....................................................................................... 20 9. Eidesstattliche Erklärung .................................................................................... 21 1. Einleitung In dieser Seminararbeit wird auf die Entwicklung einer webbasierten Publikationsverwaltung eingegangen. Zuerst werde ich dabei auf die verwendeten Techniken und dann auf deren Funktion innerhalb der Publikationsverwaltung eingehen. Dabei werde ich besonders das Zusammenspiel der einzelnen Techniken erklären. An unserem Institut wird ein System benötigt, dass es ermöglicht allen Mitarbeitern Publikationen zentralisiert abzulegen und somit anderen Mitarbeitern zur Verfügung zu stellen. Bis jetzt konnten einzelne Publikationen nur auf Anfrage bei den mitwirkenden Assistenten bezogen werden. Es gab bis jetzt auch keine einheitliche Übersicht der Publikationen, bis diese auf der Institutswebseite erschienen. Dies führte zu hohen Wartezeiten und viel Aufwand durch alle beteiligten Assistenten. Nun sollte ein System entwickelt werden, dass es allen Mitarbeitern ermöglicht ihre Publikationen zentral zu speichern und alle wichtigen Informationen dieser Publikationen zu veröffentlichen. Hierbei bietet sich eine Webapplikation an, da somit ein plattformunabhängiges System zur Verfügung gestellt werden und jeder Mitarbeiter schnell und einfach darauf zugreifen kann. 1 2. Allgemeines zu verwendeten Technologien Webapplikationen im Allgemeinen Die typische Verwendung einer Webapplikation verläuft im Allgemeinen so, dass ein Client eine Anfrage in Form eines HTTP-Request durch Aufruf einer URL im Browser an einen Webserver stellt. Dieser Request wird vom Server entgegen genommen, welcher durch eine Skript- oder Programmiersprache entsprechende Daten ermittelt und auswertet. Diese Daten werden dann, an durch Platzhalter definierte Stellen, in ein vorgefertigtes Dokument ( Template ) eingefügt. Das resultierende HTMLDokument schickt der Webserver dann als HTTP-Response zurück zum Anwender, dessen Browser den empfangenen Inhalt dann darstellt. HTML HTML („HyperText Markup Language“) ist eine, durch bestimmte Bedingungen definierte, im Web verwendete Auszeichnungssprache.1 HTML gibt es in verschiedenen Versionen, wobe die aktuellste die Version 4.01 ist. Die HTML Version 5 ist bereits als ausgereifter Entwurf fertig gestellt. Außerdem gibt es HTML in verschiedenen Varianten (strict, transitional und frameset) oder auch als das XML basierte XHTML. Durch Verwendung von HTML Elementen, welche durch Textstellen in spitzen Klammern (Tags) definiert werden, kann die Darstellung der angezeigten Seite manipuliert werden, indem man Zeilenumbrüche einfügt, Listen und Tabellen definierte, Schriftformatierungen festlegt, Formulare erstellt oder auch Bilder einfügt. ASP.NET ASP.NET steht für „Active Server Pages .NET“ und ist eine Technologie zum erstellen dynamischer Webseiten, Webanwendungen und Webservices auf der Basis des .NET-Frameworks. 2Mittlerweile wird ASP.NET auf ungefähr 21% aller Webseiten als serverseitige Programmiersprache benutzt und ist somit nach PHP die am häufigsten verwendete Sprache zum erstellen von Webseiten. Webanwendungen können mit ASP in .NET unterstützen Sprachen erstellt werden. Hierzu sind fast ausschließlich objektorientierte Sprachen wie C# und VB.NET gebräuchlich. Eingeschränkt wird die Sprachwahl nur von der Entwicklungsumgebung. Somit ist ASP.NET keine Programmiersprache sondern eine Bündelung von Techniken. 1 2 http://de.selfhtml.org/intro/technologien/html.htm http://de.wikipedia.org/wiki/ASP.NET 2 ASP-Seiten Microsoft nennt ASP.NET-Webseiten offiziell „Web Forms“, welche das Grundgerüst für die Entwicklung von Webinhalten bilden. Diese Web Forms sind in .aspx-Dateien enthalten, welche normalerweise statisches (X)HTML Markup, Web Controls und User Controls enthalten. Diese Controls werden serverseitig verarbeitet und als dynamischer (X)HTML-Code ausgegeben.3 Web Controls sind zum Beispiel Charts oder verschiedene Views. Die Programmierung der Funktionalität kann auf 2 Arten erfolgen. Zum einen gibt es die Möglichkeit innerhalb der .aspx-Datei dynamische Codeinhalte zu platzieren. Hierbei gibt es allerdings den Nachteil, dass der Compiler erst zur Laufzeit den Code überprüft. Die bessere Variante ist die Verwendung von Code-Behind-Dateien. Diese haben normalerweise die Endung .aspx.cs oder .aspx.vb je nach gewählter Programmiersprache. Der Vorteil hierbei ist, dass der Compiler bereits vor Seitenaufruf die Seite kompiliert. Somit wird die Fehlerrate gesenkt. Weiterhin hat der Entwickler durch Verwendung von Code-Behind-Dateien die Möglichkeit auf verschiedenste Events der Controls zu reagieren wie zum Beispiel ein Klick auf eine Schaltfläche oder die Änderung von Text in einem Eingabefeld. Das .NET-Framework stellt viele Funktionen zur Verfügung und bietet somit viele Anforderungen ohne auf externe Bibliotheken zurückgreifen zu müssen. Weiterhin können ohne viel Aufwand Logins und bestimmte Rollen für Benutzer erstellt werden. In vielen Bereichen weicht ASP.NET von den Konzepten serverseitiger Skriptsprachen ab und erfordert damit zusätzlichen Entwickleraufwand für die Einarbeitung. Ein weiteres Manko von ASP.NET ist, dass man an Microsoft-Produkte gebunden ist. Dies kann zwar umgangen werden, führt aber oft zu Kompatibilitätsproblemen. SQL SQL steht für „Structured Query Language“ und ist eine Datenbanksprache zur Definierung von Datenstrukturen in relationalen Datenbanken4. Diese Datenbanken bestehen aus Tabellen, welche Daten verschiedener vorgegebener Typen abspeichern können. Die Tabellen bestehen aus Spalten mit Namen(Attributen) und dem jeweiligen Datentyp. Diesen Attributen können bestimmte Bedingungen zugewiesen werden wie zum Beispiel „Primary Key“, was zur eindeutigen Identifizierung einer Zeile dient. Eine weitere Bedingung ist der „Foreign Key“, welche eine logische Verknüpfung der Tabelle mit einer anderen Tabelle darstellt. Das Attribut verweist somit auf ein Attribut einer anderen Tabelle, welches allerdings denselben Datenbanktyp haben muss. 3 4 http://de.wikipedia.org/wiki/ASP.NET http://de.wikipedia.org/wiki/SQL 3 Datenbestände können per SQL abgefragt oder bearbeitet(Einfügen, Löschen, Verändern) werden. Hierzu muss allerdings erst eine Verbindung zur Datenbank erstellt werden. Dafür sorgen die bereits oben erwähnten Controls, mit deren Hilfe man Abfragen bzw. Anforderungen generieren und an die Datenbank schicken kann. Mit Hilfe eines GridViews zum Beispiel können die Daten dann auf einer Web-Form ausgegeben werden. C# C# zählt zu den objektorientierten Programmiersprachen und unterstützt sowohl die Entwicklung von sprachunabhängigen .NET-Komponenten als auch COMKomponenten für den Gebrauch mit Win32-Anwendungsprogrammen. Das Konzept von C# greift Konzepte von Java, C++, Haskell, C und Delphi auf. Wie alle .NETSprachen hat auch C# die Sprachunterstützung für Attribute und Delegaten, welche es erlauben Informationen über Klassen, Methoden oder Objekte zu speichern. Ein Delegat verweist auf eine Methode oder Klasse. 4 3. Projektplanung Anforderungsanalyse Gefordert ist eine Übersichtstabelle für alle Publikationen und alle dazugehörigen Informationen, sowie die Möglichkeit neue Publikationen hinzuzufügen oder zu editieren. Weiterhin muss ein Upload realisiert werden um alle Publikationen zentral zu speichern und somit zum Download zur Verfügung stellen zu können. Es soll für jede Publikation eine Detailansicht geben, die alle wichtigen Informationen anzeigt, um diese zum Beispiel zitieren zu können. Über diese Detailansicht soll es die Möglichkeit geben einzelne Bilder, die in der Veröffentlichung vorkommen, oder die Veröffentlichung als PDF-Datei herunterzuladen. Dazu soll eine eigene Übersichtsseite aller Bilder erstellt werde. Weiterhin muss zwischen verschiedenen Publikationsarten unterschieden werden, welche dementsprechend auch verschiedene Informationen beinhalten. Zu jeder Publikation müssen das Rohformat als Word-Datei, eine PDF-Datei und alle Bilder hochgeladen werden. Für jede Publikation soll es eine institutsinterne Veröffentlichungsnummer geben um langes Suchen der Mitarbeiter zu vermeiden. Damit langes abtippen der Informationen, der Veröffentlichungen für Zitate vermieden wird, soll ein Export realisiert werden, der eine Literaturliste in Form einer Word-Datei zur Verfügung stellt. Um die Liste der aktuellen Veröffentlichungen auf der Institutswebseite aktuell zu halten soll automatisch nach der Eingabe beziehungsweise Speicherung aller Informationen eine Email mit allen benötigten Informationen an die EDV gesendet werden. Als letzte Funktion ist eine Suche geplant. Benötigte Funktionen: Übersichtstabelle aller Arbeiten Detailansicht für Arbeiten Hinzufügen und editieren von Arbeiten Upload der Publikationen Download der Publikationen Suche von Publikationen 5 Mail versenden Word-Export Modell Um die Funktionen optimal umzusetzen und dem Benutzer die Handhabung zu vereinfachen wird für viele Funktionen eine eigene Seite erstellt. Bei umfangreichen Funktionen wird die Funktionalität auf mehrere Seiten aufgeteilt. Die Anmeldung an der Seite erfolgt hierbei komplett über den Internet Information Server(IIS) von Microsoft Server durch Anbindung an das Active Directory unseres Instituts. 6 4. Datenbankstruktur Aus den Anforderungen und Funktionalitäten hat sich ein Datenbankmodell mit nur einer Tabelle ergeben: Abbildung 1 7 Veröffentlichungen Die Tabelle veroeffentlichungen enthält „Nr“ als primary Key und alle für eine Publikation relevanten Daten. In einer späteren Version werden einige Attribute in einzelne Tabellen übernommen, da es dort momentan noch zu Inkonsistenzen kommen kann. 8 5. Inhalt Das System läuft auf einer eigenen im Intranet verfügbaren Seite, die auch über unsere Webseite aufrufbar ist. Nach der Anmeldung an dieser Seite wird man automatisch auf die Startseite des Systems weitergeleitet. Es gibt 6 grundlegende Seiten: Übersichtstabelle Die erste Seite enthält nur die Übersichtstabelle über alle Publikationen, eine Grobübersicht der jeweiligen Publikation, Links zum Download bestimmter Dateien und der Auswahl für den Export. Unter der Tabelle befindet sich ein Button um den Export anzustoßen. Abbildung 2 Erstellung einer Veröffentlichung Die Erstellung einer Veröffentlichung erfolgt über 3 Seiten verteilt. Auf der ersten Seite(Abbildung 3) müssen Publikationsform, Sprache, Dokumentart und Erscheinungsjahr angegeben werden. Über den „Weiter“-Button wird man dann zur 9 zweiten Seite(Abbildung 4) weitergeleitet. Auf dieser Seite müssen dann die Autoren und der Titel der Veröffentlichung eingetragen werden. Mit dem „Veröffentlichung anlegen“-Button wird erst dann ein Datenbankeintrag generiert. Es erfolgt dann automatisch eine Weiterleitung auf die dritte Seite(Abbildung 5), auf der eine kurze Zusammenfassung der gespeicherten Daten zu sehen ist und es die Möglichkeit gibt über den „Zur weiteren Bearbeitung“-Button weitere Daten zu der Veröffentlichung einzutragen. Abbildung 3 10 Abbildung 4 Abbildung 5 Suchen Auf dieser Seite(Abbildung 6) kann die Datenbank nach Veröffentlichungen anhand von Autor, Titel, Dateiname(hochgeladener Dateien), der Veröffentlichungsart und dem Erscheinungsjahr durchsucht werden. Mit einem Klick auf den „Suche starten“11 Button wird die SQL-Abfrage generiert. Dies geschieht durch überprüfen der einzelnen Felder. Wurde in ein Feld etwas eingetragen, wird dies als zusätzliche Bedingung in die SQL-Abfrage eingefügt. Die angeforderten Daten erscheinen dann in einer Tabelle unter dem „Suche starten“-Button, welche dieselbe Formatierung und Funktionen besitzt, wie die Übersichtstabelle. Abbildung 6 Bearbeitung und Upload einer Veröffentlichung Über einen Klick auf die „Nr“ wählt man die zu bearbeitende Veröffentlichung aus und wird automatisch zur nächsten Seite(Abbildung 8) weitergeleitet. Dort wird dann eine Grobübersicht der Veröffentlichung angezeigt und man hat 3 Buttons zur Auswahl um die jeweiligen Daten zu ändern, einzutragen oder Dateien auf den Server hochzuladen. Da es nicht möglich ist mehrere Dateien in dem Server-Control, welches zum Upload benötigt wird, auszuwählen, müssen Dateien einzeln ausgewählt und über den „Hinzufügen“-Button einer temporären Liste hinzugefügt werden. Der „Hochladen“-Button führt dann den Upload aus und speichert die Dateien in bestimmten Ordnern. Hierbei wird in Word-Dateien, PDF-Dateien und Quell-Dateien unterschieden. 12 Abbildung 7 Abbildung 8 13 Abbildung 9 Detailansicht einer Veröffentlichung Durch das Klicken auf die „Nr“ einer Veröffentlichung in einer der Tabellen, ausgenommen der Tabelle in der Abbildung 7, wird man zur Detailansicht der gewählten weitergeleitet. Dort werden alle Informationen einer Veröffentlichung angezeigt, die üblicherweise vorhanden sein sollten. Sollte eine bestimmt Information nicht eingetragen worden sein, so wird ein rotes „Fehlt“ angezeigt, wie in Abbildung 10 zu sehen ist. Unter dieser Detailansicht ist eine Tabelle zu sehen, die wie in der Übersichtstabelle Links zu den Downloads enthält, sollten Dateien hochgeladen worden sein. 14 Abbildung 10 Download von Dateien Beim Download wird in 3 Kategorien unterschieden. Da es nicht möglich ist, den Download mehrerer Dateien gleichzeitig anzustoßen, wird bei dem Link in der Spalte „PDF“ direkt die PDF-Datei der jeweiligen Veröffentlichung zum Download angeboten und der Benutzer bekommt eine normale Aufforderung vom Browser um diesen Download zu akzeptieren. Beim Klicken des Links in der Spalte „Bilder“ hingegen wird man zu einer Seite(Abbildung 11) weitergeleitet, die eine Tabelle mit allen Dateinamen, einem Downloadlink und einem Vorschaubild zeigt. Die letzte Möglichkeit Daten vom Server herunterzuladen ist die Auswahl mehrerer Veröffentlichungen anhand der Checkboxen in der letzten Spalte der Tabellen. Um den Download anzustoßen muss der „Alle Ausgewählten als PDF runterladen“Button, welcher sich direkt unter der Tabelle befindet geklickt werden. Da, wie bereits erwähnt, das Anstoßen des Downloads mehrerer Dateien gleichzeitig nicht möglich ist, wird der Benutzer aufgefordert eine sogenannte Click-Once-Anwendung auszuführen. Diese benötigt nur Benutzerrechte auf einem PC und eine installierte Version des .NET-Frameworks 3.5 um installiert zu werden. Danach lädt diese ClickOnce-Anwendung eine Textdatei vom Server, die die gesamte Liste aller angeforderten Dateien enthält und lädt diese sogleich ein. Nach Festlegung eines 15 gültigen Zielordners und klciken des „Herunterladen“-Buttons angeforderten Dateien gleichzeitig heruntergeladen. werden alle Abbildung 11 Abbildung 12 16 Export einer Worddatei Für den Export einer Word-Datei der Office 2007 Version musste auf das Microsoft Office Open XML SDK zurückgegriffen werden. Dieses bringt ein Tool mit sich, welches dem Programmierer erlaubt, eine beliebige XML-basierte Office-Datei einzulesen und deren kompletten Inhalt oder auswählbare Stellen in C#-Quellcode umzuwandeln. Somit wurde das Gerüst einer Word-Datei als Code direkt übernommen und auch die Erstellung eines Paragraphen wurde als C#-Code exportiert und so angepasst, dass übergebene Daten dort eingefügt wurden. Nach Abarbeitung aller in der Tabelle ausgewählten Datensätze wird die Word-Datei dann direkt dem Benutzer als Download zur Verfügung gestellt. Versenden einer E-Mail Zum Versenden einer Email an die EDV musste nur folgender Code in die Speichern-Methode eingefügt werden, die beim Klick auf den „Speichern“-Button in Abbildung 8 aufgerufen wird. MailMessage Email = new MailMessage(); // Absender einstellen MailAddress Sender = new MailAddress("[email protected]"); Email.From = Sender; // Empfänger hinzufügen Email.To.Add(new MailAddress("[email protected]")); // Betreff hinzufügen Email.Subject = "Publikation " + row["Nr"]; // Nachrichtentext hinzufügen String text = "Publikation " + row["Nr"] + " hat finalen Stand erreicht.\r\n" + htmlExport(rw); Email.Body = text; // Postausgangsserver definieren SmtpClient MailClient = new SmtpClient("smarthost.rwthaachen.de"); String UserName = "MaxMustermann"; String Password = "Musterpasswort"; System.Net.NetworkCredential Credentials = new System.Net.NetworkCredential(UserName, Password, "win.iwm.rwth-aachen.de"); // Anmeldeinformationen setzen MailClient.Credentials = Credentials; // Email senden MailClient.Send(Email); 17 6. Schlusswort Mit dieser Webapplikation ist nun ein neues sehr leistungsfähiges Tool zur Verwaltung von Publikationen vorhanden. Für die Zukunft ist die Erweiterung des Funktionsumfangs geplant, wie bereits im Hauptmenü zu sehen ist. Eine Zugriffsberechtigung für die Veröffentlichungen ist bereits soweit eingerichtet, dass nur Benutzer die eine Veröffentlichung erstellt haben, diese auch bearbeiten dürfen. Abschließend ist nur noch zu sagen, dass mit ASP.NET und Erfahrung in SQL und einer .NET-basierten objektorientierten Programmiersprache eine Webapplikation sehr schnell und effektiv umgesetzt werden kann. Die Vorgehensweise bei der Erstellung einer Webapplikation ist jedoch immer dieselbe. Die Programmiersprache kann durch eine beliebige Skriptsprache ersetzt werden und auch die Datenbank kann beliebig getauscht werden. 18 7. Quellenangaben 1. 2. 3. 4. http://de.selfhtml.org/intro/technologien/html.htm http://de.wikipedia.org/wiki/ASP.NET http://de.wikipedia.org/wiki/ASP.NET http://de.wikipedia.org/wiki/SQL 19 8. Abbildungsverzeichnis Abbildung 1................................................................................................................. 7 Abbildung 2................................................................................................................. 9 Abbildung 3............................................................................................................... 10 Abbildung 4............................................................................................................... 11 Abbildung 5............................................................................................................... 11 Abbildung 6............................................................................................................... 12 Abbildung 7............................................................................................................... 13 Abbildung 8............................................................................................................... 13 Abbildung 9............................................................................................................... 14 Abbildung 10............................................................................................................. 15 Abbildung 11............................................................................................................. 16 Abbildung 12............................................................................................................. 16 20 9. Eidesstattliche Erklärung Entwicklung einer Webanwendung mittels HTML, ASP, C# und SQL am Beispiel einer Publikationsverwaltung 21