joe hummel, phd dept of mathematics and computer science lake forest college hummel@lakeforest.edu...
Post on 24-Dec-2015
215 Views
Preview:
TRANSCRIPT
Joe Hummel, PhD
Dept of Mathematics and Computer ScienceLake Forest Collegehummel@lakeforest.edu
Lecture 8: WebForms — Web-based GUIs using ASP.NET
8-28. WebForms
8.1 WebForms
• Intro to WebForms and ASP.NET…
8-38. WebForms
WebForms
• In .NET, GUI-based web applications are called “WebForms”– vs. “WinForms”, which are GUI-based Windows desktop applications
• Example:– a simple web-based Calculator
8-48. WebForms
ASP.NET
• WebForms are built using ASP.NET technology– ASP.NET = Active Server Pages .NET
– ASP.NET = the web component of .NET
• Denoted by web sites with “.aspx” extension…
Default.aspx
8-58. WebForms
ASP.NET Programming Model
• Same intuitive model that we saw earlier with WinForms:– drag-and-drop controls from Toolbox
– controls raise events in response to user actions
– handle events using code-behind programming
protected void cmdAdd_Click(object sender, EventArgs e){ int i, j, k;
i = System.Convert.ToInt32( this.txtNumber1.Text ); j = System.Convert.ToInt32( this.txtNumber2.Text ); k = i + j;
this.lblResult.Text = "Sum = " + k;}
protected void cmdAdd_Click(object sender, EventArgs e){ int i, j, k;
i = System.Convert.ToInt32( this.txtNumber1.Text ); j = System.Convert.ToInt32( this.txtNumber2.Text ); k = i + j;
this.lblResult.Text = "Sum = " + k;}
8-68. WebForms
ASP.NET Execution Model
• How does ASP.NET really work?– ASP.NET is a server-side technology
– all event processing / code execution happens on the server
– the client is a traditional browser using HTTP and HTML
Web server
clientbrowser
WebPage
get or post…
response…
cmdAdd_Click(…){ . . .}
cmdAdd_Click(…){ . . .}
"Click"
8-78. WebForms
8.2 WebForms in VS 2005
• Let's build a web app in Visual Studio…
8-88. WebForms
Example
• Let's build the web-based Calculator…
8-98. WebForms
(1) Create new web site
• File menu >> New >> Web Site…
File System or HTTP?
8-108. WebForms
(2) Layout the UI
• 2 labels, 2 text boxes, and a button– to position a control, select it, then use Position in Layout menu
– select “Absolute” and position control as desired
8-118. WebForms
(3) Configure Controls
• Set properties of each control to your liking– Text of button to “Add”– Title of page to “Calculator”
– name of controls via (ID) property
– etc.
8-128. WebForms
(4) Additional Layout & Configuration
• You can also control markup by directly editing source HTML – most ASP.NET programmers work this way
– control layout using HTML (e.g. tables), apply CSS, add JavaScript for client-side processing, etc.
8-138. WebForms
(5) Handle Events
• Code-behind page to handle events– in true code-behind fashion, code is separate
from web page
protected void cmdAdd_Click(object sender, EventArgs e){ int i, j, k;
i = System.Convert.ToInt32( this.txtNumber1.Text ); j = System.Convert.ToInt32( this.txtNumber2.Text ); k = i + j;
this.lblResult.Text = "Sum = " + k;}
protected void cmdAdd_Click(object sender, EventArgs e){ int i, j, k;
i = System.Convert.ToInt32( this.txtNumber1.Text ); j = System.Convert.ToInt32( this.txtNumber2.Text ); k = i + j;
this.lblResult.Text = "Sum = " + k;}
8-148. WebForms
(6) Run and Test!
• As usual, you can run at any time by pressing F5– VS builds app, compiling source code & loading into local web server
(look for ASP.NET Development Server icon in task bar)
– VS then runs app by starting an instance of IE & surfing to start page
http://localhost:3990/Calculator/Default.aspx
ASP.NET Development
Server
default.aspx
cmdAdd_Click(…){ . . .}
cmdAdd_Click(…){ . . .}
8-158. WebForms
Observations
• Visual Studio provides full support for debugging
• ASP.NET applications are compiled– versus ASP and most other web technologies, which are interpreted
• ASP.NET is a server-side technology– witness IE's progress bar when you click button…
• ASP.NET controls render themselves as HTML– view source on the client — it's pure HTML!
8-168. WebForms
8.3 ASP.NET Execution Revisited
• How do ASP.NET applications really execute?• Publishing your web application
8-178. WebForms
IIS(inetinfo.exe)
Internet Information Services (IIS)
• IIS is Microsoft's commercial web server• ASP.NET is a plug-in for IIS
– installed when you install Visual Studio .NET
– runs outside IIS for security and robustness reasons
ISAPI ExtensionManager
ASPNET_ISAPI.DLLASP.NET ISAPI extension
Browser
http://server/page.aspx
HTTP Request
ASPNET_WP.EXEASP.NET worker process
CLR
ASP.NET
8-188. WebForms
AppDomains
• Each ASP.NET application runs in a separate domain• An AppDomain is a protection boundary, similar to a process
– web apps are thus isolated from one another
ASPNET_WP.EXEASP.NET worker process
CLR
AppDomain
ASP.NETBrowser
http://server/Calculator/Default.aspx
HTTP Request
AppDomain
ASP.NETBrowser
http://server/Sales/Default.aspx
HTTP Request
8-198. WebForms
Multi-user
• AppDomains are multithreaded to handle multiple clients– page requests are assigned to threads from CLR's thread pool
– Implication? ASP.NET applications are inherently multithreaded!
ASPNET_WP.EXE
CLR
AppDomain
ASP.NET
Clienthttp://server/Calculator/Default.aspx
Client
.
.
.
Client
http://server
/Calculator/D
efault.aspx
http://server/Calculator/Default.aspx
T1 T2 T3
8-208. WebForms
ASP.NET Application?
• An ASP.NET application = set of web pages + .DLL– the web pages contain the HTML markup
– the .DLL contains the .NET code behind the web pages
• Example:– here's the Calculator web app configured in IIS under the URL http
://localhost/WebCalculator
ASPNET_WP.EXE
CLR
AppDomain
ASP.NET
App.dll
8-218. WebForms
Publishing your Web App
• Build menu >> Publish Web Site– you can publish to a local or remote instance of IIS– you can publish to the file system & copy the files yourself
– Due to a bug in VS 2005, URL must differ from project name — reason the example is published as "http://localhost/WebCalculator"
8-228. WebForms
8.4 Web Programming
• Web and ASP.NET programming can be subtle…
8-238. WebForms
Issues in Web Programming
• Web apps are stateless by default!– page object is recreated on each request
– ASP.NET maintains state of UI, but not the objects themselves
– however, you can maintain object state as well using ASP.NET
• Subsequent page requests are really "post-backs"– you may want to rethink how you implement Page_Load
• Events are expensive to process since round-trip to server– perform as much client-side processing as possible — e.g. validate
input on the client using ASP.NET's Validation controls (which render as JavaScript!)
– ASP.NET controls won't offer as many event as WinForms
– some events require you to set their AutoPostBack property to trigger immediate processing of event — e.g. ListBox SelectedIndexChanged
8-248. WebForms
8.4 What's Next?
• Lab exercise #8…
top related