Enterprise Real-time Customer Support System with AI & WebRTC Audio Integration

Open

Project Description

This project is a full-stack, enterprise-grade real-time customer support platform designed to seamlessly integrate automated AI assistance with human operator handovers. The system dynamically tracks customer sessions and allows live operators to monitor, take over conversations, and communicate with customers through both instant text messaging and high-quality peer-to-peer (WebRTC) audio calls.

The core objective of this application is to scale support operations efficiently—letting an AI Bot handle preliminary queries while providing human agents with a unified dashboard to step in instantly for complex inquiries or direct voice consultations.

System Requirements & Technical Features

1. Functional Requirements

Dynamic Session Management: Real-time tracking of active user sessions with visual status indicators (AI Bot Mode, Agent Requested, and Human Agent Mode).

Dual Communication Channels:

Interactive Text Chat: Real-time AJAX messaging engine with support for file and image attachments.

WebRTC Audio Calling: Direct browser-to-browser voice calling powered by the PeerJS library.

Unified Operator Console: A single-page dashboard allowing agents to filter, search, monitor, and respond to multiple user sessions concurrently.

Data Sanitization & Robust Parsing: Built-in response parsing (parseCleanData) to sanitize raw server outputs and prevent JSON breakages caused by unexpected hosting headers.

2. Non-Functional Requirements

Responsive User Interface: Mobile-first layout adaptations using custom media queries to ensure smooth operation across smartphones, tablets, and desktops.

Low-Latency Signaling: Integration of public Google STUN and TURN relay servers (Metered.ca) to bypass NAT/firewall restrictions during voice calls.

Automated Synchronization: Background heartbeat intervals (15 seconds) and polling mechanisms (5 seconds) to maintain connection state and operator registration.

Technology Stack

Frontend: HTML5, CSS3, Bootstrap 5, FontAwesome 6

Client-Side Scripting: JavaScript (ES6+), jQuery, PeerJS (WebRTC)

Backend API Engine: PHP (api_engine.php)

Database / Server Management: MySQL / PHP Session Storage

Voice Signaling Infrastructure: PeerJS Server with STUN/TURN Relays

Project Links:
https://livechat-site.great-site.net/operator.php
https://livechat-site.great-site.net/index.php

Skills Required

Interested in this project?

Login as a freelancer to submit your proposal and start earning