Introduction to Client-Server Programming ASP.NET
Client-Server Cycle Client requests page Client formats an HTTP request HTTP Example: Server Side Server responds… Finds requested file Formulates response and sends to client Header Fields (informs client) Body (content) Client Server TCP/IP
ASP Implemented via asp.dll (ISAPI) Process ASP files before sending to client Uses VBScript or JavaScript Embed code & data (BAD!) Mixes content with code Optionally #include
ASP (cont) Limits access to controls Ad Rotator FileSystemObject ADO (ActiveX Data Object) – DB Connections Can purchase 3rd party components or develop COM wrappers to access Win32 API
ASP.NET Implemented via ISAPI – aspnet_isapi.dll Processes ASPX files before sending to client Uses the CLR (common language runtime) Can program ASP.NET in ANY CLR language (C# & VB.NET most popular)
ASP.NET Full access to the .NET Class Library (immense!) Session information shared across multiple servers (server farm – scalability) Configuration easy via .config files
ASP.NET in C# Two sides: A simple “calculator” example… Code definition HTML asp:SOMETHING object A simple “calculator” example…
The Form <HTML> <BODY> <form RunAt="server"> Absolutely, positively NEVER forget the RunAt attribute! <HTML> <BODY> <form RunAt="server"> <asp:Textbox id="op1" RunAt="server"/> <asp:TextBox id="op2" RunAt="server"/> <asp:Button id="Sum" text="=" OnClick="DoAdd" RunAt="server"/> <asp:Label id="Result" RunAt="server"/> </form> </BODY> </HTML>
The Code <SCRIPT Language="C#" RunAt="server"> void DoAdd (Object sender, EventArgs e) { int i = Convert.ToInt32(op1.Text); int j = Convert.ToInt32(op2.Text); int r = i + j; Result.Text = r.ToString(); } </SCRIPT>
Two Options Place the HTML and SCRIPT in one file with an ASPX extension Place the HTML in a file with an ASPX extension Place the code in a file with a “.cs” extension Add a reference to the code file in the ASPX file <%@ Page language="c#" src="SOURCE.cs" %>
When an ASPX File is Requested Client sends a request to server for add.aspx Server locates file & realizes its extension Sends it to the appropriate ISAPI processor Processes file, replacing references to asp object controls with HTML 4.01 Only compiles file if it has changed since last referenced (JIT) Uses cache copy of file if possible (improves performance) Executes Load and Init functions (if any) Adds hidden “state” information Client only sees HTML, no source code at all Serves the result to client Client receives HTML and renders it in browser
Client-Server Request/Response Process
When an Event is Generated Callback to server Function is executed Possible changes to HTML Server responds with HTML 4.01 results Does require round-trip Usually efficient b/c of small data in transit
Putting it Together (calc.aspx) <HTML> <BODY> <form RunAt="server"> <asp:Textbox id="op1" RunAt="server"/> <asp:TextBox id="op2" RunAt="server"/> <asp:Button id="Sum" text="=" OnClick="DoAdd" RunAt="server"/> <asp:Label id="Result" RunAt="server"/> </form> </BODY> <SCRIPT Language="C#" RunAt="server"> void DoAdd (Object sender, EventArgs e) { int i = Convert.ToInt32(op1.Text); int j = Convert.ToInt32(op2.Text); int r = i + j; Result.Text = r.ToString(); } </SCRIPT> </HTML>
Two More Tasks Create a virtual directory in IIS pointing to the directory that contains calc.aspx Remember – all dynamic pages MUST be viewed in a browser (you can’t just double-click them in explorer) Allows you to view the page in your browser Run the “permissions wizard” on this new virtual directory Allows the ASP.NET page to be processed Get an error (“cannot display page”) if you forget this step
Resultant Page (FINALLY)
The HTML Source Auto-generated material is highlighted <HTML> <BODY> <form name="_ctl0" method="post" action="calc.aspx" id="_ctl0"> <input type="hidden" name="__VIEWSTATE"value="dDwtMTM3MDk5MDcwNDs7PvmsttsAS+T3BC5jicR6A+ndD0Ow" /> <input name="op1" type="text" id="op1" /> <input name="op2" type="text" id="op2" /> <input type="submit" name="Sum" value="=" id="Sum" /> <span id="Result"></span> </form> </BODY> </HTML> Auto-generated material is highlighted
Resultant Page (after submit)
The HTML Source (after submit) <BODY> <form name="_ctl0" method="post" action="calc.aspx" id="_ctl0"> <input type="hidden" name="__VIEWSTATE" value="dDwtMTM3MDk5MDcwNDt0PDtsPGk8MT47PjtsPHQ8O2w8aTw3Pjs+O2w8dDxwPHA8bDxUZXh0Oz47bDwxMjs+Pjs+Ozs+Oz4+Oz4+Oz6pyFGIUcsfx+JmwPKg9fE2//Jx4Q==" /> <input name="op1" type="text" value="5" id="op1" /> <input name="op2" type="text" value="7" id="op2" /> <input type="submit" name="Sum" value="=" id="Sum" /> <span id="Result">12</span> </form> </BODY> </HTML> Modified material is highlighted