Socket.IO چیست؟

Socket.IO و WebSocket هر دو ابزاری هستند که برای برقراری اتصالات دوطرفه (bidirectional) در وب استفاده می‌شوند، اما با ویژگی‌ها و پروتکل‌های متفاوتی.

۱. WebSocket:

  • – WebSocket یک پروتکل ارتباطی است که برای ایجاد اتصال دوطرفه بین مرورگر و سرور مورد استفاده قرار می‌گیرد.
  • – WebSocket از تکنولوژی TCP استفاده می‌کند و این به این معنی است که اتصال به صورت پیوسته است و برقرار می‌ماند تا زمانی که یکی از دو طرف اتصال را قطع کند.
  • – این پروتکل از پیام‌های کوچک و سریع برای ارتباط استفاده می‌کند و برنامه نویسان می‌توانند به راحتی اطلاعات را به صورت همزمان به هر دو طرف ارسال کنند.

۲. Socket.IO:

  • – Socket.IO یک کتابخانه در زبان‌های برنامه‌نویسی مختلف مانند JavaScript است که برای ارتباط بین مرورگر و سرور از WebSocket و سایر فناوری‌ها استفاده می‌کند.
  • – یکی از ویژگی‌های مهم Socket.IO این است که به صورت اتوماتیک به پشتیبانی از فناوری‌های متفاوت نظیر WebSocket، Ajax Long Polling، Flash Socket و … می‌پردازد. به این ترتیب، اگر WebSocket در محیطی پشتیبانی نشود، به طور اتوماتیک به گزینه‌های دیگر می‌پردازد.
  • – Socket.IO از رویدادها (events) برای ارتباط بین سرور و مرورگر استفاده می‌کند و برنامه نویسان را قادر می‌سازد تا به راحتی اطلاعات را بین سمت سرور و سمت مرورگر انتقال دهند.

به طور خلاصه، WebSocket یک پروتکل است که برای برقراری اتصال دوطرفه بین مرورگر و سرور استفاده می‌شود، در حالی که Socket.IO یک کتابخانه است که از WebSocket و سایر فناوری‌ها برای برقراری ارتباطات در وب استفاده می‌کند و انعطاف پذیری بیشتری دارد.

 

Socket.IO چیست؟

Socket.IO کتابخانه ای است که ارتباط کم تاخیر ، دو طرفه و مبتنی بر رویداد را بین کلاینت و سرور امکان پذیر می کند.

Socket.IO کتابخانه ای است که ارتباط کم تاخیر ، دو طرفه و مبتنی بر رویداد را بین کلاینت و سرور امکان پذیر می کند.

این پروتکل بر روی پروتکل WebSocket ساخته شده است و ضمانت های اضافی مانند بازگشت به HTTP طولانی نظرسنجی یا اتصال مجدد خودکار را ارائه می دهد.

 

WebSocket یک پروتکل ارتباطی است که یک کانال دوطرفه و کم تاخیر بین سرور و مرورگر فراهم می کند. اطلاعات بیشتر را می توان در اینجا یافت .

 

چندین پیاده سازی سرور Socket.IO موجود است:

 

  • جاوا اسکریپت (js) (که اسناد آن را می توانید در اینجا در این وب سایت پیدا کنید)
  • جاوا اسکریپت (Deno): https://github.com/socketio/socket.io-deno
  • جاوا: https://github.com/mrniko/netty-socketio
  • جاوا: https://github.com/trinopoty/socket.io-server-java
  • پایتون: https://github.com/miguelgrinberg/python-socketio
  • گلنگ: https://github.com/googollee/go-socket.io

و پیاده سازی کلاینت در اکثر زبان های اصلی:

 

جاوا اسکریپت (که می تواند در مرورگر، Node.js یا React Native اجرا شود)

جاوا: https://github.com/socketio/socket.io-client-java

C++: https://github.com/socketio/socket.io-client-cpp

سوئیفت: https://github.com/socketio/socket.io-client-swift

دارت: https://github.com/rikulo/socket.io-client-dart

پایتون: https://github.com/miguelgrinberg/python-socketio

.Net: https://github.com/doghappy/socket.io-client-csharp

Rust: https://github.com/1c3t3a/rust-socketio

کاتلین: https://github.com/icerockdev/moko-socket-io

در اینجا یک مثال اساسی با WebSockets ساده آورده شده است:

سرور (بر اساس ws ):

این کد یک سرور WebSocket با استفاده از کتابخانه `ws` در زبان جاوااسکریپت را پیاده‌سازی می‌کند. این سرور بر روی پورت ۳۰۰۰ گوش می‌دهد و به اتصالات جدید کلاینت‌ها پاسخ می‌دهد.

بیایید کد را گام به گام بررسی کنیم:

۱. وارد کردن WebSocketServer از کتابخانه “ws”:

“`javascript

import { WebSocketServer } from “ws”;

“`

در این قسمت، کلاس `WebSocketServer` از کتابخانه `ws` وارد شده است. این کتابخانه برای پیاده‌سازی WebSocket در جاوااسکریپت مورد استفاده قرار می‌گیرد.

۲. ساخت یک سرور WebSocket و گوش دادن به اتصالات:

 

“`javascript

const server = new WebSocketServer({ port: 3000 });

“`

در کد بالا یک نمونه از کلاس `WebSocketServer` با پارامترهای مربوط به پورت ۳۰۰۰ ایجاد می‌شود.

 

۳. برقراری اتصال با کلاینت:

 

“`javascript

server.on(“connection”, (socket) => {

“`

یک event listener برای رویداد “connection” تعریف شده است. هر زمان که یک کلاینت به سرور متصل می‌شود، این کد اجرا می‌شود و یک شیء `socket` با اطلاعات اتصال جدید به دست می‌آید.

در کد بالا، `server.on` یک ایونت لیستنر (Event Listener) برای سرور WebSocket است. ولی `server.on` مستقیماً از کتابخانه `ws` نیست. این به این دلیل است که `server` یک نمونه از `WebSocketServer` است که به عنوان یک سرور WebSocket عمل می‌کند و از API کتابخانه `ws` استفاده می‌کند.

کد از کتابخانه `ws` برای ایجاد یک سرور WebSocket استفاده کرده است. البته، اگر می‌خواهید مستقیماً به منبع `server.on` در کتابخانه `ws` مراجعه کنید، باید به کد منبع کتابخانه نگاه کنید.

شما می‌توانید به طور مستقیم از مخزن GitHub کتابخانه `ws` منبع کد آن را مشاهده کنید. در آدرس زیر می‌توانید به صفحه GitHub مراجعه کنید:

[ws – GitHub Repository](https://github.com/websockets/ws)

معمولاً کد ایونت لیستنر برای رویدادهایی مانند “connection” در سرور WebSocket در منبع کتابخانه `ws` پیدا می‌شود.

۴. ارسال پیام به کلاینت:

 

“`javascript

socket.send(JSON.stringify({

type: “hello from server”,

content: [ 1, “2” ]

}));

“`

یک پیام به کلاینت ارسال می‌شود. پیام با فرمت JSON به صورت رشته تبدیل شده و توسط تابع `send` ارسال می‌شود.

 

۵. دریافت پیام از کلاینت:

 

“`javascript

socket.on(“message”, (data) => {

const packet = JSON.parse(data);

switch (packet.type) {

case “hello from client”:

// …

break;

}

});

“`

 

یک event listener برای رویداد “message” تعریف شده است. هر زمان که یک پیام از کلاینت دریافت می‌شود، این کد اجرا می‌شود. پیام از رشته JSON به شیء JavaScript تبدیل شده و بر اساس مقدار `type` پردازش می‌شود.

کد به نظر می‌رسد که یک سرور WebSocket ساده است که پیام “hello from server” به هر کلاینت جدید ارسال می‌کند و همچنین از کلاینت پیام‌های “hello from client” را دریافت و پردازش می‌کند. بخش “…” درون شرط `case` برای پردازش ادامه پیام‌های مرتبط با “hello from client” باید پر شود.


کلاینت:

این کد یک کلاینت WebSocket را پیاده‌سازی می‌کند که به سرور WebSocket با آدرس “ws://localhost:3000” متصل می‌شود و پیام‌ها را بین سرور و کلاینت ارسال و دریافت می‌کند. بیایید به طور گام به گام کد را بررسی کنیم:

۱. ایجاد یک اتصال WebSocket:

 

“`javascript

const socket = new WebSocket(“ws://localhost:3000”);

“`

در کد بالا یک نمونه از کلاس `WebSocket` ایجاد شده و به سرور با آدرس “ws://localhost:3000” متصل می‌شود.

۲. Event Listener برای رویداد “open”:

“`javascript

socket.addEventListener(“open”, () => {

// send a message to the server

socket.send(JSON.stringify({

type: “hello from client”,

content: [ 3, “4” ]

}));

});

“`

یک Event Listener برای رویداد “open” تعریف شده است. هنگامی که اتصال با سرور برقرار می‌شود (`open` می‌شود)، یک پیام به سرور ارسال می‌شود. در اینجا، یک پیام با فرمت JSON به شیء JavaScript تبدیل شده و توسط تابع `send` ارسال می‌شود.

۳. Event Listener برای رویداد “message”:

 

“`javascript

socket.addEventListener(“message”, ({ data }) => {

const packet = JSON.parse(data);

switch (packet.type) {

case “hello from server”:

// …

break;

}

});

“`

در کد بالا یک Event Listener برای رویداد “message” تعریف شده است. هر زمان که یک پیام از سرور دریافت می‌شود، این کد اجرا می‌شود. پیام از رشته JSON به شیء JavaScript تبدیل شده و بر اساس مقدار `type` پردازش می‌شود. در اینجا، اگر نوع پیام “hello from server” باشد، کد درون شرط `case` باید پر شود.

کلاینت WebSocket در اینجا به سرور یک پیام “hello from client” ارسال می‌کند و از سرور پیام‌های “hello from server” را دریافت و پردازش می‌کند. بخش “…” درون شرط `case` برای پردازش ادامه پیام‌های مرتبط با “hello from server” باید پر شود.


و در اینجا همان مثال با Socket.IO است:

سرور

این کد یک سرور Socket.IO را با استفاده از کتابخانه `socket.io` در جاوااسکریپت پیاده‌سازی می‌کند. بیایید به طور گام به گام کد را بررسی کنیم:

۱. وارد کردن Server از کتابخانه “socket.io”:

“`javascript

import { Server } from “socket.io”;

“`

در این قسمت، کلاس `Server` از کتابخانه `socket.io` وارد شده است. این کتابخانه برای پیاده‌سازی Socket.IO در جاوااسکریپت مورد استفاده قرار می‌گیرد.

۲. ساخت یک سرور Socket.IO:

“`javascript

const io = new Server(3000);

“`

یک نمونه از کلاس `Server` ایجاد شده و به عنوان یک سرور Socket.IO با پارامتر مربوط به پورت ۳۰۰۰ ایجاد می‌شود.

۳. Event Listener برای رویداد “connection”:

“`javascript

io.on(“connection”, (socket) => {

// send a message to the client

socket.emit(“hello from server”, 1, “2”, { 3: Buffer.from([4]) });

// receive a message from the client

socket.on(“hello from client”, (…args) => {

// …

});

});

“`

یک Event Listener برای رویداد “connection” تعریف شده است. هر زمان که یک کلاینت به سرور متصل می‌شود، این کد اجرا می‌شود و یک شیء `socket` با اطلاعات اتصال جدید به دست می‌آید.

۴. ارسال پیام به کلاینت:

“`javascript

socket.emit(“hello from server”, 1, “2”, { 3: Buffer.from([4]) });

“`

یک پیام به کلاینت ارسال می‌شود. در اینجا، `emit` برای ارسال یک رویداد به کلاینت استفاده می‌شود و رویداد با نام “hello from server” است. پارامترهای بعدی نیز به عنوان اطلاعات پیام ارسال می‌شوند.

۵. Event Listener برای رویداد “hello from client”:

“`javascript

socket.on(“hello from client”, (…args) => {

// …

});

“`

یک Event Listener برای رویداد “hello from client” تعریف شده است. هر زمان که یک پیام با نام “hello from client” از کلاینت دریافت می‌شود، این کد اجرا می‌شود. آرگومان‌های پیام به صورت آرایه `args` دریافت می‌شوند و در اینجا می‌توان کد پردازش آن را اضافه کرد.

این کد یک سرور Socket.IO را پیاده‌سازی می‌کند که به کلاینت پیام “hello from server” را ارسال می‌کند و از کلاینت پیام‌های “hello from client” را دریافت و پردازش می‌کند.


کلاینت با socket.io

این کد یک کلاینت Socket.IO را با استفاده از کتابخانه `socket.io-client` در جاوااسکریپت پیاده‌سازی می‌کند. بیایید به طور گام به گام کد را بررسی کنیم:

۱. وارد کردن io از کتابخانه “socket.io-client”:

“`javascript

import { io } from “socket.io-client”;

“`

در این قسمت، تابع `io` از کتابخانه `socket.io-client` وارد شده است. این کتابخانه برای ایجاد اتصال Socket.IO به سرور می‌تواند مورد استفاده قرار گیرد.

۲. اتصال به سرور Socket.IO:

“`javascript

const socket = io(“ws://localhost:3000”);

“`

یک اتصال Socket.IO به سرور با آدرس “ws://localhost:3000” ایجاد شده است.

۳. ارسال پیام به سرور:

“`javascript

socket.emit(“hello from client”, 5, “6”, { 7: Uint8Array.from([8]) });

“`

یک پیام به سرور ارسال می‌شود. این ارسال پیام با استفاده از تابع `emit` انجام می‌شود و رویداد “hello from client” به همراه آرگومان‌های پیام ارسال می‌شود.

توضیح اضافه:

socket. emit(“hello”, “world”)

شما می توانید هر تعداد آرگومان را ارسال کنید، و تمام ساختارهای داده سریال پذیر پشتیبانی می شوند، از جمله اشیاء باینری مانند بافر یا TypedArray.

۴. Event Listener برای دریافت پیام از سرور:

“`javascript

socket.on(“hello from server”, (…args) => {

// …

});

“`

یک Event Listener برای رویداد “hello from server” تعریف شده است. هر زمان که یک پیام با نام “hello from server” از سرور دریافت می‌شود، این کد اجرا می‌شود. آرگومان‌های پیام به صورت آرایه `args` دریافت می‌شوند و در اینجا می‌توان کد پردازش آن را اضافه کرد.

کلاینت Socket.IO در اینجا به سرور یک پیام “hello from client” با آرگومان‌های ۵، “۶” و یک شیء با یک خصوصیت به نام ۷ که یک Uint8Array است ارسال می‌کند. همچنین از سرور پیام‌های “hello from server” را دریافت و در آرایه `args` پردازش می‌کند.

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *