CS5331: Web Security

of things

Lecture 1: Overview

CS5331 Lecture 1 1
 The (In)Security of Web
What are the recent (web) security incidents in news?

CS5331 Lecture 1 2
OWASP Top 10

CS5331 Lecture 1 3
Why Does This Happen?
• Functionality: the primary concern during design and
implementation.
• Security is the secondary goal
• Unawareness of security problems
• Unavoidable human mistakes
• Awareness
• Lazy programmer
• Complex modern computing systems

CS5331 Lecture 1 4
Impatient Programmers
• Maybe enough for
learning basic functionality
• Never enough for to learn
subtle implications of
functionalities
• Result: programs can do
more than you expect

CS5331 Lecture 1 5
Functionality, Security, and Trust
• Security is about “nothing
else” Possible
Software
• Specified functionality and Behaviors
only specified functionality
Specified
• Trust for functionality vs. Functionality
Trust for security •
•
Feature 1
Feature 2
• …
• E.g., trusting CPU for
computation and for
security enclave

CS5331 Lecture 1 6
Principle of Easiest Penetration
l Security is about every aspect of a computing system
- Hardware, software, data, and people.
l Principle of easiest penetration:
- Any system is most vulnerable at its weakest point.
- Attackers don't follow any rules. Don't underestimate their
creativity.

CS5331 Lecture 1 7
CS5331 Lecture 1 8
CS5331 Lecture 1 9
The Web Platform

Browser Extensions

Application
Protocols

Web
Frameworks
CS5331 Lecture 1 10
Why are they Web objects?
Google TP-Link

CS5331 Lecture 1 11
Web as a platform or infrastructure
• What is the trend of Web?
• Chromebook
• Web assembly (WASM)
• Web 3.0?
• Industry 4.0
• Metaverse (Humanity 5.0)

CS5331 Lecture 1 12
Overview of Web Threats
Network UI, Password
Attacks Attacks

Web Session
Attacks
Other Injection
Client- Web Session Attacks
side/Browser (HTTP)
Attacks

Cache, OS, …
Server-side
Web Authentication/ Attacks
Mobile Authorization Attacks
Attacks

IoT
Attacks
CS5331 Lecture 1 13
Methodology
How
Systems
Work?

Solution: Attack:
New Break
Defense System

How
Attacks
Work?
CS5331 Lecture 1 14
Ethics of Web Security

CS5331 Lecture 1 15
Learning to Attack
• If you know the enemy and know yourself, you need not
fear the result of a hundred battles.
!"!#$%&'()
Sun Tzu, Art of War
• To prevent attack, we need to learn how attack happens

CS5331 Lecture 1 16
Ethical Use of Security Information

l We discuss vulnerabilities and attacks

- Most vulnerabilities have been fixed
- Some attacks may still cause harm
- Do not try these at home
l Purpose of this class
- Learn to prevent malicious attacks
- Use knowledge for good purposes

CS5331 Lecture 1 17
Administrative Matters

CS5331 Lecture 1 18
CA Components and Support
• Tests and quiz: 30%
• Individual assignments: 45%
• Final group project:
• 25%
• Module resources on Canvas
• Class mailing list
• [email protected]
• Consultation channel on Teams

CS5331 Lecture 1 19
Group-based Final Project
• Project Goal:
• Apply our methodology: Deeply understand of a large system,
understand attacks, and design solutions.
• Each group is expected to have two to three students
• Please announce your group information to the TA mailing list

CS5331 Lecture 1 20
Project Proposal
• Due date: Mid February, 2023
• What to submit:
• Problem description
• Your solution and its novelty, list of reference
• The platform and tools used in project
• Project schedule
• You need to make sure your group is capable to handle
the technical challenge independently

CS5331 Lecture 1 21
Progress Report
• Due date: Mid-March, 2023
• How is your progress compared to your proposal?
• Literature survey
• Initial approach description
• If you have difficult or question, raise them early

CS5331 Lecture 1 22
Final Report and Presentation
• Final report due before reading week
• Following the typical format of technical report or research
papers used in our class

• Final presentation: options for in-class presentation, or

video-recording submission
• 10 minutes for each group

CS5331 Lecture 1 23
Sample Project Topics
• Sanitization analysis to prevent XSS/SQLI attacks in web
applications
• Transparent web-server plugin to give strong protection on
sensitive web data
• Analysis of privacy leakage in browser extensions
• Detecting authentication vulnerability in IoT devices

CS5331 Lecture 1 24
Brief History of the Web

CS5331 Lecture 1 25
Assumption:
You already know …
• Basic familiarity with:
• HTTP, HTML, CSS, JS, URLs, Frames, DOM, Navigation,
Cross-frame communication
• If not, CS 142 (Stanford) undergrad course
• Browse through Week 1, 4, 5, 6, 7 material
• Or learn from https://www.w3schools.com
• Today: Just a recap…

CS5331 Lecture 1 26
Evolution of the Web
te d d d ed
i nven er , e d ,a d s e d
e s e d i s h e a
rs - Le brow l e as as ed p u bl ing b l ish re le
e t e
0 r r rele L 3.2 script p u me
Bern e firs L 2 .
o 4 .0 1 h ro
T i m d t h T M ga t T M and L l e C
9: a n : H Navi 7: H t s H TM o g
98
1 Web , 4
99 ape 9
19 app l e : G o
1 c 1 9 99 0 8 :
0
the Net
s Java 2

199 199 199 200 201

3: M 5
HTM new: Mo 8 : Net 8: F 4: H
osa t zi s c irst TM
ic b L ,M a gs e l l a Su a pe dra L5
i cro o f t of
row
s er soft merge ite pen
-sou H TM
rele IE r d in rce L5
ase elea d
d sed

CS5331 Lecture 1 27
Architecture of Web
http://www.example.com
• HTTP protocol GET / HTTP 1.1
Host: www.example.com
User-Agent: Mozilla/…

HTTP/1.1 200 OK
Date: Thu, 13 Oct2011
Server: Apache/1.3.41
Content-Type: text/html
... ...

CS5331 Lecture 1 28
A Static HTML Page <HTML>
<HEAD>
<TITLE>HelloWorld!</TITLE>
File </HEAD>
Access <BODY>
<H3>Hello World!</H3>
From <A HREF=“http://www.nus.edu.sg”>NUS</A>.
</BODY>
</HTML>

Request hello.html

CS5331 Lecture 1 29
Dynamic Web Pages
• Web servers dynamically generate different Web
pages according to different requests and
parameters
• CGI (Common Gateway Interface)
• For Web servers to delegate the generation of Web
pages to other programs, e.g. C, Perl, PHP, etc.

• Other alternatives:
• FastCGI: more efficient process and IPC handlings
• Apache modules: mod_php, mod_perl, …

CS5331 Lecture 1 30
Three-tiered Web Applications
SELECT * FROM users
WHERE name = Jason

Request
hello.cgi?name=Jason Name ID Country
Jason 25 SG
Lynn 33 CA
…

Jason’s information

CS5331 Lecture 1 31
PHP
• PHP:
• a free server scripting language
• a powerful tool for making dynamic and interactive Web
pages
• widely used
• Sample PHP page:
<!DOCTYPE html>
<html>
<body>

<?php
echo "My first PHP script!";
?>

</body>
</html>

CS5331 Lecture 1 32
Active HTML
• To reduce server load and increase responsiveness, new
techniques execute code in browsers
• JavaScript, Java Applet
• For example, using JavaScript to validate telephone number
formats
• Ensures telephone numbers in the format of XXX-XXX-XXXX.

CS5331 Lecture 1 33
Phone Number Format Validation
<HTML>
<BODY>
<script type="text/javascript">
function FormValidate()
{
if(document.Form1.PhoneNumber.value.search(/\d{3}\-\d{3}\-\d{4}/)==-1){
alert(“Error: phone # format should be xxx-xxx-xxxx.");
return false;
}
}
</script>
<form name="Form1" onsubmit="return FormValidate()">
<input type="text" size="25" name="PhoneNumber" />
<br /><br />
<input type="submit" value="Submit" />
</form>
</BODY>
</HTML>

CS5331 Lecture 1 34
JavaScript

CS5331 Lecture 1 35
JavaScript
• JavaScript:
• To program the behavior of web pages.
• Make web pages interactive and responsive.
• Some usages:
• Change HTML content:
document.getElementById("demo").innerHTML = Date();
• Change HTML attributes, e.g. change the src (source) attribute of an <img> tag.
• Change HTML Styles (CSS):
document.getElementById("demo").style.fontSize = "35px";
• Hide HTML elements:
document.getElementById("demo").style.display = "none";
• Show HTML elements:
document.getElementById("demo").style.display = "block";
• Read cookies:
var x = document.cookie;
• Navigate to a new place:
window.location = "http://www.mozilla.org";
• Pop up an alert box: window.alert(“Hello world”);
• … (many more)

CS5331 Lecture 1 36
JavaScript
• Ways of introducing JavaScript code:
• Between <script> and </script> tags:
• Inline between <script> and </script>:
<script>alert(1)</script>
• External file using src attribute:
<script src="myScript.js"></script>
• External reference/server using src attribute :
<script src="https://www.w3schools.com/js/myScript1.js">
</script>
The script has privileges of the loading page, not the source server
• HTML event handler:
<button onclick="alert(1)">Click me</button>
• URL (with javascript: pseudo protocol):
<iframe src="javascript:alert(1)">
(Try entering this in your browser’s address bar: javascript:alert(1);)
• Dynamically-evaluated CSS style (on older browsers):
<x style:x:expression(alert(1))>
CS5331 Lecture 1 37
Reading JavaScript

http://jsbeautifier.org/

CS5331 Lecture 1 38
DOM

CS5331 Lecture 1 39
DOM Manipulation

CS5331 Lecture 1 40
Inspecting DOM
using Browser’s Developer Tool
• DOM tree view displays DOM structure of the current
page
• Each DOM node is a page element,
e.g. a header node, paragraph node
• You can live-edit the content and structure of your
pages, but not the source files
https://developers.google.com/web/tools/chrome-devtools/inspect-
styles/edit-dom

CS5331 Lecture 1 41
JavaScript Object Notation (JSON)
• JSON:
• A lightweight data-interchange format (compared to XML) .
• Commonly used for information exchange between the browser and
server.
• Language independent.
• Easy for humans to read and write, easy for machines to parse and
generate.
• Two structures:
• An unordered collection of name/value pairs
(i.e. object, dictionary, or associative array):
{name1=value1, name2=value2, … }.
• An ordered list of values (i.e. array, list, vector, or sequence):
[value1, value2, … ].

CS5331 Lecture 1 42
JavaScript Object Notation (JSON)
• JSON and JavaScript:
• JSON is a string representation of a JavaScript object (hence the name).
• A sample JavaScript object:
var myObj = { "name":“AhBeng", "age":30, "city":“Singapore" };
• Corresponding JSON string representation:
{ "name":“AhBeng", "age":30, "city":“Singapore" }

• Conversions:
• A JavaScript object to JSON text:
var myJSON = JSON.stringify(myObj);
• A JSON text to a JavaScript object:
var myObj = JSON.parse(myJSON);

• PHP functions to handle JSON:

• json_encode(): a PHP object into JSON
• json_decode(): JSON into a PHP object
• Reference: https://www.w3schools.com/js/js_json_intro.asp

CS5331 Lecture 1 43
Frames / Windows
• Each window is a frame
• A frame hosts a web origin
• iFrames: inline frame
• Can host a different site, allowing a mashup
• May be hidden (0px width-ht), no borders, transparent
• Why do we use frames?
• To delegate screen area to content from another origin
• Parent iframe can still work even if a child frame is broken
• Browser provides isolation based on frames
• A frame can access data belonging to its own origin (“principal”)
only: will be discussed more later

CS5331 Lecture 1 44
Frames / Windows

CS5331 Lecture 1 45
Frame Navigation
• Can be “navigated” by
• User typing in the URL bar, user clicks links
• Using scripts

• Note: many modern browsers now implement

“descendant iFrame”
CS5331navigation
Lecture 1 policy 46
Summary
• Learning principles through practice
• Seeing is believing
• Practical skills
• Experience with web technology
• Solutions for your own concerns
• Learn and solve cutting-edge research problems in web
security
• Loaded with programming and system-level tasks (to
get your hand dirty)

CS5331 Lecture 1 47