Real-Time Courier/Order Tracking on Your Website

Real-Time Courier/Order Tracking on Your Website

A user placed an order and is waiting for the courier. The "My Orders" page with a "status: in transit" field is last century. The modern standard is a map with a live courier marker and a countdown "arrives in N minutes". Technically, this is a combination of three components: the courier's mobile app/device, the backend application, and the client browser. We have built such systems for 30+ delivery projects — from local services to federal networks. Contact us for a project estimate.

Why Polling is Inefficient: WebSocket vs Polling

Polling the server every 5 seconds creates unnecessary load and delays. WebSocket is 100x more efficient — events arrive instantly with no polling overhead. However, a simple WebSocket implementation without authorization opens access to other people's orders. We use PrivateChannel from Laravel Broadcasting with permission checks.

Architecture Overview

[Courier Device] GPS → POST /api/courier/location every 3–5s ↓ [Backend] Save to Redis (TTL 60s) Publish to Redis Pub/Sub channel order:{id} ↓ [WebSocket Server (Laravel Reverb / Pusher)] Broadcast event LocationUpdated ↓ [Client Browser] Update marker on map 

Geopositions are not stored in PostgreSQL with every update — that would be 720 records per hour per courier. We write to the database only on order status changes and the final position upon completion. Current position stays in Redis with TTL.

Why Redis Beats PostgreSQL for Geodata

Redis provides write/read latency under 1ms and automatic cleanup via TTL. Constant PostgreSQL writes would cost $500/month more in server resources. With Redis, we save up to 40% on infrastructure costs. Getting the current position is a single in-memory request.

Database Schema

CREATE TABLE delivery_orders ( id BIGSERIAL PRIMARY KEY, user_id BIGINT NOT NULL REFERENCES users(id), courier_id BIGINT REFERENCES couriers(id), status VARCHAR(50) NOT NULL DEFAULT 'pending', -- pending | assigned | picked_up | in_transit | delivered | failed address_lat DECIMAL(10, 8), address_lng DECIMAL(11, 8), address_text VARCHAR(500), estimated_at TIMESTAMP, delivered_at TIMESTAMP, created_at TIMESTAMP NOT NULL DEFAULT NOW() ); CREATE TABLE delivery_status_log ( id BIGSERIAL PRIMARY KEY, order_id BIGINT NOT NULL REFERENCES delivery_orders(id), status VARCHAR(50) NOT NULL, lat DECIMAL(10, 8), lng DECIMAL(11, 8), note TEXT, created_at TIMESTAMP NOT NULL DEFAULT NOW() ); 

Courier API and Broadcasting

class CourierLocationController extends Controller { public function update(Request $request, DeliveryOrder $order): JsonResponse { $data = $request->validate([ 'lat' => 'required|numeric|between:-90,90', 'lng' => 'required|numeric|between:-180,180', ]); $key = "courier_location:{$order->courier_id}"; Redis::setex($key, 60, json_encode([ 'lat' => $data['lat'], 'lng' => $data['lng'], 'order_id' => $order->id, 'ts' => now()->timestamp, ])); broadcast(new CourierLocationUpdated( orderId: $order->id, lat: $data['lat'], lng: $data['lng'], eta: $this->calculateEta($order, $data['lat'], $data['lng']), )); return response()->json(['ok' => true]); } private function calculateEta(DeliveryOrder $order, float $lat, float $lng): ?int { $distanceKm = $this->haversineKm($lat, $lng, $order->address_lat, $order->address_lng); return (int) round($distanceKm / 30 * 60); } } // CourierLocationUpdated event class CourierLocationUpdated implements ShouldBroadcast { use Dispatchable, InteractsWithSockets, SerializesModels; public function __construct( public readonly int $orderId, public readonly float $lat, public readonly float $lng, public readonly ?int $eta, ) {} public function broadcastOn(): Channel { return new PrivateChannel("order.{$this->orderId}"); } public function broadcastWith(): array { return [ 'lat' => $this->lat, 'lng' => $this->lng, 'eta' => $this->eta, ]; } } 

Channel authorization in routes/channels.php:

Broadcast::channel('order.{orderId}', function (User $user, int $orderId) { return $user->id === DeliveryOrder::find($orderId)?->user_id; }); 

The PrivateChannel ensures only the order owner receives coordinates. This is a mandatory security requirement.

Client-Side: Map and Marker Animation

We use Mapbox to display the map. An alternative is Yandex.Maps, preferred for CIS countries.

import mapboxgl from 'mapbox-gl'; // ... map initialization Echo.private(`order.${orderId}`) .listen('CourierLocationUpdated', ({ lat, lng, eta }) => { animateMarker(courierMarker, courierMarker.getLngLat().toArray(), [lng, lat]); if (eta !== null) { document.getElementById('eta').textContent = eta < 2 ? 'Courier is nearby' : `Arrives in ~${eta} min`; } }); function animateMarker(marker, from, to, duration = 500) { const start = performance.now(); function step(now) { const t = Math.min((now - start) / duration, 1); const ease = t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t; const lng = from[0] + (to[0] - from[0]) * ease; const lat = from[1] + (to[1] - from[1]) * ease; marker.setLngLat([lng, lat]); if (t < 1) requestAnimationFrame(step); } requestAnimationFrame(step); } 

Comparison Tables

Private Channel Setup in 5 Steps

1. Install Laravel Reverb or Pusher.
2. Configure broadcasting in config/broadcasting.php.
3. Create an Event implementing ShouldBroadcast.
4. Define a PrivateChannel in routes/channels.php.
5. Subscribe to the channel on the client using Echo.

What's Included

• Analysis: integration with the courier's mobile app, protocol agreement.
• Design: data schema, WebSocket architecture, authorization.
• Implementation: backend on Laravel with Redis, broadcast, frontend map.
• Testing: load testing of WebSocket (1k+ concurrent connections).
• Documentation: API description, deployment instructions.
• Support: code warranty, team training.

Estimated Timelines

• Basic tracking (Redis + broadcast + map): 4 to 5 days.
• Private Channel authorization + access logic: 1 day.
• ETA calculation via straight-line (Haversine): 0.5 day.
• ETA via Routing API: 1 to 2 days.
• Marker animation + path smoothing: 1 day.
• Push notifications on status change: 1 to 2 days.
• Admin dispatcher panel: 3 to 4 days.

Why Order From Us

We have implemented real-time tracking for 30+ projects, including large delivery services. We guarantee stable WebSocket connections with thousands of couriers, channel privacy, and smooth animation without jitter. Request a project estimate — we'll offer the optimal solution.