EN3350 – Software Design

Competition
Communication in Web
Development
Bumuthu Dilshan
BSc(Hons) Electronic & Telecommunication Engineering
 What We Will Cover
▪ Why web applications
▪ Client-server architecture
▪ Application program interface(API)
▪ HTTP/HTTPS
• Overview
• Request/response headers
• URL
▪ API authentication/authorization
• Overview
• Flows
• Best practises
▪ Web API protocols
• Overview
• REST API
• REST API hands-on

2
 Why Web Applications

▪ Accessibility and cross-platform

compatibility
▪ Scalability
▪ Centralized data storage
▪ Improved security
▪ Seamless updates
▪ Integration with cloud services
▪ Adaptability to mobile devices

3
 Client–server Architecture

▪ Client
• The end-user or application
that requests resources or
services from the server
▪ Server
• An application that provides
resources or services to the
client
▪ Communication protocol
• Convention of data transfer
via internet
Client-server architecture for CRUD
(Create-read-update-delete) operations

4
 Application Program Interface (API)
▪ Application Program Interface (API) is a way for two or more computer programs
or components to communicate with each other. It is a type of software interface,
offering a service to other pieces of software.

▪ Web API is an API that can be used to communicate between web components like
client and server over the internet.

5
 HTTP/HTTPS
▪ HTTP stands for HyperText Transfer
Protocol
▪ In OSI layers, HTTP belongs to
Application layer
▪ The major protocol in Application layer
▪ The interface which is accessible for the
applications

▪ HTTPS stands for HyperText Transfer

Protocol Secured
▪ Secured with data encryption using
Secure Sockets Layer (SSL)
▪ Asymmetric method used

6
 What URL is

▪ URL stands for Uniform Resource Locator

▪ DNS servers resolve the domain name with relevant IP address and port
▪ Parameter types
• Path parameters
• Query parameters

7
 HTTP/HTTPS headers

▪ Request headers
• User-Agent
• Cookie
• Authorization
• Host
• Accept
▪ Response headers
• Content-Type
• Content-Length
• Set-Cookie
• Cache-Control

8
 API Authentication/Authorization
API Authentication
▪ The process of securing web applications and services, ensuring that only

authorized users or systems can access protected resources

▪ Tokens can be sent in Authorization header
• API keys
• Bearer token
• JWT
API Authorization
▪ The process of determining what actions an authenticated user or system is

allowed to perform
▪ Tokens can be sent in Authorization header
• OAuth scope
• Role-based access control
9
Authentication Flow

10
 API Authentication Best-Practises
▪ Use proper status code in response
• 200 - OK
• 202 - Accepted
• 400 - Bad request
• 401 - Unauthorized
• 403 - Forbidden
• 404 - Not found
• 405 - Method not allowed
• 500 - Internal server error
• …
▪ Implement token expiry and refresh mechanism
▪ Use HTTPS
▪ Regular audit permissions
▪ Implement MFA

11
 Web API Protocols
▪ Web APIs are used in communication over the internet
▪ The following protocols are mostly used in web APIs.
• REST
• The best-known API protocol.
• Simple due to sending text
• Stateless
• There are well-defined set of requirements to be RESTful.
• SOAP
• Sending XML data
• Stateful
• GraphQL
• Query language with best practises of its use
• Sending text data
• RPC

12
 Representational State Transfer (REST)
▪ Architectural requirements of RESTful API
• Client-server architecture
• Uniform interface
• Statelessness
• Layered system
• Cacheability

▪ Benefits of RESTful APIs

• Simplicity and ease of use
• Scalability
• Reduced latency

13
 REST API Components
▪ Unique Resource Locator (URL)
▪ Methods
• GET
• POST
• PUT
• DELETE
▪ Data
▪ Parameters
• Path parameters
• Query parameters
▪ Request headers

14
REST API Hands-on

15
 Bidirectional Communication
HTTP Polling
▪ Client sends requests periodically

asking whether there are any

updates from server
▪ Latency is high to get updates

▪ Resource utilization is higher

WebSocket
▪ Initiate a connection between

client and server, then server sends

the updates real-time to client
▪ Latency is lower

▪ Resource utilization is optimized

16
Thank You

17