intro to web programming using php, http, css, and javascript layton smith cse 4000
TRANSCRIPT
Intro to Web Programming
using PHP, HTTP, CSS, and Javascript
Layton SmithCSE 4000
Intro
• Types in PHP• Advanced String Manipulation• The foreach construct• $_REQUEST environmental variable• Correction on extract and ereg• Easier file access• The session• How to use include and require• functions and scope• HTTP, CSS, Javascript• What does it all mean???• Debugging it all
Types in PHP
Variable Types int, float, bool, string array object resource null Comparisons with ==, !=, ===, !== 1 == "1" is true1 === "1" is false1 === 1 is true
Why use PHP?
• Available nearly everywhere• Very good support/documentation• Plenty of tools to help• Fast development• Even has a GUI library!
Advanced Strings
• Dot (.) is concatenation (not de-reference) $string = "Hello World";echo 'This is a \n $string'; echo "This is a \n $string";
Outputs:This is a \n $string This is aHello World
Heredoc/Nowdoc
echo <<<AnYtHiNgThis expands $variables and \n newlinesAnYtHiNg;
echo <<<'aNyThInG'This doesn't expand $variables or \n newlinesaNyThInG;
Array Handling
In Java:Iterable<Clazz> i = new Iterable<Clazz>();//...for(Clazz c : i){ //i gets looped through and assigned to c at each loop}
In PHP$array = array("key1" => "value1", "key2" => "value2");foreach($array as $key => $value){ //$key is the index/key, and $value is the value}
Array Handling cont.
Array constructor:$array = array("item", "key1" => 1, "key2" => "value");
$array[] = "value1";$array[] = "value2";//equivalent to$array = array("value1", "value2");//or $array[0] = "value1";$array[1] = "value2";
$_REQUEST
$_REQUEST is equivalent to:
array_merge($_GET, $_POST, $_COOKIES);
Order can be arranged in the php.ini file
DON'T USE EXTRACT ON USER INPUT!(use $_REQUEST instead)
Example
Quicker file handling
$file_contents_as_string = file_get_contents($filename)
file_put_contents($filename, $contents_to_write)
The Session
session_start() sends user PHPSESSID cookie. $_SESSION holds only this user's data
First script:$_SESSION['key'] = $value;
Second script:$value = $_SESSION['key'];
Includes/Requires
file.php:
$var = "Hello World!";
page.php:$var = "Goodbye World!";include("file.php");echo $var;
Outputs:Hello World!
Variable Scope
In Java:
String s = "Hi";if(true){ System.out.println(s);}System.out.println(s);
This works fine
Variable Scope (cont.)
In Java:if(true){ String a = "Hello World";}System.out.println(a);
Compile error!
Variable Scope (cont.)
In PHP:
$string = "Hi";if(true){ echo $string;}
Outputs:Hi
Variable Scope (cont.)
In PHP:
if(true){ $string = "Hi";}echo $string;
Outputs:Hi(not a syntax error!)
Variable Scope (cont.)Two scopes: Global Scope - all variables outside of a function Function Scope - only variables declared in function
$a = "Hi!";function f(){ echo isset($a)?"It is set!":"It is not set!";}f(); Outputs: It is not set!
Variable Scope (cont.)Superglobals: $_GET, $_POST, $_SESSION, etc... always in scope.
Use the global keyword
$a = "Hi!";function f(){ global $a; echo isset($a)?"It is set!":"It is not set!";}f();Outputs: "It is set!"
Functions
In Java:
class myClass{ int myFunction(int one, String two){ //do stuff } int myFunction(int one){ return myFunction(one, "default"); } }
Perfectly legitimate Java code
Functions (cont.)
In PHP:
function myFunction($one, $two = "default"){ //do something;}
Functions (cont.)
In Java:
class myClass{ int myFunction(int one, boolean two){ return something; }
int myFunction(boolean two, int one){ return something; }}
No equivalent in PHP
HTTP
Sample HTTP request POST /index.php HTTP/1.1Host: example.com Content-Type: application/x-www-form-urlencoded
key1=value1&key2=value%20of%20key2
HTTP (cont.)
Sample HTTP Response
HTTP/1.1 200 OKDate: Mon, 07 Mar 2011 21:05:05 GMTContent-Type: text/html Content-Length: x<html>...</html>
Example in BurpSuite
CSS
Cascading Style Sheets Order of priority:3. <link href="special.css" rel="stylesheet" type="text/css" />2. <style type="text/css"> ...</style> 1. <div style='background-color: red;'></div>
CSS (cont.)
Selectors: E - element E#id - element with id='id'.class - element with class='class'E > F - element F that is child of EE F - element F that is descendant of E
div.red { color: red;}
CSS (cont.)
Syntax:
<selector> { <property>:<value>;}
Javascript
• Client Side Scripting• Server forms the html• Javascript manipulates that html• AJAX used to communicate• Install JQuery, and use it
PHP + HTTP + CSS + Javascript
Debugging everything
• Use Firebug/Chrome Developer Tools• See all parts of the HTTP transaction• Debug Javascript• Edit HTML realtime• Watch GET/POST requests live• Example
Sources
• php.net - PHPs equivalent to Java API• w3schools.com - Javascript/CSS/HTML reference• jQuery.com - Javascript wrapper library• portswigger.net/burp/ - BurpSuite• http://getfirebug.com/ - Firebug for Firefox