18 Web applications Serverside code ASP Mark Dixon
18 – Web applications: Server-side code (ASP) Mark Dixon Page 1
Session Aims & Objectives • Aims – To introduce the fundamental ideas involved in server-side code • Objectives, by end of this week’s sessions, you should be able to: – create an asp web-page, including: • HTML, and • server-side VB Mark Dixon Page 2
Example: Logon (analysis) SPECIFICATION • User Requirements – protection from fraud and invasion of privacy • Software Requirements – Functional: – logon page, user must type name and password – following pages can only be accessed after successful logon – Non-functional should be very difficult to hack Mark Dixon hotmail, Amazon, University portal, utility bills (gas, electricity, phone, internet), Travel (flights, ferry, car rental) Page 3
Example: Logon (design) • Restrict access to home page Mark Dixon Page 4
Example: Logon (code v 1) Logon. htm • Using Client-side VB Script <html> <head><title></head> <body> Please logon: <input id="txt. User. Name" type="text" /> <input id="txt. Pass. Word" type="text" /> <input id="btn. Logon" type="submit" value="Logon" /> <p id="msg"></p> </body> </html> <script language="vbscript"> Sub btn. Logon_On. Click() Dim un Dim pw un = txt. User. Name. value pw = txt. Pass. Word. value If un = "mark" And pw = "soft 131" Then window. navigate "home. htm" Else msg. inner. Text = "Login details incorrect. " End If End Sub </script> Mark Dixon Home. htm <html> <head><title>My Home page</title></head> <body> <p> Welcome to my home page. <img src="You. Are. Here. jpg" /> </p> </body> </html> Page 5
Example: Login (Problem) • View Source – shows client-side script: Reveals both username & password Mark Dixon Page 6
Web Hardware and Software network connection Client Mark Dixon Server Browser Application Web-server Application (MS Explorer, Fire. Fox, Opera) (MS IIS, Apache) Page 7
Request-Response Cycle Request Browser Application (MS Explorer, Firefox) Logon. htm Response Web-server Application (MS IIS, Apache) <html> <head><title></head> <body> Please logon: <input id="txt. User. Name" type="text" /> <input id="txt. Pass. Word" type="text" /> <input id="btn. Logon" type="submit" value="Logon" /> <p id="msg"></p> </body> </html> Client-side code: Code sent to Client Interpreted by browser Mark Dixon <script language="vbscript"> Sub btn. Logon_On. Click() Dim un Dim pw un = txt. User. Name. value pw = txt. Pass. Word. value If un = "mark" And pw = "soft 131" Then window. navigate "home. htm" Else msg. inner. Text = "Login details incorrect. " End If End Sub </script> Page 8
Server-side Script (what) • ASP – active server pages – code not sent to client • code secure (can't be viewed by client) – executed on server • takes time – request-response cycle • requires server software (e. g. IIS) • ASP pages will NOT work by double clicking on file Mark Dixon Page 9
Example: Date. aspx • ASP code: <script language="VB" runat="server"> Sub Page_Load() Dim s As String s = "The date today is " s = s & Format(Now, "ddd d MMM yyyy") par. D. Inner. Text = s s = "The time now is " s = s & Format(Now, "HH: mm") par. T. Inner. Text = s End Sub </script> <html> <head><title>Today's Date</title></head> <body> <p id="par. D" runat="server"></p> <p id="par. T" runat="server"></p> </body> </html> Mark Dixon –. aspx (not. htm) – VB (not vbscript) – variables have type – Now is current date and time (on server) – runat="server" gives server code access to object Page 10
Request-Response Cycle Browser Application Request date. aspx Web-server Application (MS IIS, Apache) (MS Explorer, Firefox) Response <script language="VB" runat="server"> Sub Page_Load() Dim s As String s = "The date today is " s = s & Format(Now, "ddd d MMM yyyy") par. D. Inner. Text = s s = "The time now is " s = s & Format(Now, "HH: mm") par. T. Inner. Text = s End Sub </script> <html> <head><title>Today's Date</title></head> <body> <p id="par. D">The date today is Mon 9 Feb 2009</p> <p id="par. D" runat="server"></p> <p id="par. T">The time now is 00: 57</p> <p id="par. T" runat="server"></p> </body> </html> Mark Dixon Server-side code: run on server (never sent to Client) Page 11
View Source • Code executed at server – code is never sent to client • View, Source – does not show code: Mark Dixon Page 12
Data Types • Variant – all types of data – slow, memory hungry • Boolean – true or false (on/off, yes/no) • Integer – whole numbers (-32768 to 32768) • Long – whole numbers (large) • Single – decimal numbers • Double – decimal numbers (more precise) • String – text • Object – object instances Mark Dixon Page 13
Data Type Selection • Number of Rooms e. g. 4 Integer/Long • Height e. g. 1. 87 m Single/Double • Surname e. g. Smith String • Car Reg e. g. XY 55 ABC String Mark Dixon Page 14
Using data types • Variable declaration Dim x As Long • Parameters Sub Thing(boo As String, y As Long) • Functions Function Is. Tall() As Boolean Mark Dixon Page 15
Question: Data types • Declare a variable to store: – an animal's weight in kg (e. g. 34. 6) Dim weight As Double – whether a person has a driving licence or not Dim licence As Boolean – the title of a book Dim title As String – a phone number (e. g. 01752 586225) Dim phone As String Mark Dixon Page 16
Example: Add. Num (client-side) Add. Num. htm <html> <head><title></head> <body> <input id="txt. N 1" type="text" /> <input id="txt. N 2" type="text" /> <input id="btn. Add" type="submit" value="Add" /> <p id="par. Res"></p> </body> </html> <script language="vbscript"> Sub btn. Add_on. Click() Dim N 1 Dim N 2 N 1 = txt. N 1. Value N 2 = txt. N 2. Value par. Res. Inner. Text = N 1 + CDbl(N 2) End Sub </script> Mark Dixon Page 17
Example: Add. Num (server-side) Add. Num. aspx <script language="VB" runat="server"> Sub Page_Load() Dim N 1 As Double Dim N 2 As Double If Request. Form("btn. Add") > "" Then N 1 = txt. N 1. Value N 2 = txt. N 2. Value par. Res. Inner. Text = N 1 + N 2 End If End Sub </script> • If btn. Add clicked • input tags inside <html> form <head><title></head> <body> <form runat="server"> • submit button: <input id="txt. N 1" type="text" runat="server" /> <input id="txt. N 2" type="text" runat="server" /> refreshes page <input id="btn. Add" type="submit" value="Add" runat="server" /> <p id="par. Res" runat="server"></p> (sending data to </form> </body> server) </html> Mark Dixon Page 18
Client-side vs. Server-side Code Add. Num. htm Add. Num. aspx <html> <script language="VB" runat="server"> <head><title></head> Sub Page_Load() <body> Dim N 1 As Double <input id="txt. N 1" type="text" /> Dim N 2 As Double <input id="txt. N 2" type="text" /> If Request. Form("btn. Add") > "" Then <input id="btn. Add" type="submit" value="Add" /> N 1 = txt. N 1. Value <p id="par. Res"></p> N 2 = txt. N 2. Value </body> par. Res. Inner. Text = N 1 + N 2 </html> End If End Sub </script> <script language="vbscript"> Sub btn. Add_on. Click() Dim N 1 <html> Dim N 2 <head><title></head> N 1 = txt. N 1. Value <body> N 2 = txt. N 2. Value <form runat="server"> par. Res. Inner. Text = N 1 + CDbl(N 2) <input id="txt. N 1" type="text" runat="server" /> End Sub <input id="txt. N 2" type="text" runat="server" /> </script> <input id="btn. Add" type="submit" value="Add" runat="se <p id="par. Res" runat="server"></p> </form> </body> </html> Both use VB Script language (i. e. Sub, If, Dim, For, etc. ) Mark Dixon Page 19
Example: Apples. aspx <script runat="server" language="VB"> Sub Page_Load() If Request. Form("btn. Go") > "" Then par. Res. Inner. Html = par. Res. Inner. Html & "<img src='Apple. gif' />" End If End Sub </script> <html> <head><title>Apples</title></head> <body> <form runat="server"> <input id="btn. Go" type="submit" value="Go" runat="server" /> <p id="par. Res" runat="server"></p> </form> </body> </html> Mark Dixon Page 20
Errors <script language="vbscript" runat="server"> Sub Page_Load() vbscript cannot run at Dim s As String s = "The date today is " server (should be VB) s = s & Format(Now, "ddd d MMM yyyy") par. D. Inner. Text = s s = "The time now is " s = s & Format(Now, "HH: mm") par. T. Inner. Text = s Declaration expected End Sub (assignment must be in sub) par. D. inner. Text = "" </script> <html> <head><title>Today's Date</title></head> par. T is undefined <body> (should have runat="server") <p id="par. D" runat="server"></p> <p id="par. T"></p> </body> </html> Mark Dixon Page 21
Running your ASP pages • within Visual Studio – Run (play) button (F 5) – only available to you on development PC • using Internet Information Services (IIS) – makes PC a server – page available to all computers on internet Mark Dixon Page 22
IIS - Installing • IIS / personal web server on Windows CD Start, Settings, Control Panel, Add/Remove Programs Add/Remove Windows Components IIS Mark Dixon Page 23
IIS: Enabling/Disabling • Start, Settings, Control Panel, Administrative Tools, Internet Services Manager Start Mark Dixon Stop Page 24
IIS: Exposing pages • Put ASP pages in: – C: INet. Pubwww. Root (this part of hard disk exposed to outside world) • Execute pages by putting: – localhost (in web browser, e. g. IE, means local machine) • ASP pages don't work by double-clicking Mark Dixon Page 25
IIS – Date. asp C: INet. Pubwww. RootDate. aspx localhost/test/date. aspx Mark Dixon Page 26
Tutorial Demo: First. htm • Create a new text file in web server's root folder: – – – Open Windows Explorer (My Computer) Ensure folders are displayed Navigate to: C: INet. Pubwww. Root Right click on the background Click New Click Text Document • Rename file – – Mark Dixon Right click Click Rename Type file name (First. htm) Click Yes (when asked to confirm change of extension) Page 27
Tutorial Demo: First. htm • Put some code in the file: – Right Click on the file – Click Open with Notepad – Type the following code: <html> <head><title></head> <body> Hello world! </body> </html> • View the file – Open Internet Explorer – Navigate to: http: //localhost/First. htm Mark Dixon Page 28
Tutorial Demo: First. htm • View each others' pages – In your browser, type: http: //SMB 109 xx/First. htm where xx is the machine number of someone else's computer you should see their page • See changes take effect: – One person change their page (colour, etc. ) – Other person refresh browser you should see changes Mark Dixon Page 29
Tutorial Demo: Date. aspx • Create a web-site page (same as before): – Open Visual Studio 2005 – Click the File menu – Click the New Web Site… item – Click the Browse button – Select an existing folder to put your work in – Type the name of a subfolder – Click Yes to create the subfolder – Click Empty Web Site – Click OK Mark Dixon Page 30
Tutorial Demo: Date. aspx • Create a new aspx page: – Click Add New Item icon on tool bar – Double Click html page icon – Right click file – Click Rename item – Change name (date. aspx) – Click Yes to confirm extension change – Paste the code in from the lecture slides – Click the Run button Mark Dixon Page 31
Tutorial Exercise: Login (client-side) • LEARNING OBJECTIVE: see how vulnerable client-side code is • Task 1: Get the Login (v 1) example from the lecture working. • Task 2: Use view source – you should be able to see the code. Mark Dixon Page 32
Tutorial Exercise: Date • LEARNING OBJECTIVE: create an ASP page, including HTML and server-side VB Script • Task 1: Get the Date example from the lecture working. • Task 2: Add code that displays good morning/afternoon/evening/night, depending on the time of day. Mark Dixon Page 33
Tutorial Exercise: Student Loan • LEARNING OBJECTIVE: create an ASP page, including HTML and server-side VB Script from scratch to solve a problem • Task 1: Create a web page that allows the user to enter their salary and the computer calculates the annual and monthly payments for their student loan. Hint: Use your client-side code (from term 1), and the Add. Num example from the lecture. Mark Dixon Page 34
Tutorial Exercise: Login (client-side) • LEARNING OBJECTIVE: create an ASP page, including HTML and server-side VB Script from scratch to solve a problem • Task 1: Create a login page that uses server-side code to check the username and password entered by the user. Hint: Use the Add. Num example as inspiration. Hint 2: Use the following code to send the user to the homepage: Response. Redirect("Home. htm") • Task 2: Use view source – you should NOT be able to see the code. Mark Dixon Page 35
Tutorial Exercise: Apples • LEARNING OBJECTIVE: use variables with specific data types in ASP code • Task 1: Get the apples example (from the lecture) working. • Task 2: Modify your program so that the user enters a number, and the code adds that number of apple images. • Task 3: Modify your program so that the user enters another number, and the code adds a new line tag for that number of apples. Hint: Within the loop divide the number of apples by the second number, if the result is a whole number add a new line tag. Mark Dixon Page 36
- Slides: 36