14. Web- baserede Apps i .NET

Preview:

DESCRIPTION

14. Web- baserede Apps i .NET. Objectives. “Real-world applications are typically multi-tier, distributed designs involving many components — the web server being perhaps the most important component in today's applications...” Web-baserede applicationer IIS WebForms WebServices. Del 1. - PowerPoint PPT Presentation

Citation preview

14. Web-baserede Apps i .NET

2NOEA 2009C#-kursus

Objectives

“Real-world applications are typically multi-tier, distributed designs involving many components — the web server being perhaps the most important component in today's applications...”

• Web-baserede applicationer• IIS• WebForms• WebServices

3NOEA 2009C#-kursus

Del 1

• Web-baserede applicationer…

4NOEA 2009C#-kursus

Husk applikationsdesign

• Mange applikationer er designet med N niveauer eller "tiers"– god adskillelse af områder– mulighed for genbrug af back-end tiers med forskellige FEs

Front-end

object object

object

Business

Presentation Data Access Data

5NOEA 2009C#-kursus

Web-baserede applikationer

• Web-baserede apps giver mange fordele:– udvider rækkevidden af applikationen til bruger OG platform– baserede på åbne, ikke-leverandørafhængige teknologier

• To typer:– WebForms: GUI-baseret app vist i browser– WebServices: objekt-baseret app returnerer rå XML

obj obj

obj

browser

Web server

HTTP,

HTMLWebPage

objcustom FE

other App

SOAP,XML

6NOEA 2009C#-kursus

Typer af web sites

• Set i IIS's perspektiv, 2 typer:– statisk– dynamisk

7NOEA 2009C#-kursus

Statiske web sites

• Et statisk web site har følgende egenskaber:1. alle websider er oprettet på forhånd og ligger i filer på

harddisken2. webserver returnerer siderne uden nogen behandling

<title>Welcome to AAA Painting</title>

<html><h3>Welcome to AAA Painting</h3><HR> <ol> <li> <A HREF="history.htm">History of our company</A> <li> <A HREF="prices.htm">Pricing</A> <li> <A HREF="contact-info.htm">How to contact us</A> </ol><HR></html>

8NOEA 2009C#-kursus

HTML

• Statiske web sites er typisk ren HTML– siden kan også indeholde script kode som kører på klient-

siden <title>Welcome to AAA Painting</title>

<html><h3>Welcome to AAA Painting</h3><HR> <ol> <li> <A HREF="history.htm">History of our company</A> <li> <A HREF="prices.htm">Pricing</A> <li> <A HREF="contact-info.htm">How to contact us</A> </ol><HR></html>

9NOEA 2009C#-kursus

Dynamiske web sites

• Et dynamisk web site involverer server-side processing• Hvordan kan IIS se forskel?

– baseret på fil extension af den fil, der requestes …

• Eksempel:

– statisk request:

http://localhost/AAAPainting/default.htm

– dynamisk request:

http://localhost/Workshop/default.asp

10NOEA 2009C#-kursus

ASP

• Active Server Pages• Microsoft's server-side programeringsteknologi

– ASP baseret på script sprog, fortolket– ASP.NET baseret på .NET sprog, oversat, hurtigere, …

http://host/page.asp

IIS

clientASPengine

HTML

11NOEA 2009C#-kursus

Eksempel

• lav en dynamisk side med deltagere– generer siden ved at læse navnene fra en database

IIS

ASPPage

12NOEA 2009C#-kursus

ASP side — del 1, præsentation

• ASP page = HTML + code…

<title>RWWP.NET, July 2002</title>

<html><h3>RWWP.NET, July 2002</h3><HR> List of attendees: <ol> <% Call OutputAttendees( ) %> </ol><HR></html>

<SCRIPT LANGUAGE="VBScript" RunAt="Server"> Sub OutputAttendees() . . .

inlinecodeblock

default.asp

13NOEA 2009C#-kursus

ASP page — del 2, logik

Sub OutputAttendees() Dim dbConn, rs, sql, firstName, lastName

sql = "Select * From Attendees" Set dbConn = CreateObject("ADODB.Connection") Set rs = CreateObject("ADODB.RecordSet")

dbConn.Open("Provider=Microsoft.Jet.OLEDB.4.0;" + _ "Data Source=C:\Inetpub\wwwroot\Databases\Attendees.mdb") rs.ActiveConnection = dbConn : rs.Source = sql : rs.Open

Do While Not rs.EOF firstName = rs("FirstName") lastName = rs("LastName") Response.Write("<li> " + firstName + " " + lastName) rs.MoveNext() Loop

rs.Close : dbConn.Close End Sub</SCRIPT>

default.asp

14NOEA 2009C#-kursus

Nøglen til web programmering…

• Det er en client-server relation– klient laver et request– server gør noget processering…– klient ser OUTPUT af server-side processering

15NOEA 2009C#-kursus

Del 2

• WebForms…

16NOEA 2009C#-kursus

Traditionel form-baseret web apps

• HTML understøtter allerede form-baserede apps

<HTML> <HEAD> <title>Login</title> </HEAD>

<BODY> <h2>Please login:</h2> <form method="get" action="Main.htm" id="Login"> Username: <INPUT type="text" id="Name"> <BR> Password: <INPUT type="text" id="pwd"> <BR> <BR> <INPUT type="submit" value="Login"> </form> </BODY></HTML>

17NOEA 2009C#-kursus

WebForms

• Web-baseret, form-baseret .NET apps

• Baseret på mange teknologier:– IIS– ASP.NET (extension til IIS)– .NET Framework SDK (CLR, FCL, tools)– Visual Studio .NET (drag-and-drop creation)

18NOEA 2009C#-kursus

Abstraktion

• Som WinForms, er WebForms baseret på klasser i FCL– adskiller WebForm app fra den underliggende platform

System.Web.UI.Page

CLR

Windows OS

instance of FCL classobject

19NOEA 2009C#-kursus

Oprette WebForm app

• Gode nyheder: næsten ligesom at oprette en WinForm app!1. opret et passende projekt i Visual Studio

2. design form(s) via drag-and-drop af controls

3. programmer events

20NOEA 2009C#-kursus

Eksempel

• En simpel WebForms app til at vise attendee info fra DB

21NOEA 2009C#-kursus

(1) Opret ASP.NET Web App project

• Location = name of web site = "http://localhost/AttendeeApp"– virtual directory: AttendeeApp– fysisk directory: C:\Inetpub\wwwroot\AttendeeApp

22NOEA 2009C#-kursus

(2) Projekt layout

• VS .NET konfigurerer IIS for dig• VS .NET opretter web sitet for dig

– indeholder 1 form-baseret web side– kaldt WebForm1.aspx by default– ignorer andre filer lige nu…

23NOEA 2009C#-kursus

(3) Design WebForm

• Ligesom en WinForm– drag-and-drop fra toolbox…

24NOEA 2009C#-kursus

Web controls vs. HTML controls

• Toolbox indeholder 2 typer af controls:– dem under Web Forms– dem under HTML

• Begge genererer ren HTML på klienten– dog sommetider med JavaScript!

• Web controls:– virker ligesom tilsvarende WinForm

• HTML controls:– mimic standard HTML controls

25NOEA 2009C#-kursus

(4) Implementer events

• WebForms er event-driven:– on Page_Load, indsæt i list box fra database– on cmdViewInfo_Click, vis info den valgte deltager

• I alle tilfælde, standard C# database programmering…

private void Page_Load(...){ IDbConnection dbConn = null; try { dbConn = new OleDbConnection(sConnection); dbConn.Open(); . . .

26NOEA 2009C#-kursus

(5) Run!

• Du kan afvikle applikationen fra VS• Du debugge fra VS

• Hvordan virker det?– starter en session af IE op– kobler debugger på IIS– viser .aspx siden markeret som "Start Page" i projektet

• højreklik på den .aspx side du vil starte med• vælg "Set as Start Page"

27NOEA 2009C#-kursus

(6) Reminder — client-server relationship!

• The server indeholder masser af kode– se fysisk directory…

• Men klient ser kun HTML!– "View Source" i browser…

28NOEA 2009C#-kursus

ASP.NET programmerings model

• Påoverfladen ser WebForms ud som WinForms• Men programmeringsmodellen er anderledes nedenunder

– som følge af ASP.NET– som følge af client-server paradigme

29NOEA 2009C#-kursus

#1: Traditionel dialog virker ikke

• For eksempel virker dette ikke:– MessageBox.Show( )– form1.Show( )

• Hvorfor ikke?– Hvor skal formen komme op?…

• Løsning:– Hvis du vil fortælle brugeren noget, brug en label på siden– Hvis du vil vise en anden side, redirect browser

30NOEA 2009C#-kursus

Web-baseret dialoger

• Vis en meddelse til brugeren:

private void cmdViewInfo_Click(...){ if (this.ListBox1.SelectedItem == null) { // nothing selected this.lblErrorMsg.Text = "Please select an attendee!"; return; }

. . .

31NOEA 2009C#-kursus

#2: Færre events

• Der er færre events at programmere i WebForms– primært kun Change og Click events

• hvorfor?– fordi hvert event giver en tur omkring serveren for at blive behandlet– og dermed er event processering en “dyr” aktivitet

IIS

client

1. initial request is posted2. HTML rendering of page

3. same page is "posted-back" for event processing4. HTML rendering of page

ASP.NETengine

32NOEA 2009C#-kursus

#3: AutoPostBack

• faktisk bliver nogle events ikke sendt med det samme…– istedet bliver event’et lagt i kø "queued" indtil siden alligevel

skal sendes tilbage• Gennemtvinge postback med det samme?

– sæt control's AutoPostBack property (hvis den har en)

• Eksempel:– list box laver ikke postback når du klikker på et item– istedet venter event’et til senere (f.eks. tryk på en knap)

33NOEA 2009C#-kursus

#4: Postbacks

• Der skelnes mellem:– det første request af side X fra klient C som sendes til server– efterføglende "postbacks" af side X til klient C

• Eksempel:– Page_Load event triggers hver gang– Men typisk kun for at initialisere form’en den første gang!

private void Page_Load(...){ if (this.IsPostBack) // no need to reload list box! return;

. . // first request, load list box from DB .

34NOEA 2009C#-kursus

#5: Statelessness

• Web apps er stateless• Hvert request af en side en selvstændig operation:

• forbindelse åbnes• request sendes• result returneres• forbindelse lukkes

• Implikationer? By default:– ingen session tilstand(i.e. ingen data for klient C mellem sider)– ingen global tilstand (i.e. ingen data mellem alle klienter & sider)– postback tilstand *er* håndteret af .NET

• e.g. indholdet af list box

Recommended