آموزش جامع پروتکل وب‌ساکت (WebSockets) – تسلط بر توسعه وب - آخرین آپدیت

مقدمه‌ای بر وب‌ساکت‌ها WebSockets Introduction

• مقدمه بخش Section Intro

• اینترنت چیست؟ What Is the Internet?

• پروتکل HTTP چیست؟ What Is the HTTP Protocol

• استفاده از Wireshark برای اثبات پایداری TCP Using Wireshark to Prove TCP Is Persistent

• تکنولوژی‌های AJAX و Comet AJAX and Comet

• مقدمه‌ای بر وب‌ساکت‌ها WebSockets Introduction

• تاریخچه و مشخصات وب‌ساکت WebSocket History and Specifications

• استانداردهای RFC؛ آیا می‌دانستید؟ RFCs - Did You Know?

• موارد استفاده از وب‌ساکت WebSocket - Use Cases

• وب‌ساکت به عنوان یک پروتکل ارتباطی WebSockets as a Communications Protocol

• بررسی پروتکل HTTP با استفاده از کنسول مرورگر و CURL Examining the HTTP protocol using Dev Console and CURL

• آشنایی با WebSockets، TCP و IP Introduction to WebSockets, TCP, and IP

• مفهوم MTU و حداکثر اندازه سگمنت (MSS) MTU and Maximum Segment Size

• خلاصه TCP و IP Summary of TCP and IP

شبکه‌سازی در وب‌ساکت WebSocket Networking

• مقدمه‌ای بر TCP Handshake TCP Handshake Introduction

• بررسی TCP Handshake در Wireshark Examining the TCP Handshake in Wireshark

• مدل TCP/IP (مدل ۴ لایه) The TCP/IP model (4 layer model)

• لایه ۱: لایه اپلیکیشن Layer 1: Application Layer

• لایه ۲: لایه ترنسپورت و پورت‌ها Layer 2: Transport Layer - Ports

• مثال: ایجاد شماره پورت سفارشی برای برقراری اتصال Example: Creating a Custom Port Number to Establish a Connection

• لایه ۲: لایه ترنسپورت؛ سگمنت‌ها و هدرها Layer 2: Transport Layer: Segments and Headers

• لایه ۳: لایه اینترنت Layer 3: Internet Layer

• لایه ۴: لایه شبکه و آدرس‌های MAC Layer 4: Network Layer & MAC addresses

• استفاده از Tracert برای تحلیل Hopها و خلاصه لایه شبکه Using Tracert to Analyze Hops, and Network Layer Summary

• جمع‌بندی؛ وب‌ساکت‌ها و لایه‌های شبکه Summary - WebSockets and the Network Layers

• تفاوت Sockets و WebSockets Sockets vs WebSockets

باز کردن اتصال وب‌ساکت Opening A WebSocket Connection

• مقدمه بخش Section Intro

• باز کردن یک اتصال وب‌ساکت Opening a WebSocket Connection

• فرآیند HTTP Handshake The HTTP Handshake Process

• بررسی WebSocket API در کنسول و TCP Handshake The WebSocket API in the Dev Console and the TCP Handshake

• وب‌ساکت یک API رویداد-محور است WebSocket is an Event-Driven API

• تفاوت هدرهای End-to-End و Hop-by-Hop در HTTP End-to-End vs Hop-by-Hop HTTP Headers

• توضیح هدرهای Upgrade و Connection The Upgrade and Connection Headers Explained

• مقدمه‌ای بر هدرهای Sec-WebSocket Sec-WebSocket- Headers Introduction

• بررسی هدر Sec-WebSocket-Key Sec-WebSocket- Key Header

• محاسبه دستی Sec-WebSocket-Key Manually Calculating Sec-WebSocket-Key

• نکات نهایی درباره Sec-WebSocket-Key Final Words on Sec-WebSocket-Key

• مقدمه‌ای بر کدگذاری Base64 Base64 Encoding - Intro

• خلاصه و مثال کدگذاری Base64 Base64 Encoding - Summary and Example

• مثال جذاب: چگونه ایموجی را کدگذاری کنیم؟ Fun Example: How to Encode the Rocket Emoji?

• بررسی Sec-WebSocket-Accept Sec-WebSocket-Accept

• بررسی Sec-WebSocket-Protocol Sec-WebSocket-Protocol

• نسخه وب‌ساکت و افزونه‌های Sec-WebSocket-Extensions Sec-WebSocket-Version & Sec-WebSocket-Extensions

• خلاصه بخش و جمع‌بندی Section Summary & Outro

استفاده از API وب‌ساکت Using the WebSocket API

• مقدمه بخش Section Intro

• شیء Client WebSocket و باز کردن اتصال The Client WebSocket Object - Opening a WebSocket Connection

• معرفی و بررسی کلی پروژه Project Introduction and Overview

• دموی وب‌ساکت؛ ساختار HTML WebSocket Demo - Building the HTML

• دموی وب‌ساکت؛ استایل‌دهی با CSS WebSocket Demo - Building the CSS

• کد سرور وب‌ساکت؛ بخش اول: ایجاد سرور HTTP WebSocket Server Code - Part 1 - Creating the HTTP server

• کد سرور وب‌ساکت؛ بخش دوم: نصب ماژول websocket با NPM WebSocket Server Code - Part 2 - Importing the "websocket" Module Using NPM

• کد سرور وب‌ساکت؛ بخش سوم: راه‌اندازی سرور وب‌ساکت WebSocket Server Code - Part 3 - Spinning Up Our WebSocket Server

• پروژه: استفاده از WebSocket API برای برقراری اتصال Project: The WebSocket API - Establishing a WebSocket Connection

• سازگاری وب‌ساکت‌ها با HTTP WebSockets Are HTTP Compatible

• مثال: اجرای همزمان چندین اتصال سوکت توسط سرور Example- A Server Can Run Multiple Socket Connections Simultaneously

• بررسی binaryType و bufferedAmount در API وب‌ساکت WebSocket API - binaryType and bufferedAmount

• بررسی Extensions و Protocols در API وب‌ساکت WebSocket API - Extensions and Protocols

• آشنایی با ویژگی readyState Introduction to the readyState Property

• کد پروژه: غیرفعال کردن دکمه و افزودن به‌روزرسانی وضعیت Project Code - Disable Button When Clicked, and Add Dynamic Status Update

• پروژه: گوش دادن به رویداد Open Project: Listen for the Open Event

• استفاده از رویداد onopen برای تغییر متن به صورت پویا Using the "onopen" Event to Change Text Dynamically

• پیام‌ها و داده‌های وب‌ساکت؛ مقدمه WebSocket Messages and Data - Introduction

• پروژه: گوش دادن به رویداد Message Project: Listening for the Message Event

• استایل‌دهی به المان جدول Styling Our Table Element

• پروژه: گوش دادن به رویداد Close Project: Listening for the Close Event

• پروژه: گوش دادن به رویداد Error Project: Listening for the Error Event

• کدهای بستن اتصال و ویژگی wasClean Closure Codes and the wasClean Property

• بررسی هر ۴ مقدار ویژگی readyState Examining All 4 Values of the readyState Property

• متدهای API وب‌ساکت: send() و close() WebSocket API Methods - send() and close()

• رابط‌های CloseEvent و MessageEvent The CloseEvent and MessageEvent Interface

• پروژه: ارسال داده به سرور با متد send() Project: Using the send() Method to Send Data to the Server

• بستن یک اتصال Closing a Connection

• پروژه: بستن اتصال وب‌ساکت با متد close() Project: Using the close() Method to Close the WebSocket Connection

• آرگومان Reason در متد close() The "Reason" Argument to the close() Method

• بررسی Handshake بسته شدن در سطح TCP و وب‌ساکت Examining the Closing Handshake at the TCP & WebSocket Level

• چالش: بهینه‌سازی کد پروژه Challenge: Improve Project Code

• راه حل: اصلاح کد برای مدیریت انواع مختلف بستن اتصال Solution: Amending Project Code to Handle Different Closure Types

• استفاده از Switch Expression برای بهبود کد Using the Switch Expression to Improve Code

• درس جذاب: بررسی کد وب‌ساکت در Live Server Fun Lecture - Examining Live Server WebSocket Code

فریم‌های داده وب‌ساکت WebSocket Data Frames

• مقدمه بخش Section Intro

• نحوه مدیریت داده‌ها در HTTP/1.1 How HTTP/1.1 Handles Data

• نحوه مدیریت داده‌ها در HTTP/2 How HTTP/2 Handles Data

• استخراج کلیدهای SSL/TLS و تنظیم Wireshark برای ترافیک HTTP/2 Capturing SSL/TLS Keys and Configuring Wireshark to Capture HTTP/2 Traffic

• فریم‌های باینری HTTP/2؛ مقدمه‌ای بر مذاکره پروتکل HTTP/2 HTTP/2 Binary Frames - Intro to How the HTTP/2 Protocol Is Negotiated

• فریم‌های باینری HTTP/2؛ آشنایی با HPACK HTTP/2 Binary Frames - Intro to HPACK

• فریم‌های باینری HTTP/2؛ ساختار یک فریم HTTP/2 Binary Frames - What a Frame Looks Like

• فریم‌های وب‌ساکت؛ ۶ نوع اصلی WebSocket Frames - The 6 Types

• بررسی فریم بسته شدن وب‌ساکت (Opcode 0x8) Examining a WebSocket Closure Frame - Opcode 0x8

• بررسی فریم Ping وب‌ساکت (Opcode 0x9) Examining a WebSocket Ping Frame - Opcode 0x9

• اندازه هدر فریم وب‌ساکت؛ حداقل و حداکثر WebSocket Frame Header Size - Min and Max

• تکه‌تکه شدن داده‌های وب‌ساکت (Fragmentation) WebSocket Data Fragmentation

• بیت‌های رزرو شده در وب‌ساکت چه کاربردی دارند؟ What Are WebSocket Reserved Bits Used For?

• فریم‌های کنترلی و غیرکنترلی Control and Non-Control Frames

• بیت ماسک‌گذاری (Masking Bit) Masking Bit

• مقدمه‌ای بر ماسک‌گذاری Masking - Introduction

• مثالی از Cache Poisoning Example of Cache Poisoning

• بیت‌های طول Payload Payload Length Bits

• حداکثر اندازه Payload در یک فریم وب‌ساکت Maximum Size of a WebSocket Frame Payload

• مقایسه HTTP و WebSockets HTTP vs WebSockets

• جمع‌بندی Outro

مباحث AJAX، Polling، Server Sent Events و CORS AJAX, Polling, Server-Sent Events, and CORS

• تصورات غلط درباره اتصالات همزمان وب‌ساکت Misconceptions About Concurrent WebSocket Connections

• Short Polling؛ جایگزینی برای وب‌ساکت Short Polling - An Alternative to WebSockets

• Long Polling؛ جایگزینی برای وب‌ساکت Long Polling - An Alternative to WebSockets

• Server Sent Events؛ جایگزینی برای وب‌ساکت Server-Sent Events - An Alternative to WebSockets

• وب‌ساکت روی HTTP/2 WebSockets Over HTTP/2

• آیا HTTP/2 جایگزین وب‌ساکت می‌شود؟ Does HTTP/2 Replace WebSockets?

• وب‌ساکت روی HTTP/3 WebSockets Over HTTP/3

• مباحث CORS و وب‌ساکت CORS and WebSockets

• مقیاس‌بندی وب‌ساکت‌ها Scaling WebSockets

جمع‌بندی نهایی Outro

• جمع‌بندی نهایی Outro