A captive portal is a complex system with multiple interconnected components. Understanding its anatomy helps administrators design, troubleshoot, and optimize WiFi authentication systems effectively.
System Architecture Overview
┌─────────────────────────────────────────────────────────────┐
│ Captive Portal System │
├─────────────┬─────────────┬─────────────┬─────────────────────┤
│ User │ Access │ Network │ Authentication │
│ Device │ Point │ Layer │ Layer │
├─────────────┼─────────────┼─────────────┼─────────────────────┤
│ WiFi Client │ AP/Router │ Firewall │ Portal Server │
│ Browser │ DHCP Server │ DNS Server │ Database │
│ MAC Address │ VLAN │ ACL Rules │ Session Manager │
└─────────────┴─────────────┴─────────────┴─────────────────────┘Component 1: User Device
What It Is
The endpoint device requesting internet access: smartphone, laptop, tablet, or IoT device.
Key Functions
-
WiFi radio: Connects to SSID (2.4GHz/5GHz)
-
DHCP client: Requests IP address from network
-
Browser: Sends HTTP/HTTPS requests
-
MAC address: Unique hardware identifier (00:1A:2B:3C:4D:5E)
Authentication Data
-
IP address: Assigned by DHCP (192.168.1.105)
-
MAC address: Bound to session for security
-
User credentials: Email, password, or OAuth token
Component 2: Access Point (AP)
What It Is
The wireless hardware that broadcasts the SSID and connects devices to the network.
Key Functions
Technical Specifications
-
Radio frequency: 2.4GHz (longer range, slower) vs 5GHz (shorter range, faster)
-
Channels: 2.4GHz (1, 6, 11 non-overlapping); 5GHz (36, 40, 44, 48)
-
Max throughput: 300 Mbps (2.4GHz) vs 1.3 Gbps (5GHz)
-
User capacity: 50–500 concurrent devices
Component 3: DHCP Server
What It Is
Dynamic Host Configuration Protocol server that assigns IP addresses to connecting devices.
Key Functions
DHCP Process (4-Step)
1. DISCOVER: Client → "I need IP" (broadcast)
2. OFFER: DHCP Server → "Here's 192.168.1.105"
3. REQUEST: Client → "I accept 192.168.1.105"
4. ACK: DHCP Server → "Confirmed, 192.168.1.105 assigned"DHCP Packet Structure
Operation: DHCPACK
Your IP: 192.168.1.105
Your MAC: 00:1A:2B:3C:4D:5E
DHCP Server: 192.168.1.1
DNS Server: 192.168.1.1
Gateway: 192.168.1.1
Lease Time: 86400 seconds (24 hours)Component 4: Firewall/Router Layer
What It Is
The network device that enforces access control, traffic interception, and policy enforcement.
Key Functions
Access Control List (ACL) Rules
Rule 1: ALL → Internet = BLOCK (default deny)
Rule 2: HTTP → Captive Portal = ALLOW (port 80)
Rule 3: HTTPS → Any = ALLOW (port 443, authenticated)
Rule 4: DNS → Any = ALLOW (port 53)
Rule 5: DHCP → Any = ALLOW (port 67/68)Port Redirection Logic
IF packet.port == 80 (HTTP) AND user.authenticated == FALSE
THEN redirect_to = captive_portal_ip:80
ELSE allow_directComponent 5: DNS Server
What It Is
Domain Name System server that translates website names to IP addresses.
Key Functions
DNS Packet Flow
Client → DNS Query: "google.com" → DNS Server (192.168.1.1)
DNS Server → DNS Response: "142.250.80.46" → Client
Client → HTTP Request: "142.250.80.46" → Firewall → BLOCKEDDNS Hijacking for Captive Portal
If domain == ANY AND user.authenticated == FALSE
THEN redirect_to = captive_portal_ipComponent 6: Captive Portal Server
What It Is
The web server hosting the login page and handling authentication logic.
Key Functions
Web Technologies Used
-
HTML: Page structure (login form, buttons)
-
CSS: Styling (colors, logo placement)
-
JavaScript: Interactive elements (social login buttons)
-
PHP/Python: Backend logic (authentication, session management)
-
Database: MySQL, PostgreSQL, or MongoDB
Portal Page Structure
<!DOCTYPE html>
<html>
<head>
<title>Welcome to CafeWiFi</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="header">
<img src="logo.png" alt="Cafe Logo">
<h1>Login to Free WiFi</h1>
</div>
<form action="/login" method="POST">
<input type="email" name="email" placeholder="Enter Email">
<button type="submit">Connect</button>
</form>
<div class="social-login">
<button onclick="facebookLogin()">Login with Facebook</button>
<button onclick="googleLogin()">Login with Google</button>
</div>
</body>
</html>Component 7: Database
What It Is
Structured storage for user data, sessions, and authentication records.
Key Tables
Users Table
user_id | email | mac_address | created_at | source
--------|----------------|----------------|--------------|------------
1001 | john@email.com | 00:1A:2B:3C | 2026-01-15 | email_login
1002 | jane@email.com | 00:2B:3C:4D | 2026-01-15 | facebookSessions Table
session_id | user_id | ip_address | start_time | expiration | status
-----------|---------|----------------|--------------|------------|--------
5001 | 1001 | 192.168.1.105 | 14:30:00 | 15:30:00 | active
5002 | 1002 | 192.168.1.106 | 14:35:00 | 15:35:00 | expiredVouchers Table
voucher_id | code | duration | used_count | max_uses | status
-----------|------------|----------|------------|----------|--------
3001 | ABC12345 | 24 hours | 0 | 5 | active
3002 | XYZ67890 | 1 hour | 3 | 5 | activeDatabase Functions
-
User registration: INSERT new email credentials
-
Session creation: INSERT session with start time + expiration
-
Session validation: SELECT session WHERE user_id = X AND expiration > NOW()
-
Session cleanup: DELETE session WHERE expiration < NOW()
Component 8: Session Manager
What It Is
Logic that tracks active user sessions, enforces time limits, and auto-disconnects expired users.
Key Functions
Session Lifecycle
1. User authenticates → Session created (start_time = NOW, expiration = NOW + 1 hour)
2. Session active → User has internet access
3. Timer counts down → 60 minutes remaining → 59 minutes → ... → 0 minutes
4. Expiration reached → Session marked expired → ACL entry removed
5. User loses internet → Must re-authenticate for new sessionSession Table Record Example
Session ID: 5001
User ID: 1001
MAC Address: 00:1A:2B:3C:4D:5E
IP Address: 192.168.1.105
Start Time: 2026-01-15 14:30:00
Expiration: 2026-01-15 15:30:00
Status: active
Bandwidth Limit: 5 MbpsComponent 9: Authentication Services
What They Are
External systems that validate user credentials (email database, social APIs, voucher systems).
Types of Authentication
1. Email Authentication
User → Enter Email → POST /login → Database Check
Database → SELECT email FROM users WHERE email = 'john@email.com'
Database → "Not found" → INSERT new user → Create session → Grant access2. Social Login (OAuth 2.0)
User → Click "Login with Facebook" → Redirect to Facebook OAuth
Facebook → User authenticates → Return access_token to portal
Portal → Exchange access_token for user_data (name, email, location)
Portal → INSERT user_data to database → Create session → Grant access3. Password/Voucher
User → Enter Voucher Code → POST /voucher → Database Check
Database → SELECT voucher WHERE code = 'ABC12345'
Database → "Valid" AND used_count < max_uses → Increment used_count → Create sessionComponent 10: Analytics & Reporting
What It Is
Dashboard that tracks user activity, engagement metrics, and network performance.
Key Metrics Tracked
Analytics Dashboard Example
┌─────────────────────────────────────────────────────┐
│ WiFi Analytics Dashboard │
├─────────────────────────────────────────────────────┤
│ Total Logins Today: 127 users │
│ Active Sessions: 43 users │
│ Average Session Duration: 47 minutes │
│ Top Authentication: Facebook (65%) │
│ Geolocation: Nairobi (78%), Mombasa (12%) │
│ Peak Hour: 2:00 PM – 4:00 PM (67 users) │
└─────────────────────────────────────────────────────┘Component Interactions: Data Flow
User Device
↓ (WiFi connection)
Access Point (SSID, WPA2, VLAN)
↓ (DHCP request)
DHCP Server (IP, DNS, Gateway)
↓ (HTTP request to google.com)
Firewall (BLOCK → REDIRECT to portal)
↓ (HTTP redirect)
Captive Portal Server (HTML page)
↓ (User enters email)
Database (INSERT user, CREATE session)
↓ (Session created)
Firewall (UPDATE ACL → ALLOW internet)
↓ (Internet access granted)
User Device (browse freely)Bottom Line
The captive portal anatomy consists of 10 interconnected components: user device, access point, DHCP server, firewall, DNS server, portal server, database, session manager, authentication services, and analytics. Each component has specific functions that work together to intercept traffic, authenticate users, create sessions, and grant internet access. Understanding this architecture enables administrators to design robust WiFi systems, troubleshoot issues, and optimize performance.