Topic 2

Web Application Technologies

Objectives
• To examine the HTTP protocol
• To collect and monitor HTTP traffic
• To intercept and temper with HTTP request and response
messages
• To understand the HTTP encoding scheme

2
TCP/IP and HTTP/S

Fiberbit.com.tw. (2013). TCP/IP model vs OSI model -. [online] Available at: http://fiberbit.com.tw/tcpip-model-vs-osi-model/

3
TCP/IP and HTTP/S

4
The HTTP Protocol
• It is the core communications protocol used to access the WWW
and is used by all of today’s web applications.
• It uses a message-based model in which a client sends a request
message and the server returns a response message.
• All HTTP messages (requests and responses) consist of one or
more headers, each on a separate line, followed by a mandatory
blank line, followed by an optional message body.
• No session formed, nothing remembered--no "state"

5
HTTP Request/Response Header

6
HTTP Request Header

7
HTTP Request Header

1
2

3
4
5

6
7
8
9

8
HTTP Request Header

• The HTTP method:

• GET to retrieve a resource from the web server. GET requests do not have a
message body.
• POST to request the web server to accept the data enclosed in the body of the
request message
• The requested URL: the name of the resource being requested,
together with an optional query string containing parameters that the
client is passing to that resource.
• The HTTP version being used.
• The only HTTP versions are 1.0 and 1.1,
• most browsers use version 1.1 by default.
• In version 1.1 the Host request header is mandatory.
9
HTTP Request Header

• Accept: Media type(s) that is(/are) acceptable for the response. See Content
negotiation.
• Referer: is used to indicate the URL from which the request originated
• Accept-Language: List of acceptable human languages for response.
See Content negotiation.
• User-Agent: is used to provide information about the browser or other
client software that generated the request.
10
HTTP Request Header

• Accept-Encoding: list of acceptable encodings. See HTTP compression.

• Host: specifies the hostname that appeared in the full URL being accessed.
• Connection: control options for the current connection.
• Cookie: is used to submit additional parameters that the server has issued
to the client.
• Note: see full list of HTTP header fields in Wikipedia

11
HTTP Methods: GET
• GET retrieves resources
• Can send parameters in the URL query string
• Users can bookmark the whole URL
• Whole URL may appear in server logs and in Referer headers
• Also on the browser's screen
• Don't put sensitive information in the query string
HTTP Methods: POST
• POST performs actions
• Request parameters can be in URL query strong and in the body
of the message
• Parameters in body aren't saved in bookmarks or most server logs
• A better place for sensitive data
HTTP Methods: POST
• POST requests perform actions, like buying something
• Clicking the browser's Back button displays a box like this
HTTP Response Header

15
HTTP Response Header
• The first line
• The HTTP version being used.
• A numeric status code indicating the result of the request. 200 is the
most common status code; it means that the request was successful and
that the requested resource is being returned.
• A textual “reason phrase” further describing the status of the response.
This can have any value and is not used for any purpose by current
browsers.

16
HTTP Response Header
• The Server header contains a banner indicating the web server software
being used, and sometimes other details such as installed modules and the
server operating system.
• The Set-Cookie header issues the browser a further cookie; this is submitted
back in the Cookie header of subsequent requests to this server.
• The Pragma header instructs the browser not to store the response in its
cache. The Expires header indicates that the response content expired in the
past and therefore should not be cached.
• The Content-Type header indicates that the body of this message contains an
HTML document.
• The Content-Length header indicates the length of the message body in
bytes.
• Almost all HTTP responses contain a message body following the blank line
after the headers.
17
Other HTTP Methods
• HEAD returns only the header, not the body
• Can be used to check if a resource is available before GETing it
• OPTIONS shows allowed methods
• PUT uploads to server (usually disabled)
Status Codes Groups
Important Status Codes
• 200 OK - request succeeded, response body contains result
• 301 Moved Permanently - redirects the browser, client should
use new URL in the future
• 302 Found - redirects browser temporarily. Client should revert
to original URL in subsequent requests
• 304 Not Modified - browser should use cached copy of resource
Important Status Codes
• 400 Bad Request - invalid HTTP request
• 401 Unauthorized - Server requires HTTP authentication.
• WWW-Authenticate header specifies the type(s) of authentication
supported
• 403 Forbidden - no one is allowed to access resource, regardless
of authentication
• 404 Not Found - requested resource does not exist
• 500 Internal Server Error - unhanded exception in an app, such
as a PHP error
HTTPS
• HTTP over SSL (Secure Sockets Layer)
• Actually now TLS (Transaction Layer Security)
• All versions of SSL are deprecated
• Protects data with encryption
• Protects data in motion, but not at rest or in use
How the HTTPS Works?

23
HTTP Proxies
• An HTTP proxy is a server that mediates access between the
client browser and the destination web server.
• When a browser has been configured to use a proxy server, it
makes all its requests to that server.
• The proxy relays the requests to the relevant web servers and
forwards their responses back to the browser.
• Proxies may provide caching, authentication, and access control

24
HTTP Proxies

25
Server-Side Functions
1) Querying the database
Java
Platform

2) Operations over databases ASP.NET

3) Access/Write a file on server.

4) Interact with other servers.
5) Structure web applications. XML PHP

6) Process user input. For example if user SQL

input is a text in search box, run a search
algorithm on data stored on server and
send the results.

26
JSP
• Java Server Pages (JSP) is a server-side programming
technology that enables the creation of dynamic, platform-
independent method for building Web-based applications. JSP
have access to the entire family of Java APIs, including the JDBC
API to access enterprise databases. Standard for large-scale
enterprise applications
• Lends itself to multitiered and load-balanced architectures
• Well-suited to modular development and code reuse
• Runs on Windows, Linux, and Solaris

JSP Tutorial (tutorialspoint.com) 27

Perl
• Perl is a general-purpose programming language originally developed
for text manipulation and now used for a wide range of tasks including
system administration, web development, network programming, GUI
development, and more.
• Perls database integration interface DBI supports third-party
databases including Oracle, Sybase, Postgres, MySQL and others.
• Perl works with HTML, XML, and other mark-up languages.
• Perl supports Unicode.
• Perl supports both procedural and object-oriented programming.

Perl - Introduction (tutorialspoint.com) 28

PHP
• The PHP Hypertext Preprocessor (PHP) is a programming
language that allows web developers to create dynamic content
that interacts with databases. PHP is basically used for
developing web based software applications. PHP is a server side
scripting language that is embedded in HTML.
• It is used to manage dynamic content, databases, session
tracking, even build entire e-commerce sites.
• It is integrated with a number of popular databases, including
MySQL, PostgreSQL, Oracle, Sybase, Informix, and Microsoft SQL
Server.
• PHP supports a large number of major protocols such as POP3,
IMAP, and LDAP.
PHP Tutorial (tutorialspoint.com) 29
ASP.NET
• ASP.NET is an open-source web framework, created by Microsoft,
for building modern web apps and services with .NET. ASP.NET is
cross platform and runs on Windows, Linux, macOS, and Docker.
• ASP stands for Active Server Pages

30
Ruby
• Simple and productive server-side scripting language. Ruby, an
object-oriented language, can help new and expert programmers
write code faster. Ruby features functional programming
elements and syntax like Python and Perl.

31
Node.js
• Node.js is a server-side scripting language and a runtime environment.
• Node.js is quite easy to start with. It’s a go-to choice for web development
beginners. With a lot of tutorials and a large community
• It provides vast scalability for applications. Node.js, being single-threaded, is
capable of handling a huge number of simultaneous connections with high
throughput.
• Non-blocking thread execution makes Node.js even faster and more efficient.
• Node.js is written in C and C++, which makes it speedy and adds features like
networking support.
• Cross-platform support allows you to create SaaS websites, desktop apps,
and even mobile apps, all using Node.js.

32
 Python
• Python can run on any operating system as a • Django:
server-side language. • A high-level, batteries-included web
framework.
• Web development in Python is a versatile and • Follows the "don't repeat yourself" (DRY) and
"convention over configuration" principles.
popular choice for building dynamic websites • Comes with an ORM (Object-Relational
and web applications. Mapping), templating engine, and an admin
interface.
• Python provides a robust ecosystem of • Excellent for building robust, feature-rich web
frameworks, libraries, and tools that simplify the applications quickly.
development process and enable developers to • Flask:
create scalable and efficient web solutions • A lightweight and flexible micro-framework.
• Gives developers more control over
• These frameworks cater to a range of components, allowing them to choose their
preferences and project requirements, from full- preferred tools and libraries.
• Suitable for small to medium-sized projects
stack frameworks like Django to micro- and applications where simplicity and
frameworks like Flask and Bottle. customization are priorities.

• The choice depends on factors such as project

size, complexity, developer preference, and
specific feature requirements. 33
Client-Side Functions
1) Interact with temporary storage
2) Make interactive web pages
3) Interact with local storage
4) Sending request for data to server
5) Send request to server
6) work as an interface between server and user

34
JavaScript
• JavaScript (js) is a light-weight object-oriented programming
language which is used by several websites for scripting the
webpages. It is an interpreted, full-fledged programming
language that enables dynamic interactivity on websites when
applied to an HTML document.
• Javascript is the most popular programming language in the
world and that makes it a programmer’s great choice. Once you
learnt Javascript, it helps you developing great front-end as well
as back-end software using different Javascript based
frameworks like jQuery, Node.JS etc.

35
AJAX
• AJAX stands for Asynchronous JavaScript and XML.
• AJAX is a new technique for creating better, faster, and more
interactive web applications with the help of XML, HTML, CSS, and
Java Script.
• Ajax uses XHTML for content, CSS for presentation, along with
Document Object Model and JavaScript for dynamic content
display.
• AJAX is a web browser technology independent of web server
software.

36
More about AJAX
• AJAX allows web pages to be updated asynchronously by
exchanging small amounts of data with the server behind the
scenes. This means that it is possible to update parts of a web
page, without reloading the whole page.
• Classic web pages, (which do not use AJAX) must reload the
entire page if the content should change.
• Examples of applications using AJAX: Google Maps, Gmail,
Youtube, and Facebook tabs.

37
How AJAX Works
• 1. An event occurs in a web page (the page
is loaded, a button is clicked)
• 2. An XMLHttpRequest object is created by
JavaScript
• 3. The XMLHttpRequest object sends a
request to a web server
• 4. The server processes the request
• 5. The server sends a response back to the
web page
• 6. The response is read by JavaScript
• 7. Proper action (like page update) is
performed by JavaScript

38
XML
• XML (Extensible Markup Language) is used to describe data.
• The XML standard is a flexible way to create information formats
and electronically share structured data via the public internet,
as well as via corporate networks.
• XML's primary function is to create formats for data that is used
to encode information for documentation, database records,
transactions and many other types of data.
• XML data may be used for creating different content types that
are generated by building dissimilar types of content.
XML Essentials - W3C
39
Sample of an XML file

40
SOAP
• SOAP is the short form of Simple Object Access Protocol.
• It uses XML messaging syntax to exchange information among
computers via internet.
• SOAP can extend HTTP for XML messaging.
• It provides data transport for web services. It can exchange
complete documents or call remote procedure. It can be used to
broadcast a message.
• SOAP is platform and language independent.
• SOAP is not tied to any particular transport protocol.
SOAP
• As an example,
• An application can send a SOAP request to
a server that has web services enabled—
such as a real-estate price database—with
the parameters for a search.
• The server then returns a SOAP response
with the resulting data, Since the generated
data comes in a standardized machine-
parsable format, the requesting application
can then integrate it directly.
Web Services and SOAP (Simple Object
Access Protocol)
• SOAP uses HTTP and XML to exchange data
 JSON - JavaScript Object Notation
• Client-side JavaScript uses the XMLHttpRequest API to request
data from a server
• JSON is lightweight data-interchange format.
• JSON is easy to read and write than XML.
• JSON is language independent.
• JSON supports array, object, string, number and values

In JSON, data is represented in key-value pairs, and curly

braces hold objects, where a colon is followed after each
name. The comma is used to separate key-value pairs.
Square brackets are used to hold arrays, where each
value is comma-separated.
Same-Origin Policy
• Prevents content from different origins interfering with each
other in a browser
• Content from one website can only read and modify data from the
same website
• Ex: scripts on Facebook can't read or write to data on your online banking
page
• When this process fails, you get Cross-Site Scripting, Cross-Site
Request Forgery, and other attacks
URL Encoding
• Also known as percent-encoding, is a
method to encode arbitrary data in a URL
using only the limited US-ASCII characters.
• URLs may contain only printable ASCII
characters
• To transfer other characters, or
problematic ASCII characters, over HTTP,
they must be URL- encoded

What is HTTP request smuggling? Tutorial & Examples | Web Security Academy
(portswigger.net)
References
• Stuttard, Dafydd, and Marcus Pinto. Web Application Hacker's Handbook : Finding and
Exploiting Security Flaws, Wiley, 2011.

47