Web forms and Server Side Scripting Server Side Scripting Internet Development Applications Sawsan Slii Marzouki Internet Applicatiosn Development Dynamic Interactive Web Server What is a server? (3-tier architecture) Many types of server: File server FTP server Web server Mail server News server General Multi-tier Architecture Web content HTML documents are static Dynamic content : User side programming (JavaScript, CSS, Ajax, JQuery …… ) Server side programming (PHP, ASP and ASP.Net, JSP, Python ….) 1 Why Server Side Programming? History of web dynamic content Accessibility : Common Gateway Interface (CGI) was the Any one can reach Internet. first generation approach to providing dynamic web content (used scripts) Manageability : Does not require distribution of application code Numerous second generation alternatives were invented (FastCGI, mod_Perl, NSAPI, Security : ISAPI, Java Servlets …) Source code is not exposed Scripting, the third generation ( طور ) : Scalability Web-based 3-tier architecture can scale out approach Scripting, the third generation approach Scripting languages or compiled Embed simple code in HTML pages Scripting languages Compiled languages The HTML pages use the code to decide what elements to display and what data should be Server Side Includes (SSI) C displayed. Perl C++ PHP ASP.Net Classes and/or subroutines can be called to compute information for inclusion in the web ASP (VBScript) Java Servlet page. Python Java Server Pages This is know as « scripting ». Some approaches to Scripting Criteria affecting Scripting choice JavaServer Pages ( JSP ) by Sun MicroSystems Web Server availability Hypertext Preprocessor (PHP ): open source Knowledge of language Cold Fusion (CFML) by Macromedia Scalability and efficiency Active Server Pages ( ASP and ASP.Net ) by MicroSoft Personal preference 2 JSP (Java Server Pages) Learn more about JSP, Java-based technology that simplifies the development of dynamic websites PHP and ASP.Net Designed around the Java Philosophy Packaged with J2EE It separates presentation aspects from programming logic contained in the code. J2EE Technology Servlets and JSP Web container (application server) EJB container Servlets : JSP pages running in webServers JSP: JavaServer Pages Apples, XML, JDBC, …… . JSP Basics A simple JSP code Individual JSP pages are text files stored on the web server. When a page is first required, then JSP Engine uses the page to generate a Servlet. The compiled Servlet is saved and used to serve additional requests. When a page is modified, the appropriate Servlet is New.java.util.Date().ToString(): creates a date regenerated. Object and converts it to a String that can be displayed Precompilation is also possible 3 What is PHP? What is PHP? Open source Server-Side Scripting language Commands are preprocessed by Php designed specifically for the web. processor and appropriate HTML is sent to Conceived in 1994. the web server. Supports a wide-range of databases. Platoform independant Perl and C like syntax. Easy to learn Designed similar to ASP: you embed Usually associated to MySQL database (a commands into your web pages. relational free DBMS, can run on Unix, Windows, and Mac OS). Php Process Flow Php first example: ASP.Net Based on .Net Framework and the common web forms and Server language runtime (CLR) Compiled language Side Scripting MicroSoft Only Platforms 4 Form processing script Steps to Form Processing Script Creating the HTML code for the form <form action="myform.php" method="post"> <!-- form fields here --> </form> The “action ” specifies what page to submit the form to. The “method ” indicates how the form is submitted :Get and Post. Most of the time, forms will use the “post ” method. Steps to Form Processing Script Steps to Form Processing Script <form action="myform.php" method="post"> Getting the form data: The input of type “text ” is just a single line field Which is your favorite movie? to type in some text. We give it a name of <input type="text" name="formMovie" “formMovie ” . maxlength="50"> You have a button submit that submits the whole <input type="submit" name="formSubmit" form once clicked on. value="Submit"> </ form > Steps to Form Processing Script Steps to Form Processing Script <?php Validating the input: if ($_POST['formSubmit'] == "Submit") Suppose we have a user who forgot to enter one of the fields? { We need to validate the form to make sure it ’s complete and $varMovie = $_POST['formMovie']; } ?> filled out with valid information. <form action="myform.php" method="post"> Which is your favorite movie? <input type="text" name="formMovie" maxlength="50"> <input type="submit" name="formSubmit" value="Submit"> </ form > 5 Steps to Form Processing Script Steps to Form Processing Script <?php if (empty($_POST['formName'])) if ($_POST['formSubmit'] == "Submit") { { $errorMessage = ""; $errorMessage .= "<li>You forgot to enter a name!</li>"; if (empty($_POST['formMovie'])) } { $errorMessage .= "<li>You forgot to enter a movie!</li>"; } $varMovie = $_POST['formMovie']; $varName = $_POST['formName']; Steps to Form Processing Script if (!empty($errorMessage)) { PHP: how to connect to echo("<p>There was an error with your form:</p>\n"); the server? echo("<ul>" . $errorMessage . "</ul>\n"); } } ?> PHP: How to connect to the server? Website on a hosted server Option 1: Website on a hosted server Create a file in Notepad (or similar text editor) named test.php Option 2: Install PHP on your computer Insert the following code in the file: Option 3: XAMPP <?php echo "Hello World!"; ?> Upload the file to your web host. Open the file in your browser. If the browser writes "Hello World!" your web host supports PHP and you are ready to go. Otherwise contact your hosting provider for more information. 6 Install PHP on your computer XAMPP We will learn more about this option in Open the program XAMPP Control Panel practice using EasyPhp. Start the Apache server and the MySql server: Create a file in Notepad named test.php . Insert the following code in the file: <?php echo "Hello World!"; ?> Save the file in the folder "c:\xampp\htdocs". Open the file in your browser with the address http://localhost/test.php. If the browser writes "Hello World!" the installation is successful, and you're ready to run PHP on your computer. 7.