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
