غالبًا ما تتطلب تطبيقات الويب الحديثة الاتصال في الوقت الفعلي، سواء لأنظمة الدردشة أو التحديثات المباشرة أو التحرير التعاوني أو الإشعارات. اتصال HTTP التقليدي غير كافٍ للتطبيقات في الوقت الفعلي لأنه يعتمد على أنماط الاستجابة للطلب. هذا هو المكان الذي يلعب فيه WebSockets، مما يسمح بالاتصال المزدوج الكامل بين الخادم والعميل.

في هذا المقال سنستكشف:

1. ما هي WebSockets، ولماذا هي ضرورية للتطبيقات في الوقت الحقيقي.
2. كيفية تنفيذ WebSockets في Node.js.
3. استخدامocket.IO لتبسيط تنفيذ WebSocket.
4. أمثلة لحالات الاستخدام في العالم الحقيقي.

ما هي WebSockets؟

WebSockets عبارة عن بروتوكول يوفر قنوات اتصال مزدوجة الاتجاه عبر اتصال TCP واحد. على عكس طلبات HTTP التقليدية، التي تعتمد على الطلب والاستجابة ولها عبء في إنشاء اتصالات جديدة بشكل مستمر، تسمح WebSockets بالاتصال المستمر.

الميزات الرئيسية:

• اتصال مزدوج كامل: يمكن لكل من العميل والخادم إرسال الرسائل في أي وقت دون انتظار بعضهما البعض.
• زمن استجابة أقل: تقضي WebSockets على الحاجة إلى فتح الاتصالات وإغلاقها باستمرار، مما يقلل زمن الاستجابة ويحسن أداء التطبيقات في الوقت الفعلي.
• يعتمد على الأحداث: يمكن لكلا الجانبين دفع البيانات، مما يجعلها مثالية للتطبيقات الديناميكية مثل الدردشة أو الألعاب أو الإشعارات في الوقت الفعلي.

تنفيذ WebSockets في Node.js

الخطوة 1: تثبيت مكتبة ws WebSocket

في Node.js، WebSockets ليست مدمجة، لذلك نحن بحاجة إلى مكتبة. إحدى مكتبات WebSocket الأكثر شعبية لـ Node.js هي ws.

npm install ws

الخطوة 2: إنشاء خادم WebSocket

إليك خادم WebSocket بسيط يستخدم مكتبة ws:

const WebSocket = require('ws');

const wss = new WebSocket.Server({ port: 8080 });

wss.on('connection', (ws) => {
    console.log('Client connected');

    // Listen for messages from the client
    ws.on('message', (message) => {
        console.log('Received:', message);
        // Respond to the client
        ws.send(`Hello, you sent -> ${message}`);
    });

    // On client disconnect
    ws.on('close', () => {
        console.log('Client disconnected');
    });
});

console.log('WebSocket server running on ws://localhost:8080');

في هذا المثال:

• نقوم بإنشاء خادم WebSocket على المنفذ 8080.
• عندما يتصل العميل، يتم تشغيل حدث الاتصال.
• يستمع الخادم للرسائل الواردة من العميل ويستجيب برسالة تأكيد.
• في حالة قطع اتصال العميل، نقوم بتسجيل رسالة.

الخطوة 3: إنشاء عميل WebSocket

يمكنك إنشاء عميل WebSocket باستخدام JavaScript في المتصفح:

    
    
    


    
WebSocket Example
    Send Message
    

• عند فتح اتصال WebSocket، يقوم العميل بتسجيل رسالة نجاح.
• يتم إرسال رسالة إلى الخادم عند الضغط على الزر، ويتم عرض استجابة الخادم.

الإخراج:

1. سجلات العميل:

   Connected to WebSocket server
   Message from server: Hello, you sent -> Hello from client

1. سجلات الخادم:

   Client connected
   Received: Hello from client

المقبس.IO: WebSockets المبسطة

على الرغم من أن WebSockets قوية، إلا أنها تتطلب بعض العمل اليدوي للتعامل مع الأحداث مثل إعادة الاتصال والبث وإدارة الإجراءات الاحتياطية (على سبيل المثال، الاستقصاء الطويل). يعمل Socket.IO على تبسيط الاتصال في الوقت الفعلي من خلال توفير ميزات مثل:

• إعادة الاتصال التلقائي.
• بث الأحداث لعدة عملاء.
• الرجوع إلى الاستقصاء إذا لم يكن WebSockets مدعومًا.

الخطوة 1: تثبيت المقبس.IO

npm install socket.io

الخطوة 2: إنشاء خادم Switch.IO

const http = require('http');
const socketio = require('socket.io');

// Create an HTTP server
const server = http.createServer();
const io = socketio(server);

io.on('connection', (socket) => {
    console.log('Client connected');

    // Listen for messages from the client
    socket.on('message', (msg) => {
        console.log('Received message:', msg);
        socket.emit('message', `Server received: ${msg}`);
    });

    // On client disconnect
    socket.on('disconnect', () => {
        console.log('Client disconnected');
    });
});

server.listen(3000, () => {
    console.log('Socket.IO server running on http://localhost:3000');
});

هنا:

• نقوم بإنشاء خادم باستخدام المقبس.IO الذي يستمع للاتصالات والرسائل الواردة.
• يتم استخدام المقبس.emit لإرسال رسالة مرة أخرى إلى العميل.

الخطوة 3: إنشاء عميل المقبس.IO

    
    
    


    
Socket.IO Example
    Send Message
    
    

في هذا المثال، يقوم عميل Switch.IO بمعالجة الاتصال بالخادم تلقائيًا ويسمح بالاتصال ثنائي الاتجاه.

الإخراج:

1. سجلات العميل:

   Connected to server
   Message from server: Server received: Hello from client

1. سجلات الخادم:

   Client connected
   Received message: Hello from client

حالات الاستخدام لـ WebSockets وSocket.IO

4.1 تطبيق الدردشة في الوقت الحقيقي

المشكلة: يحتاج نظام المراسلة إلى تمكين الاتصال في الوقت الفعلي بين المستخدمين.

الحل: توفر WebSockets (أو Jack.IO) اتصالاً مستمرًا قائمًا على الأحداث، مما يسمح للمستخدمين بإرسال واستقبال الرسائل في الوقت الفعلي دون تأخير.

4.2 تحرير المستندات التعاونية في الوقت الفعلي

المشكلة: يحتاج المستخدمون الذين يتعاونون في مستند ما إلى رؤية التغييرات التي أجراها الآخرون على الفور.

الحل: باستخدام WebSockets، يتم دفع التغييرات إلى جميع العملاء في الوقت الفعلي، مما يضمن بقاء المستند متزامنًا عبر جميع المستخدمين.

4.3 الإخطارات في تطبيقات الويب

المشكلة: يحتاج تطبيق الويب إلى إخطار المستخدمين بأحداث مثل الرسائل الجديدة أو التحديثات أو التنبيهات.

الحل: تسمح WebSockets للخادم بإرسال الإشعارات إلى العميل بمجرد وقوع الأحداث، مما يؤدي إلى تحسين مشاركة المستخدم.

توسيع نطاق WebSockets وSocket.IO

يمثل توسيع نطاق WebSockets وSocket.IO تحديًا بسبب طبيعتها المستمرة. كل اتصال WebSocket هو اتصال TCP طويل الأمد، والذي يمكن أن يصبح كثيف الاستخدام للموارد مع زيادة عدد الاتصالات.

الاستراتيجيات المشتركة للتحجيم:

1. القياس الأفقي: تحميل موازنة حركة مرور WebSocket عبر خوادم متعددة.
2. الجلسات الثابتة: التأكد من توجيه جميع اتصالات WebSocket من العميل إلى نفس الخادم.
3. Redis for Pub/Sub: استخدام Redis لنشر الأحداث والاشتراك عبر الخوادم، مما يضمن حصول جميع العملاء على التحديثات في الوقت الفعلي.

npm install socket.io-redis

إليك مثال على تكوين المقبس.IO لاستخدام Redis:

const io = require('socket.io')(server);
const redisAdapter = require('socket.io-redis');
io.adapter(redisAdapter({ host: 'localhost', port: 6379 }));

خاتمة

تعد WebSockets وSocket.IO من التقنيات الأساسية للاتصال في الوقت الفعلي في تطبيقات الويب الحديثة. بينما توفر WebSockets بروتوكولًا منخفض المستوى للاتصال ثنائي الاتجاه، تعمل تقنية Switch.IO على تبسيط عملية التنفيذ، حيث تقدم ميزات إضافية مثل إعادة الاتصال التلقائي والبث. تتمتع كلتا التقنيتين بتطبيقات مهمة في العالم الحقيقي، بدءًا من تطبيقات الدردشة وحتى الأدوات التعاونية.

في المقالة التالية، سنتعمق في Node.js Streams ونستكشف كيفية تعاملهم مع البيانات الكبيرة بكفاءة، مع التركيز على قابلية التوسع والأداء.