Skip to content

Strapi Plugin IOSocket.IO Integration for Strapi v5

Real-time WebSocket connections with authentication, monitoring, and advanced features

Quick Start ​

Install the plugin:

bash
npm install @strapi-community/plugin-io

Enable in config/plugins.js:

javascript
module.exports = {
  'io': {
    enabled: true,
    config: {
      contentTypes: ['api::article.article'],
      socket: {
        serverOptions: {
          cors: {
            origin: 'http://localhost:3000',
            methods: ['GET', 'POST']
          }
        }
      }
    }
  }
};

Connect from your frontend:

javascript
import { io } from 'socket.io-client';

const socket = io('http://localhost:1337', {
  auth: {
    strategy: 'jwt',
    token: 'your-jwt-token'
  }
});

socket.on('article:create', (data) => {
  console.log('New article:', data);
});

What's New in v5.0 ​

Strapi v5 Support - Built for the latest Strapi version with full compatibility

Migration Made Easy - See migration guide - most projects migrate in under 1 hour!

Admin Dashboard - Visual configuration with live monitoring widget on home page

Advanced Security - Rate limiting, IP whitelisting, enhanced authentication

Performance Optimizations - 90% reduction in DB queries, improved caching, parallel processing

Enhanced API - 7 helper functions for common tasks, improved TypeScript definitions

Better Documentation - Comprehensive guides, real-world examples, migration path

Core Features ​

🎯 Automatic Content Type Events ​

Enable any content type for real-time updates:

javascript
// Backend: config/plugins.js
contentTypes: [
  'api::article.article',
  'api::comment.comment',
  {
    uid: 'api::product.product',
    actions: ['create', 'update']
  }
]
javascript
// Frontend: Automatic events
socket.on('article:create', (article) => { /* ... */ });
socket.on('article:update', (article) => { /* ... */ });
socket.on('article:delete', (article) => { /* ... */ });

🔐 Role-Based Access Control ​

Permissions are automatically enforced based on user roles:

javascript
// Public users only receive events they have permission to see
// Authenticated users receive events based on their role
// API tokens work with their configured permissions

📊 Real-Time Monitoring ​

View live statistics in your admin panel:

  • 🟢 Active connections
  • 💬 Active rooms
  • ⚡ Events per second
  • 📈 Total events processed

🚀 Helper Functions ​

Seven utility functions for common tasks:

javascript
// Join/leave rooms
strapi.$io.joinRoom(socketId, 'premium-users');
strapi.$io.leaveRoom(socketId, 'premium-users');

// Private messages
strapi.$io.sendPrivateMessage(socketId, 'notification', data);

// Broadcast to all except sender
strapi.$io.broadcast(socketId, 'user-joined', data);

// Namespace management
strapi.$io.emitToNamespace('admin', 'dashboard:update', stats);

// Room info
const sockets = await strapi.$io.getSocketsInRoom('chat-room');

// Disconnect
strapi.$io.disconnectSocket(socketId, 'Kicked by admin');

Use Cases ​

Real-Time Blog ​

Automatically notify readers when new articles are published

Live Chat ​

Build a chat system with rooms, private messages, and typing indicators

E-Commerce ​

Update product availability, prices, and inventory in real-time

Collaborative Tools ​

Synchronize state across multiple users editing the same document

Dashboards ​

Push live metrics, alerts, and system status to admin panels

Gaming ​

Handle player connections, game state, and multiplayer interactions

IoT Integration ​

Receive and broadcast sensor data and device status updates

Dashboard Widget ​

The plugin includes a live statistics widget on your Strapi admin home page:

Socket.IO Dashboard Widget

📊 Widget Features:

  • 🟢 Live connection status with pulsing indicator
  • 👥 Active connections count
  • 💬 Active rooms count
  • ⚡ Events per second
  • 📈 Total events processed
  • 🔄 Auto-updates every 5 seconds

See it in action: Navigate to your admin home page after installing the plugin!


Visual Configuration ​

Configure everything visually in the admin panel:

Socket.IO Settings

Settings → Socket.IO gives you full control over:

  • CORS origins
  • Content type monitoring
  • Role-based permissions
  • Security settings
  • Rate limiting

Monitoring Dashboard

Real-time monitoring shows:

  • Active connections with user details
  • Event logs
  • Performance metrics
  • Connection history

Browser Support ​

  • ✅ Chrome/Edge 90+
  • ✅ Firefox 88+
  • ✅ Safari 14+
  • ✅ iOS Safari 14+
  • ✅ Android Chrome 90+

Requirements ​

  • Node.js 18.0.0 - 22.x
  • Strapi v5.x
  • Socket.IO 4.x

Community & Support ​

Next Steps ​


Check out other powerful Strapi v5 plugins by @Schero94 that complement Socket.IO perfectly:

📧 Magic-Mail ​

Enterprise-grade multi-account email management with OAuth 2.0 support. Perfect for sending transactional emails triggered by real-time events.

Features: Gmail/Microsoft/Yahoo OAuth, SendGrid, Mailgun, smart routing, rate limiting

🔗 View on GitHub | 📦 NPM Package


🔐 Magic-Sessionmanager ​

Advanced session tracking and monitoring for Strapi v5. Track Socket.IO connections, monitor active users, and analyze session patterns.

Features: Real-time tracking, IP monitoring, active user dashboard, session analytics

🔗 View on GitHub


🔖 Magicmark ​

Powerful bookmark management system with real-time sync capabilities. Share bookmarks instantly with your team using Socket.IO integration.

Features: Tag organization, team sharing, real-time sync, full REST API

🔗 View on GitHub


License ​

MIT License - see LICENSE for details


Made with ❤️ by @ComfortablyCoding and @hrdunn

Updated and made it better by: @Schero94

Will be maintained till December 2026 🚀

Released under the MIT License. Updated and made better by @Schero94 · llms.txt