Course lecture for Fast, Easy, Complicated, and Powerful Web http://fecpw.phiffer.org/

1. Diving into PHP
Fast, Easy, Complicated, and Powerful Web
ITP, Spring 2011, section 1, session 1
Dan Phiffer dan@phiffer.org

2. Diving into PHP

3. A simple content
management system
1. Build a form for user input
2. Store submissions in a database
3. Retrieve submission data

4. Basic form
<form action="basic-form.php">
<input type="text" name="query" />
<input type="submit" name="button" value="Kablooey" />
</form>

5. Feedback
<?php
echo $_REQUEST["query"];
?>
<form action="basic-form.php">
<input type="text" name="query" />
<input type="submit" name="button" value="Kablooey" />
</form>

6. Feedback
<?php
echo $_REQUEST["query"];
?>
<form action="basic-form.php">
<input type="text" name="query" />
<input type="submit" name="button" value="Kablooey" />
</form>

7. What’s that ‘notice’ about?
<?php
echo $_REQUEST["query"];
?>
<form action="basic-form.php">
<input type="text" name="query" />
<input type="submit" name="button" value="Kablooey" />
</form>

8. Solution: check if it’s set
<?php
if (isset($_REQUEST["query"])) {
echo $_REQUEST["query"];
}
?>
<form action="basic-form.php">
<input type="text" name="query" />
<input type="submit" name="button" value="Kablooey" />
</form>

9. Dynamic strings
<?php
if (isset($_REQUEST['query'])) {
echo "<h1>You wrote: '{$_REQUEST['query']}'</h1>";
}
?>
<form action="basic-form.php">
<input type="text" name="query" />
<input type="submit" name="button" value="Kablooey" />
</form>

10. Try it out

11. Defining a new variable
<?php
$query = "";
if (isset($_REQUEST["query"])) {
$query = $_REQUEST["query"];
echo "<h1>You wrote: '$query'</h1>";
}
?>
<form action="basic-form.php" >
<input type="text" name="query"
value="<?php echo $query; ?>" />
<input type="submit" name="button" value="Kablooey" />
</form>

12. Step 1 complete!

13. Wait, this is bad

14. User types input...

15. Clicks away... arbitrary
JavaScript execution!

16. We’ve been tricked into
adding an ‘onblur’
attribute!

17. Cross-site scripting (XSS)
• A common security vulnerability
• When content is unintentionally
executed as code
• We must handle user-submitted
content very carefully

18. Dangers of XSS
• Users’ sessions could be hijacked
• Passwords could be stolen
• Your site could get spammed up
• Puppies murdered, etc.

19. Escaping user input
<?php
$query = "";
if (isset($_REQUEST["query"])) {
// htmlentities() turns " into &quot;
$query = htmlentities($_REQUEST["query"]);
echo "<h1>You wrote: '$query'</h1>";
}
?>
<form action="basic-form.php" >
<input type="text" name="query"
value="<?php echo $query; ?>" />
<input type="submit" name="button" value="Kablooey" />
</form>

20. Before & after escaping

21. Now we’re really finished
with step 1
1. Build a form for user input
2. Store submissions in a database
3. Retrieve submission data

22. Adding a database

23. Relational databases
• Tables with columns and rows of
individual data cells
• SQL is the language for working with
relational databases
• MySQL is the database platform used
by WordPress

24. The four operations
• Create new rows with INSERT
• Read rows with SELECT
• Update rows with UPDATE
• Delete rows with DELETE
• MySQL documentation

25. MySQL clients
• Sequel Pro (Mac OS X)
• SQLWave, SQLMaestro (Windows)
• phpMyAdmin (web-based)
• Or from the command-line: ‘mysql’

26. $ mysql -u root

27. mysql> CREATE DATABASE

28. -> tinydb CHARACTER SET utf8;

29. mysql> USE tinydb;

30. mysql> CREATE TABLE tinytable

31. -> (id INTEGER PRIMARY KEY AUTO_INCREMENT);

33. mysql> ALTER TABLE tinytable ADD COLUMN

34. -> content TEXT;

37. mysql> INSERT INTO tinytable

38. -> (id, content)

39. -> VALUES (1, 'Hello, world!');

40. mysql> SELECT * FROM tinytable;

41. Let’s build a tiny wiki!

42. A simple content
management system
1. Build a form for user input
2. Store submissions in a database
3. Retrieve submission data

43. A simple content
management system
1. Build a form for user input
2. Store submissions in a database
3. Retrieve submission data

44. Basic form
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type"
content="text/html; charset=utf-8" />
<title>Tiny wiki</title>
</head>
<body>
<?php
$content = ""; // We need to load the content!
?>
<form action="tiny-wiki.php" method="post">
<input type="text" name="content"
value="<?php echo $content; ?>" />
<input type="submit" value="Update" />
</form>
</body>
</html>

45. Add a load function
<?php
$content = load_content();
function load_content() {
// Load content from the database
return "";
}
?>

46. Add a database function
<?php
$db = connect_to_database();
$content = load_content($db);
function load_content($db) {
// Load content from the database
return "";
}
function connect_to_database() {
// Connect to the database
}
?>

47. Connecting to the
database
function connect_to_database() {
$host = "127.0.0.1";
$port = 8889;
$user = "root";
$pass = "root";
$name = "tinydb";
$dsn = "mysql:host=$host;port=$port;dbname=$name";
return new PDO($dsn, $user, $pass);
}

48. Querying the database
function load_content($db) {
$sql = "SELECT * FROM tinytable ORDER BY id DESC";
$query = $db->query($sql);
$results = $query->fetchAll();
$row = $results[0];
return $row["content"];
}

49. tiny-wiki.php
<?php
$db = connect_to_database();
$content = load_content($db);
function load_content($db) {
$sql = "SELECT * FROM tinytable ORDER BY id DESC";
$query = $db->query($sql);
$results = $query->fetchAll();
$row = $results[0];
return $row['content'];
}
function connect_to_database() {
$host = "127.0.0.1";
$port = 8889;
$user = "root";
$pass = "root";
$name = "tinydb";
$dsn = "mysql:host=$host;port=$port;dbname=$name";
return new PDO($dsn, $user, $pass);
}
?>
<form action="tiny-wiki.php" method="post">
<input type="text" name="content" value="<?php echo $content; ?>" />
<input type="submit" value="Update" />
</form>

50. Result

51. A simple content
management system
1. Build a form for user input
2. Store submissions in a database
3. Retrieve submission data

52. Core logic
<?php
$db = connect_to_database();
$content = load_content($db);
if (!empty($_REQUEST["content"])) {
save_content($db, $_REQUEST["content"]);
$content = htmlentities($_REQUEST["content"]);
}
?>

53. Saving the content
function save_content($content) {
$sql = "INSERT INTO tinytable (content)
VALUES ('$content')";
$db->query($sql);
}

54. Save the content

55. A simple content
management system
1. Build a form for user input
2. Store submissions in a database
3. Retrieve submission data

56. Wait, this is bad

57. How does it work?
$content = "'); drop table tinytable; --";
$sql = "INSERT INTO tinytable (content)
VALUES ('$content')";

58. How does it work?
$content = "'); drop table tinytable; --";
$sql = "INSERT INTO tinytable (content)
VALUES ('$content')";
// Result: (-- is a comment in SQL)
// "INSERT INTO tinytable (content)
// VALUES (''); drop table tinytable; --')

59. SQL injection
• Another security vulnerability, similar
to cross site scripting
• When user data is unintentionally
executed as SQL
• Escaping works here also (also,
prepared statements)

60. Escape the user input
function save_content($db, $content) {
$content = $db->quote($content);
$sql = "INSERT INTO tinytable (content)
VALUES ($content)"; // no more single quotes
$db->query($sql, array($content));
}

61. Done!
• Download the files
• Try running the tiny wiki on your
own local Apache/MySQL/PHP
• Get familiar with the PHP manual