إعداد Socket.io
تستخدم معظم تطبيقات الويب بروتوكول HTTP. يتبع التدفق نمطًا بسيطًا:
يرسل العميل (Client) طلبًا. يرسل الخادم (Server) استجابةً. يُغلق الاتصال.
يعمل هذا في عمليات المصادقة أو جلب البيانات، لكنه يفشل عندما يحتاج الخادم إلى إرسال بيانات دون تلقي طلب.
إذا قام أحد أعضاء الفريق بتحديث مهمة ما أو تغيرت حالة معينة، فإن HTTP يجعل المتصفح يسأل "هل هناك بيانات جديدة؟" بشكل متكرر. يُسمى هذا بالاستطلاع (polling)، وهو ما يهدر الموارد.
يحل Socket.io هذه المشكلة، حيث ينشئ اتصالًا مستمرًا يظل نشطًا.
يصبح التواصل ثنائي الاتجاه: العميل ↔ الخادم
يرسل العميل البيانات، ويرسل الخادم البيانات أيضًا. وهذا ما يتيح بناء تطبيقات الوقت الفعلي (real-time apps).
من الأخطاء الشائعة محاولة ربط Socket.io مباشرة بـ Express، حيث يقوم Express بإخفاء خادم HTTP الأساسي، بينما يحتاج Socket.io إلى وصول مباشر إلى ذلك الخادم.
افعل ذلك بدلاً من ذلك:
- أنشئ الخادم باستخدام تطبيق Express الخاص بك.
- اربط Socket.io بهذا الخادم.
- ابدأ الاستماع على المنفذ (port).
يعتمد Socket.io على طريقتين (methods):
• socket.emit(): إرسال حدث (event).
• socket.on(): الاستماع لحدث (event).
تجعل الغرف (Rooms) من Socket.io أداة فعالة؛ فكر فيها كقنوات أجهزة اللاسلكي (walkie-talkie). يمكنك تجميع المستخدمين في غرف مشاريع محددة.
عندما يفتح المستخدم مشروعًا، فإنه ينضم إلى غرفة ما. وعند حدوث تحديث، تقوم بإرسال الحدث إلى تلك الغرفة المحددة فقط، مما يمنع إرسال البيانات إلى المستخدمين الذين لا يحتاجون إليها.
التنفيذ الصحيح أمر بالغ الأهمية. لا تضع منطق العمل (business logic) داخل معالج Socket.io، بل ضعه في معالجات المسارات (route handlers) الخاصة بك.
التدفق الصحيح هو:
- يرسل المستخدم طلبًا إلى مسار (route).
- يقوم الخادم بتحديث قاعدة البيانات.
- تنجح عملية قاعدة البيانات.
- يقوم الخادم بإرسال حدث Socket.io.
- تقوم أجهزة العملاء بتحديث واجهة المستخدم (UI).
لا تقم أبدًا بإرسال حدث قبل أن تؤكد قاعدة البيانات حدوث التغيير.
للحفاظ على نظافة الكود الخاص بك، قم بتخزين مثيل (instance) Socket.io في تطبيق Express. استخدم app.set("io", io). يتيح ذلك لأي مسار الوصول إلى المثيل دون الحاجة إلى عمليات استيراد (imports) فوضوية.
التواصل في الوقت الفعلي يعني أن المستخدمين يرون التحديثات فورًا دون الحاجة إلى إعادة تحميل الصفحة.
المصدر: https://dev.to/chinwuba_jeffrey/setting-up-socketio-a42