آموزش HTML 5 > دریافت آپدیت های ارسالی از سرور > متد SSE
متد ( SSE ( Server-Sent Events - رویدادهای طرف سرور :
SSE قابلیت جدیدی در Html5 است که به مرورگر این امکان را می دهد تا آپدیت های ارسالی
از طرف سرور را دریافت کند . این قابلیت در گذشته بصورت دیگری وجود داشته است . هر
زمان که آپدیتی ایجاد می شد مرورگر از کاربر برای دریافت و اعمال آپدیت ارسالی سوال
می کرد . اما با SSE این کار بصورت اتوماتیک و پشت پرده صورت می گیرد .
مثال هایی برای این آپدیت عبارتند از : تغییر عناوین خبرها ، نتایج ورزشی ، تغییر
در شاخص ها ونمودارهای سایت های اقتصادی و قیمت ... .
پشتیانی در مرورگر های مختلف :
این خاصیت در تمام مرورگرهای اصلی به جزء IE پشتیانی می شود .
مرحله اول : مرحله اول : چک کردن اینکه مرورگر از SSE پشتیبانی می کند
یا خیر ؟
بهتر است اینکه آیا مرورگر کاربر از متد SSE پشتیبانی می کند یا خیر را ، ابتدا بررسی
کنیم تا در هر حالت کد خود را بر مبنای آن بنویسیم . قطعه کد زیر بررسی می کند که آیا
مرورگر از متد SSE پشتیبانی می کند یا خیر و کد لازم را در هر صورت اجرا می نماید .
چک کردن
پشتیبانی مرورگر
|
if ( typeof ( EventSource ) !== " undefined " )
{
// SSE پشتیانی مرورگر از
// کدهای مورد نظر
}
else
{
// SSE عدم پشتیبانی مرورگر
از
// کدهای مورد نظر
}
|
مرحله دوم : دریافت آپدیت های ارسالی از سرور .
شی EventSource برای دریافت اطلاعات در آپدیت های ارسالی از طرف سرور به کار می رود
. شکل کلی استفاده از این شی بصورت زیر است .
چک کردن
پشتیبانی مرورگر
|
var source = new EventSource ( "demo_sse.php" ) ;
source.onmessage=function(event)
{
document.getElementById("result").innerHTML+=event.data
+ "<br/ > ";
};
|
توضیح کد بالا :
- در خط اول یک شی جدید EventSource با نام source را ایجاد کرده و صفحه demo_sse.php
را به عنوان URL یا آدرس فایلی که آپدیت را به صفحه ارسال می کند تعیین کرده ایم .
- هر زمان که آپدیت جدیدی دریافت شود رویداد On Message اجرا می شود .
- هر زمان که رویداد onmessage اجرا می شود نتیجه خروجی در عنصر با id معادل Result
آپدیت و به روز رسانی می شود .
نکته : آپدیت ارسالی در شی event.data قرار دارد .
یک فاز مهم : کد لازم برای تولید آپدیت از سرور :
برای دریافت آپدیت باید صفحه ای وجود داشته باشد که قابلیت تولید و ارسال آپدیت را
داشته باشد . برای مثال یک صفحه PHP یا ASP .
کد سرور ساید برای ارسال آپدیت بسیار ساده است . کافی است در صفحه PHP یا ASP ، مقدار
خاصیت Content-Type صفحه را بر روی مقدار text/event-stream قرار دهید . در جدول های
زیر کد لازم را در هر دو زبان نمایش داده ایم :
کد لازم
PHP
|
<?php
header('Content-Type: text/event-stream');
header('Cache-Control: no-cache');
$time = date( ' r ' ) ;
echo "data: The server time is: {$time}\n\n";
flush( );
?>
|
کد لازم
ASP
|
<%
Response.ContentType="text/event-stream"
Response.Expires=-1
Response.Write("data: " & now())
Response.Flush()
%>
|
موارد مختلف کدهای بالا :
- مشخص نمایید که صفحه نباید اطلاعات را Cashe ( ذخیره ) نماید .
- داده ها را برای ارسال آماده نمایید ( همواره با کلمه data ) شروع می شود .
- خروجی و نتیجه را به صفحه درخواست کننده ارسال نمایید ( با استفاده از متد ( ) Flush
).
راجع این مطلب
سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...
>>>>> ورود به انجمن تخصصی
نظر خودتان درباره این صفحه را با ما در میان بگذارید :