ChatSphere
Live DemoGitHub

ChatSphere Documentation

Overview

ChatSphere is a real-time chat application with advanced features including:

  • Secure face recognition authentication
  • Speech-to-text message input
  • Group chat functionality
  • Real-time messaging with WebSockets

Authentication

ChatSphere uses facial recognition for secure authentication. Users register with their email, password, and a facial scan which is used for subsequent logins.

Registration Flow

  1. User enters email, name, and password
  2. User captures facial image via webcam
  3. System stores facial data securely
  4. Account is created

Login Flow

  1. User enters email and password
  2. User captures facial image via webcam
  3. System compares with stored facial data
  4. Access granted if match is successful

Features

Real-Time Chat

Messages are delivered instantly using WebSocket technology. The application maintains persistent connections for low-latency communication.


const socket = new WebSocket('ws://socketserver-production-7cc8.up.railway.app/ws');

Speech-to-Text

Users can dictate messages which are converted to text using google Speech Recognition API.

Group Chats

Users can create and manage group conversations with multiple participants.

  • Create groups with custom names
  • Add/remove participants (Not implemented)
  • Admin controls for group owners (Not implemented)
  • Message history persistence

API Reference

POST /api/auth/register

Register a new user account

Request Body

{
  "email": "user@example.com",
  "name": "John Doe",
  "password": "securepassword123",
  "faceImage": "base64encodedimage"
}
POST /api/auth/login

Authenticate an existing user

Request Body

{
  "email": "user@example.com",
  "password": "securepassword123",
  "faceImage": "base64encodedimage"
}

Getting Started

Prerequisites

Before running ChatSphere, you'll need to set up the following services:

1. AWS Rekognition Setup

  1. Create an AWS account at aws.amazon.com
  2. Navigate to IAM and create a new user with Rekognition access
  3. Save the AWS access key and secret key
  4. Enable Rekognition service in your AWS console
# Add to your .env file
AWS_ACCESS_KEY_ID=your_access_key
AWS_SECRET_ACCESS_KEY=your_secret_key
AWS_REGION=your_region

2. Google Cloud Platform Setup

  1. Create a GCP account at console.cloud.google.com
  2. Create a new project
  3. Navigate to IAM & Admin Service Accounts
  4. Create a new service account and download the JSON key file
# Save the service account JSON as
gcp-service-account.json

3. Deploy Speech-to-Text Service

  1. Navigate to the speech-to-text folder
  2. Deploy to GCP Cloud Functions using gcloud CLI
  3. Copy the deployed function URL
$ cd speech-to-text
$ gcloud functions deploy speechToText \
  --runtime nodejs18 \
  --trigger-http \
  --allow-unauthenticated

4. Deploy WebSocket Server

  1. Build Docker image for WebSocket server
  2. Deploy to GCP Container Service
$ cd socket-server
$ docker build -t websocket-server docker-compose up -d
$ docker build -t websocket-server OR
$ docker build -t websocket-server .
$ docker tag websocket-server gcr.io/[PROJECT-ID]/websocket-server
$ docker push gcr.io/[PROJECT-ID]/websocket-server
$ gcloud run deploy websocket-server \
  --image gcr.io/[PROJECT-ID]/websocket-server \
  --platform managed

Local Development

After setting up all services, follow these steps to run ChatSphere locally:

  1. Clone the repository
  2. Install dependencies
  3. Set up environment variables
  4. Run the development server
$ git clone https://github.com/swarnikaraj/chatshpere.git
$ cd gui
$ cp example.env .env
# Update .env with your service URLs and credentials
$ npm install
$ npm run dev

Important Environment Variables

NEXT_PUBLIC_WEBSOCKET_URL=your_websocket_url
NEXT_PUBLIC_SPEECH_TO_TEXT_URL=your_speech_to_text_url
AWS_ACCESS_KEY_ID=your_aws_access_key
AWS_SECRET_ACCESS_KEY=your_aws_secret_key
GCP_PROJECT_ID=your_gcp_project_id