lan-chat

πŸš€ LAN Chat Messenger - Complete Setup Guide

A modern, real-time messaging application for local area networks with text chat, voice messages, file sharing, and more!


✨ Features

Feature Status
πŸ’¬ Text Messaging βœ…
πŸ”’ Private 1:1 Chat βœ…
πŸ“’ Channels with Password βœ…
🎀 Voice Messages βœ… (HTTPS)
πŸ“ File Upload (100MB) βœ…
πŸ–ΌοΈ Image/Video Preview βœ…
πŸ‘₯ Real-time User List βœ…
πŸ“± Mobile Responsive UI βœ…
πŸŒ™ Dark Theme βœ…
πŸ’Ύ Message History βœ…
πŸ” HTTPS Support βœ…

πŸ”§ Installation Steps

1️⃣ Install Dependencies

npm install
npm install express socket.io express-fileupload

2️⃣ Generate SSL Certificates (For HTTPS & Voice Messages)

Generate self-signed certificate:

openssl req -x509 -newkey rsa:2048 -nodes -keyout key.pem -out cert.pem -days 365

During certificate generation, press Enter for all questions or fill in:

3️⃣ File Structure

my-lan-chat/
β”œβ”€β”€ server.js              # Backend server
β”œβ”€β”€ index.html             # Frontend client
β”œβ”€β”€ package.json           # Dependencies
β”œβ”€β”€ key.pem               # SSL key (generated)
β”œβ”€β”€ cert.pem              # SSL certificate (generated)
└── public/
    └── uploads/          # File uploads (auto-created)

▢️ Running the Server

node server.js

If key.pem and cert.pem exist, the server automatically runs in HTTPS mode with all features enabled.

HTTP Mode (Limited)

If SSL certificates don’t exist, HTTP mode runs automatically:


🌐 Accessing the Chat

After starting the server, you’ll see:

============================================================
πŸš€ LAN MESSENGER SERVER STARTED
============================================================
πŸ“‘ Protocol: HTTPS
πŸ”Œ Port: 3000
============================================================

🌐 ACCESS FROM:

   πŸ“± This device: https://localhost:3000
   🌍 Network (Wi-Fi): https://192.168.1.100:3000
   🌍 Network (Ethernet): https://192.168.0.50:3000

============================================================
βœ… HTTPS ENABLED - All features available!
============================================================

Connect from:

⚠️ SSL Certificate Warning

When visiting HTTPS URL for the first time, your browser shows a security warning. This is normal and safe for self-signed certificates!

How to proceed:


πŸ§ͺ Testing the Features

1. Text Messaging

  1. Login as two different users
  2. Type a message in General channel
  3. Message appears instantly on all clients

2. Private Chat

  1. Login as β€œAlice” and β€œBob” on different devices
  2. Alice clicks β€œBob” in ONLINE USERS section
  3. Type a private message
  4. Only Bob sees the message
  5. Bob can reply and chat with Alice

3. Create Password-Protected Channel

  1. Click + next to CHANNELS
  2. Enter channel name (e.g., β€œmarketing”)
  3. Enter optional password
  4. Channel appears for all users immediately
  5. Users need password to join

4. Voice Message Recording

  1. Must be on HTTPS (not HTTP)
  2. Open any chat
  3. Press and HOLD the microphone button 🎀
  4. Speak your message (minimum 500ms)
  5. Release to upload
  6. Voice message appears as audio player
  7. Others can play and hear your message

5. File Upload

  1. Click attachment icon πŸ“Ž
  2. Select file (image, video, audio, document)
  3. Maximum 100MB
  4. File uploads and appears as:
    • Image: Preview thumbnail
    • Video: Playable video
    • Audio: Audio player
    • Other: Download link

6. User List Updates

  1. User A joins chat
  2. User B immediately sees User A in ONLINE USERS
  3. User A goes offline
  4. User A immediately disappears from list
  5. Notification message appears in General channel

πŸ“± Mobile Features

βœ… Fully Responsive Design

βœ… Mobile-Specific Features


🎯 How It Works

Architecture

β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”
β”‚                   Browser (Client)               β”‚
β”‚  β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”   β”‚
β”‚  β”‚  HTML/CSS/JavaScript UI                   β”‚   β”‚
β”‚  β”‚  - Real-time message display              β”‚   β”‚
β”‚  β”‚  - Voice recording                        β”‚   β”‚
β”‚  β”‚  - File upload handler                    β”‚   β”‚
β”‚  β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜   β”‚
β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”¬β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜
                       β”‚ Socket.IO
                       β”‚ (WebSocket)
β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β–Όβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”
β”‚              Node.js Server (server.js)          β”‚
β”‚  β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”   β”‚
β”‚  β”‚  Express + Socket.IO                      β”‚   β”‚
β”‚  β”‚  - User authentication                    β”‚   β”‚
β”‚  β”‚  - Channel management                     β”‚   β”‚
β”‚  β”‚  - Message routing                        β”‚   β”‚
β”‚  β”‚  - File storage                           β”‚   β”‚
β”‚  β”‚  - Real-time updates                      β”‚   β”‚
β”‚  β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜   β”‚
β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜

Data Flow

User Action β†’ Client β†’ Socket.IO β†’ Server β†’ Process β†’ Broadcast β†’ All Clients

πŸ› Troubleshooting

Problem: β€œUsername already taken”

Solution: Clear browser localStorage

// In browser console (F12)
localStorage.clear()

Then refresh and login with new username.

Problem: Private messages not showing

Check Server Logs: Should show:

πŸ’¬ Private Room ID: Alice___PRIVATE___Bob
βœ… Message sent to room: Alice___PRIVATE___Bob

If missing, reconnect and try again.

Problem: Voice messages don’t record

Causes & Solutions:

To Enable HTTPS:

  1. Generate certificates: openssl req -x509 -newkey rsa:2048 -nodes -keyout key.pem -out cert.pem -days 365
  2. Restart server: node server.js
  3. Access via https://

Problem: Can’t connect from other devices

Check:

  1. βœ… Both devices on same network (Wi-Fi/Ethernet)
  2. βœ… Server running: node server.js
  3. βœ… Firewall allows port 3000
  4. βœ… Using correct IP from server output
  5. βœ… Using HTTPS and accepted certificate
  6. βœ… No proxy or VPN blocking connection

Problem: Channel not appearing for other users

Check Server Console: Should show:

βœ… Channel created successfully

All connected clients should receive updated channel list. Try refreshing page if needed.

Problem: File upload fails

Causes:

Solution: Check server console for error details.

Problem: β€œERR_CERT_AUTHORITY_INVALID”

This is normal! Self-signed certificate always shows this warning on first visit.

Solution: Click β€œAdvanced” and proceed. It’s safe for your LAN.


πŸ“Š Server Console Output

The server shows detailed real-time logs:

βœ… New connection: socket123              # Client connected
πŸ‘€ Join request from: Alice               # User joining
βœ… Alice registered and joined General    # Join successful
πŸ’¬ Message from Alice:                    # Message event
   Room: Bob
   Private: true
   Type: text
   βœ… Message sent
πŸ“Ž File uploaded: voice_123.webm          # Voice message
❌ Alice disconnected                     # User left

πŸ”’ Security Notes


πŸ“‹ API Reference

Socket.IO Events

Client β†’ Server:

socket.emit("join", username)
socket.emit("sendMessage", { room, isPrivate, type, content })
socket.emit("joinChannel", { name, password })
socket.emit("createChannel", { name, password })
socket.emit("joinPrivate", otherUsername)

Server β†’ Client:

socket.on("joinSuccess")
socket.on("receiveMessage", message)
socket.on("updateUserList", users)
socket.on("channelList", channels)
socket.on("joinFail", errorMessage)

πŸš€ Quick Commands

# Install everything
npm install express socket.io express-fileupload

# Generate SSL certificates
openssl req -x509 -newkey rsa:2048 -nodes -keyout key.pem -out cert.pem -days 365

# Start server
node server.js

# Clear browser data (in console)
localStorage.clear()

πŸ“¦ Dependencies


πŸ’‘ Tips & Tricks

  1. Use HTTPS for best experience - All features work
  2. Create channels for team discussions - Organize conversations
  3. Password protect sensitive channels - Add security
  4. Voice messages save bandwidth - Better than text for complex topics
  5. File sharing works great - Share documents, images, videos
  6. Message history saves - Scroll up to see previous messages
  7. User list updates in real-time - See who’s online instantly

🎯 Tested On


πŸ“ License

Open source - Use freely for your LAN


☁️ cloudflared

Add cloudflared for https and handle to https request making it access from everypart of world and different network. Server run in local machine and handle history text and uploaded file. Domain name = chat.lanchat.me This only works when server was running in local machine or host server. Cloudflared RAY id= 9b3adfd63e50ede5 common error or show this type of text when you try to access this domain and server was closed

What happened?

You’ve requested a page on a website (chat.lanchat.me) that is on the Cloudflare network. The host (chat.lanchat.me) is configured as an Cloudflare Tunnel, and Cloudflare is currently unable to resolve it. What can I do?

If you are a visitor of this website: Please try again in a few minutes.

If you are the owner of this website: Ensure that cloudflared is running and can reach the network. You may wish to enable load balancing for your tunnel. This common issues !! I have add private SSL to which works when someone wants to use in same network without tunnel. Install git SSL then run it, now HTTPS active.

πŸŽ‰ You’re All Set!

Your LAN Messenger is ready to use with all features:

Share the network URL with your team and start chatting! πŸš€


Questions? Check the troubleshooting section or review the server console logs for detailed diagnostics.