docs(presentation): improve presentation markdown and add pdf version
This commit is contained in:
@@ -1,14 +1,17 @@
|
||||
# ارائه: چتروم ساده با WebSocket
|
||||
|
||||
## اسلاید ۱ - عنوان پروژه
|
||||
## عنوان پروژه
|
||||
|
||||

|
||||
|
||||
**چتروم ساده با WebSocket**
|
||||
|
||||
این پروژه برای درس مهندسی اینترنت آماده شده است و هدف آن نمایش ارتباط بلادرنگ بین مرورگر و سرور با استفاده از FastAPI و WebSocket است.
|
||||
|
||||

|
||||
|
||||
## اسلاید ۲ - چرا WebSocket به وجود آمد؟
|
||||
## چرا WebSocket به وجود آمد؟
|
||||
|
||||

|
||||
|
||||
وب در ابتدا بیشتر بر پایه مدل درخواست و پاسخ HTTP کار میکرد. مرورگر یک درخواست میفرستاد، سرور پاسخ میداد و ارتباط همانجا تمام میشد.
|
||||
|
||||
@@ -16,9 +19,8 @@
|
||||
|
||||
قبل از WebSocket معمولا از روشهایی مثل polling و long polling استفاده میشد. این روشها قابل استفاده بودند، اما باعث تکرار زیاد درخواستهای HTTP و مصرف منابع بیشتر میشدند.
|
||||
|
||||

|
||||
|
||||
## اسلاید ۳ - تاریخچه کوتاه
|
||||
## تاریخچه کوتاه
|
||||
|
||||
- **HTTP کلاسیک:** برای دریافت صفحه و ارسال فرم مناسب بود، اما برای ارسال لحظهای داده از سرور به مرورگر طراحی نشده بود.
|
||||
- **AJAX و polling:** امکان درخواستهای پسزمینه را فراهم کرد، ولی مرورگر همچنان باید مرتب از سرور سوال میپرسید.
|
||||
@@ -26,7 +28,9 @@
|
||||
- **استاندارد WebSocket:** در RFC 6455 به عنوان یک پروتکل استاندارد برای ارتباط دوطرفه و پایدار معرفی شد.
|
||||
- **کاربردهای امروز:** چت، بازی آنلاین، داشبورد زنده، ویرایش همزمان، اعلانها و کنترل تجهیزات IoT.
|
||||
|
||||
## اسلاید ۴ - WebSocket چگونه از HTTP شروع میشود؟
|
||||
## WebSocket چگونه از HTTP شروع میشود؟
|
||||
|
||||

|
||||
|
||||
WebSocket از ابتدا یک ارتباط جدا از HTTP نیست. ارتباط با یک درخواست HTTP معمولی شروع میشود که از سرور میخواهد پروتکل را تغییر دهد.
|
||||
|
||||
@@ -46,9 +50,8 @@ Sec-WebSocket-Key: ...
|
||||
|
||||
بعد از این پاسخ، همان اتصال TCP دیگر مثل HTTP عادی استفاده نمیشود و دادهها در قالب فریمهای WebSocket جابهجا میشوند.
|
||||
|
||||

|
||||
|
||||
## اسلاید ۵ - بعد از ارتقا چه اتفاقی میافتد؟
|
||||
## بعد از ارتقا چه اتفاقی میافتد؟
|
||||
|
||||
بعد از تبدیل ارتباط:
|
||||
|
||||
@@ -59,9 +62,11 @@ Sec-WebSocket-Key: ...
|
||||
|
||||
به همین دلیل به WebSocket ارتباط **دوطرفه کامل** گفته میشود.
|
||||
|
||||
## اسلاید ۶ - جایگاه WebSocket در مدل OSI
|
||||
## جایگاه WebSocket در مدل OSI
|
||||
|
||||
WebSocket معمولا در لایه کاربرد بررسی میشود، چون برنامه تصمیم میگیرد پیامها چه معنایی دارند.
|
||||

|
||||
|
||||
وبسوکت معمولا در لایه کاربرد بررسی میشود، چون برنامه تصمیم میگیرد پیامها چه معنایی دارند.
|
||||
|
||||
در یک ارتباط معمول بین مرورگر و سرور:
|
||||
|
||||
@@ -71,9 +76,8 @@ WebSocket معمولا در لایه کاربرد بررسی میشود، چ
|
||||
- IP بستهها را بین میزبانها مسیریابی میکند.
|
||||
- Ethernet یا Wi-Fi داده را روی شبکه واقعی حمل میکند.
|
||||
|
||||

|
||||
|
||||
## اسلاید ۷ - نگاه شبکهای ساده
|
||||
## نگاه شبکهای ساده
|
||||
|
||||
مسیر داده در این پروژه را میتوان اینطور ساده کرد:
|
||||
|
||||
@@ -88,7 +92,9 @@ WebSocket معمولا در لایه کاربرد بررسی میشود، چ
|
||||
|
||||
کد پروژه بیشتر در بالاترین بخش این زنجیره کار میکند. پیام JSON ساخته میشود، از طریق WebSocket فرستاده میشود و جزئیات انتقال در لایههای پایینتر توسط سیستمعامل و شبکه انجام میشود.
|
||||
|
||||
## اسلاید ۸ - معماری پروژه
|
||||
## معماری پروژه
|
||||
|
||||

|
||||
|
||||
این پروژه سه بخش اصلی دارد:
|
||||
|
||||
@@ -98,67 +104,50 @@ WebSocket معمولا در لایه کاربرد بررسی میشود، چ
|
||||
|
||||
وقتی یک کاربر پیام میفرستد، سرور پیام را از socket همان کاربر میگیرد و آن را برای همه socketهای همان اتاق پخش میکند.
|
||||
|
||||

|
||||
|
||||
## اسلاید ۹ - جریان پیام در پروژه
|
||||
## جریان پیام در پروژه
|
||||
|
||||
1. کاربر نام و اتاق را وارد میکند.
|
||||
2. JavaScript یک شیء `WebSocket` میسازد.
|
||||
2. جاوااسکریپت یک شیء `WebSocket` میسازد.
|
||||
3. مرورگر درخواست HTTP Upgrade را ارسال میکند.
|
||||
4. FastAPI اتصال WebSocket را قبول میکند.
|
||||
4. برنامهی FastAPI اتصال WebSocket را قبول میکند.
|
||||
5. مدیر اتصال، کاربر را در لیست اتاق ذخیره میکند.
|
||||
6. پیام به صورت JSON از مرورگر به سرور فرستاده میشود.
|
||||
7. سرور پیام را برای کاربران همان اتاق پخش میکند.
|
||||
8. مرورگرها پیام جدید را بدون تازهسازی صفحه نمایش میدهند.
|
||||
|
||||
## اسلاید ۱۰ - مزایا و معایب
|
||||
## مزایا و معایب
|
||||
|
||||
WebSocket برای سیستمهای بلادرنگ بسیار کاربردی است، اما برای همه صفحههای وب انتخاب لازم یا مناسب نیست.
|
||||

|
||||
|
||||

|
||||
وبسوکت برای سیستمهای بلادرنگ بسیار کاربردی است، اما برای همه صفحههای وب انتخاب لازم یا مناسب نیست.
|
||||
|
||||
## اسلاید ۱۱ - مزایا
|
||||
|
||||
- تاخیر کم، چون ارتباط باز میماند.
|
||||
- امکان ارسال فوری داده از سمت سرور به مرورگر.
|
||||
- مناسب برای چت، اعلان، ابزارهای همکاری، بازی و داشبورد زنده.
|
||||
- کاهش سربار سرآیندهای تکراری HTTP بعد از دستدهی اولیه.
|
||||
- مدل برنامهنویسی ساده برای ارتباط پیوسته و دوطرفه.
|
||||
+ **مزایا**
|
||||
- تاخیر کم، چون ارتباط باز میماند.
|
||||
- امکان ارسال فوری داده از سمت سرور به مرورگر.
|
||||
- مناسب برای چت، اعلان، ابزارهای همکاری، بازی و داشبورد زنده.
|
||||
- کاهش سربار سرآیندهای تکراری HTTP بعد از دستدهی اولیه.
|
||||
- مدل برنامهنویسی ساده برای ارتباط پیوسته و دوطرفه.
|
||||
|
||||
## اسلاید ۱۲ - معایب
|
||||
+ **معایب**
|
||||
- اتصالهای طولانیمدت از منابع سرور استفاده میکنند.
|
||||
- مقیاسپذیری روی چند سرور به طراحی بیشتر نیاز دارد.
|
||||
- قطع اتصال، اتصال دوباره و خطاهای شبکه باید مدیریت شوند.
|
||||
- بعضی پراکسیها یا دیوارههای آتش ممکن است تنظیم درست برای WebSocket بخواهند.
|
||||
- برای صفحههای ساده CRUD معمولا لازم نیست.
|
||||
|
||||
- اتصالهای طولانیمدت از منابع سرور استفاده میکنند.
|
||||
- مقیاسپذیری روی چند سرور به طراحی بیشتر نیاز دارد.
|
||||
- قطع اتصال، اتصال دوباره و خطاهای شبکه باید مدیریت شوند.
|
||||
- بعضی پراکسیها یا دیوارههای آتش ممکن است تنظیم درست برای WebSocket بخواهند.
|
||||
- برای صفحههای ساده CRUD معمولا لازم نیست.
|
||||
## برنامه اجرای دمو
|
||||
|
||||
## اسلاید ۱۳ - چرا پروژه ساده نگه داشته شده است؟
|
||||
1. سرور را با دستور زیر اجرا کنید:
|
||||
|
||||
در این پروژه عمدا ثبتنام، پایگاه داده، احراز هویت، تاریخچه پیامها و پیچیدگیهای استقرار اضافه نشدهاند.
|
||||
```bash
|
||||
uvicorn app.main:app --reload
|
||||
```
|
||||
|
||||
هدف این است که رفتار اصلی WebSocket واضح دیده شود:
|
||||
|
||||
- باز شدن اتصال
|
||||
- ورود به اتاق
|
||||
- ارسال پیام
|
||||
- پخش پیام برای کاربران اتاق
|
||||
- بسته شدن اتصال
|
||||
|
||||
این سادگی پروژه را برای ارائه کلاسی مناسبتر میکند.
|
||||
|
||||
## اسلاید ۱۴ - برنامه اجرای دمو
|
||||
|
||||
1. سرور را با دستور `uvicorn app.main:app --reload` اجرا کنید.
|
||||
2. برنامه را در دو تب مرورگر باز کنید.
|
||||
3. در هر تب یک نام متفاوت وارد کنید.
|
||||
4. هر دو کاربر وارد یک اتاق شوند.
|
||||
5. از یک تب پیام ارسال کنید.
|
||||
6. دریافت فوری پیام در تب دوم را نشان دهید.
|
||||
7. یکی از کاربران را قطع کنید و تغییر فهرست کاربران آنلاین را نمایش دهید.
|
||||
|
||||
## اسلاید ۱۵ - جمعبندی
|
||||
|
||||
WebSocket مشکل ارتباط بلادرنگ در وب را با تبدیل یک اتصال HTTP به یک کانال پایدار و دوطرفه حل میکند.
|
||||
|
||||
در این چتروم، همین مفهوم با یک بخش سرور کوچک FastAPI و یک رابط فارسی ساده نمایش داده شده است.
|
||||
BIN
docs/presentation.pdf
Normal file
BIN
docs/presentation.pdf
Normal file
Binary file not shown.
Reference in New Issue
Block a user