معرفی
ممکن است شما علاقه مند به یادگیری HTML5 از اولین مقاله این مجموعه باشید زیرا این سومین قسمت از مجموعه Learn HTML5 من است.
رویدادهای ارسال شده توسط سرور
رویدادهای ارسال شده از سرور (SSE) یک مشخصات اخیر HTML5 در ترکیب با EventSource API است که برای پخش جریانی بهروزرسانی طراحی شده است. قبل از آن ممکن است با کانال ارتباطی دو طرفه، معروف به WebSockets آشنا باشید، که بسیار مورد استفاده قرار میگیرد و تعداد زیادی از پیادهسازی سرور در اینترنت موجود است. با این حال، دومین فناوری فشار سرور HTML5 هنوز در سایه باقی مانده است.
برای فعال کردن جریان کارآمد از سرور به مشتری داده رویداد، اساساً مبتنی بر متن است. به عنوان مثال، اعلانها یا بهروزرسانیهای بیدرنگ، مانند فیسبوک، توییتر، بهروزرسانیهای بورس و غیره در سرور ایجاد میشوند. اساساً ما دو نوع مؤلفه زیر را داریم که SSE معرفی می کند:
- رابط EventSource
- جریان رویداد
رابط EventSource به مشتری اجازه میدهد تا اعلانهای فشاری را از سرور بهعنوان رویدادهای DOM و قالب داده «جریان رویداد» که برای ارائه بهروزرسانیهای فردی استفاده میشود، دریافت کند.
برای مدت طولانی، ما قبلاً پروتکل HTTP را به عنوان یک مدل درخواست-پاسخ در نظر می گرفتیم که از ارتباط دوطرفه استفاده می کند، به عبارت دیگر زمانی که شما به عنوان یک کلاینت درخواستی را به سرور ارسال می کنید و منتظر پاسخ می مانید و سپس دوباره درخواست آینده را ارسال می کنید. چه چیزی برای شما روشن است.؟ در اینجا مشاهده می کنید که سرور نمی تواند با مشتری ارتباط برقرار کند مگر اینکه درخواست شود، این فرآیند COMET نیز نامیده می شود.
نمودار جریان COMET
![](https://www.c-sharpcorner.com/UploadFile/manish1231/learn-html5-part-3-server-sent-events-apis/Images/SSE1.jpg)
کاربردهای دنباله دار را می توان به طور کلی به عنوان دسته بندی کرد
جریان
در جریان، سرور وب/برنامه برای مدت طولانی باز نگه داشته می شود.
نظرسنجی طولانی
در نظرسنجی، سرور اتصال را نگه می دارد تا زمانی که داده هایی برای فشار دادن داشته باشد، سپس مشتری باید یک درخواست نظرسنجی جدید را باز کند.
پخش جریانی با iframe مخفی
در این، صفحه HTML حاوی یک iframe مخفی است و به عنوان یک بلوک تکهتکه ارسال میشود، که به طور ضمنی آن را بهعنوان بینهایت طولانی اعلام میکند.
پخش جریانی با XHR
شی XMLHttpRequest در جاوا اسکریپت که توسط برنامه های Ajax برای ارتباط مرورگر و سرور استفاده می شود.
نظرسنجی طولانی XHR
مشتری درخواستی را از طریق شی جاوا اسکریپت XMLHttpRequest ارسال می کند.
نظرسنجی طولانی تگ اسکریپت
فرآیند تقریباً مشابه XHR Long Polling است اما کد اسکریپت در یک تگ <script> جاسازی شده است.
رویدادهای ارسال شده از سرور برای کاهش هزینه های سربار تنها راه ارتباطی دو طرفه قبلی طراحی شده اند. در HTML5 ما یک روش بومی برای مدیریت SSE داریم، یک API در HTML5 تعریف شده است که یک اتصال HTTP را برای دریافت اعلانهای فشار هر چند وقت یکبار از یک سرور باز میکند.
![](https://www.c-sharpcorner.com/UploadFile/manish1231/learn-html5-part-3-server-sent-events-apis/Images/SSE2.jpg)
با استفاده از SSE می توانید پخش جریانی مبتنی بر رویداد را از طریق HTTP فعال کنید. همانطور که در تصویر بالا مشاهده کردید، اتصال یک طرفه است تا سرور بتواند به روز رسانی ها را برای مشتری ارسال کند. شما فقط باید یک شی EventSource را از طریق JS ایجاد کنید و سرور دادههای رویداد را در زمانی که بهروزرسانی بدون پایان دادن به جریان شروع میشود، شستشو میدهد.
موارد زیر مهمترین نکات جالب EventSource است که باید بدانید:
- new EventSource(URL): برای ایجاد یک شی EventSource استفاده می شود که شروع به گوش دادن به رویدادها می کند.
- readyState: آمادهاستیت به ما میگوید که در حال اتصال، باز یا بسته شدن هستیم.
- onopen، onmessage: هنگامی که شیء EventSource جدید رخ می دهد، شروع می شود.
- addEventListener: برای پیام های پیش فرض و پیام های سفارشی با addEventListener استفاده می شود.
- event.data: برای رمزگذاری و رمزگشایی شی با استفاده از ویژگی داده شی رویداد استفاده می شود.
- close: اتصال را از سمت سرویس گیرنده می بندد.
در شکل زیر نحوه عملکرد SSE پس از اتصال کلاینت/سرور را مشاهده خواهید کرد.
![](https://www.c-sharpcorner.com/UploadFile/manish1231/learn-html5-part-3-server-sent-events-apis/Images/SSE3.jpg)
اولین نمونه ای که در سمت سرور شروع می شود OutboundEvent است. زمانی که هر رویداد جدیدی تولید میشود و حاوی دادههایی است که به کلاینت ارسال میشود شروع میشود و در اینجا همانطور که ممکن است متوجه شوید وقتی سرور دادهها را برای مشتری ارسال میکند، همیشه در قالب سریالی خواهد بود. بنابراین، در اینجا OutboundEventWriter وارد فرآیند می شود و داده ها را در سمت سرور سریال می کند و این بار باید نوع رسانه داده ها را در OutboundEvent مشخص کنید. هیچ محدودیتی برای ارائه انواع رسانه های خاص وجود ندارد.
اکنون در سمت کلاینت، InboundEvent مسئول رسیدگی به داده های دریافتی از سرور است و از نظر خوانایی از InbounEventReader برای غیر سریالی کردن داده ها استفاده می شود.