socket.emit لا يعمل بداخل socket.on

المشكلة تكمن في توقيت إرسال الحدث عند انفصال المستخدم disconnect، فالاتصال بالمستخدم يكون بالفعل قد تم قطعه، مما يجعل إرسال أي أحداث لهم غير مجدي.

اعتمد على حدث disconnecting بدلاً من disconnect، فهو يتم إطلاقه قبل أن يتم قطع الاتصال فعليًا، مما يمنحك الفرصة لإرسال أحداث إلى العميل.

مع استخدم طريقة broadcast لإرسال الحدث إلى جميع العملاء المتصلين، باستثناء العميل الذي سينقطع اتصاله.

للتوضيح:

socket.on("disconnecting", function () {
  if (UserInfo[socket.id]) {
    socket.broadcast.emit("SEND_EVENT_EMIT_SERVER", {
      cmd: "ev",
      data: 'window.onbeforeunload = null; location.href="/";'
    });
  }
});

لاحظ استخدام socket.broadcast.emit لإرسال الحدث إلى جميع العملاء المتصلين، باستثناء العميل الذي سيتم قطع اتصاله.

وفي حال تحتاج لإرسال الحدث إلى العميل نفسه قبل انقطاع الاتصال، حاول تجربة حدث disconnecting كالتالي:

socket.on("disconnecting", function () {
  if (UserInfo[socket.id]) {
    socket.emit("SEND_EVENT_EMIT_SERVER", {
      cmd: "ev",
      data: 'window.onbeforeunload = null; location.href="/";'
    });
  }
});

وهناك منهجية أخرى لحل المشكلة، وهي بدلاً من محاولة إرسال حدث إلى العميل عند تفعيل حدث الانفصال disconnect، باستطاعتك تخزين معلومات جلسة المستخدم مثل معرفه في قاعدة بيانات أو مخزن مؤقت مثل Redis عندما يتصل بالخادم، عد ذلك، عند انفصال المستخدم، تستطيع تحديث معلومات جلسته لتعكس أنه لم يعد متصلاً.

على جانب العميل، تقوم باستخدام مؤقت للتحقق بشكل دوري من الخادم لمعرفة ما إن كانت جلسته لا تزال نشطة، في حال استجاب الخادم بأن الجلسة لم تعد نشطة، يمكن للعميل إعادة توجيه نفسه إلى الـ URL المطلوب.

جانب الخادم:

const express = require('express');
const app = express();
const server = require('http').createServer(app);
const io = require('socket.io')(server);


// تخزين جلسات المستخدم في مخزن مؤقت (مثل Redis)
const redis = require('redis');
const client = redis.createClient();


io.on('connection', (socket) => {
  const userId = socket.handshake.query.userId;
  client.set(`user:${userId}:connected`, true);


  socket.on('disconnect', () => {
    client.set(`user:${userId}:connected`, false);
  });
});

جانب العميل:

const socket = io();

setInterval(() => {
  fetch('/check-session')
    .then(response => response.json())
    .then((data) => {
      if (!data.connected) {
        window.location.href = '/';
      }
    });
}, 1000);

جانب الخادم - نقطة نهاية للتحقق من الجلسة

app.get('/check-session', (req, res) => {
  const userId = req.query.userId;
  client.get(`user:${userId}:connected`, (err, connected) => {
    res.json({ connected: connected === 'true' });
  });
});