با به كارگيري از AJAX در اسكريپت ها و صفحه هاي اينترنت

۶۰ بازديد
با به کارگیری از AJAX در اسکریپت ها و برگه های اینترنت می توانیم بدون بار گذاری مجدد کاغذ، درخواست هایی را به سمت سرور ارسال کرده و نتایج را دریافت کنیم. در‌این نوشته‌ی علمی فراگیری بی آلایش به کار گیری از ajax در PHP هم پا با مثال های بی آلایش خوا‌هیم اظهار‌کرد. ابتدا شیوه عملکرد ajax را می بینم و آن‌گاه به به کارگیری از AJAX با JQuery خوا‌هیم پرداخت.

ایجکس (AJAX) چه می باشد ؟ایجکس یا این که طراحی سایت فروشگاهی در مشهد آجاکس مخفف عبارت Asynchronous JavaScript and XML به معنای جاوا اسکریپت و XML ناهمگام میباشد.
به طور خیلی بی آلایش، AJAX این قابلیت و امکان را به ما می دهد تا سوای توشه گذاری (Refresh) یک کاغذ اینترنت، اطلاعاتی را به سمت سرور ارسال کرده و فایده را دریافت کنیم.
به طور معمول، زمانی می‌خواهیم وارد صفحه ای تازه شویم یا این که اطلاعات یک فرم را برای سرور ارسال کنیم، کاغذ اینترنت رفرش می گردد. با به کار گیری از AJAX خوا هیم توانست سوای نیاز به رفرش برگه، اطلاعات را ارسال و یا این که محتوای کاغذ جدید را دریافت کنیم.
از بزرگترین مزایای این فعالیت میتوان به موردها پایین اشاره کرد:
به دست‌کم رساندن اطلاعات ارسالی و دریافتی از سرورعدم نیاز به دانلود بی نقص یک کاغذ در هر بار بارگذاری برگه هابهبود رابط کاربری و تجربه کاربری اینترنت سایتبه کارگیری از AJAX چه‌طور به بهبود تجربه کاربری یاری می‌نماید ؟فرض فرمایید یک فرم تماس با ما در سایت شما موجود هست که یوزرها می خواهند آنرا کامل شدن و برای شما ارسال نمایند. به طور پیشفرض، پس از ارسال فرم، کاغذ دوباره توشه گذاری گردیده و منفعت به به کارگیری کننده اکران داده میگردد.
اما با به کار گیری از AJAX سوای رفرش ورقه، پیام را ارسال کرده و فایده پایانی را در به عبارتی جا به به کارگیری کننده اکران می‌دهیم.
افزایش سرعت فعالیت انجام یافته و ارائه واکنش دیدنی خیس به استعمال کننده، می‌تواند به بهبود UX وبسایت یاری دهد.

نحوه فعالیت AJAX در یک صفحه اینترنتیک فرایند AJAX جمعاَ فرایند زیر را طی مینماید.
به کار گیری کننده کاغذ اینترنت را باز مینماید.با انجام فعالیتی، یک درخواست AJAX اجرا می گردد.در آغاز تمام اطلاعات مایحتاج برای ارسال درخواست گردآوری می‌شود. (نظیر اطلاعات تماس به کار گیری کننده در فرم)اطلاعات گردآوری گردیده به سمت سرور ارسال می گردد. (معمولاً به طور POST)فایده این درخواست دریافت گردیده و بسته به منفعت کارهایی انجام می شود.ممکن میباشد با اعتنا به فیض درخواست، اطلاعاتی در برگه تغییر‌و تحول پیدا نماید. (برای اکران پیغام فیض و یا این که تغییر تحول محتوای صفحه)
مثلاً در هنگام به کار گیری از AJAX در PHP، پیغام پیروزی آمیز بودن ارسال فرم را با ایجاد یک المنت تازه در کاغذ اکران می‌دهیم.

به کار گیری از AJAX با جاوا اسکریپتبرای ارسال یک درخواست AJAX طریق های متفاوتی وجود دارد. وی‌لین وضعیت ممکن به کار گیری از شی ءها جاوا اسکریپتی میباشد.
مزیت این روش این میباشد که نیاز به هیچ کتابخانه طولانی خیس تری نخواهید داشت! ولی شاید یه خرده مشقت بار خیس و حیران کننده خیس نسبت به بقیه طریق های معمول باشد.
قطعه کد ذیل یک درخواست POST را به صورت ایجکس به فایل contact.php ارسال مینماید.

1234567891011121314151617181920var ajx = new XMLHttpRequest(); ajx.onreadystatechange = function() { if(ajx.readyState === 4 && ) {
if(ajx.status === 200) { alert(ajx.responseText);
} else if (ajx.status === 404) { alert("صفحه مقصد وجود ندارد");

} else { alert('Error Mes***e: ' + ajx.statusText); } }}
ajx.open('POST', 'contact.php');ajx.send("name=Omid&age=21");
همان گونه که در قطعه کد بالا میبینید، این کار از سه بخش اصلی تاسیس شده است.
در بالا یک شئ XMLHttpRequest تولید می کنیم.آنگاه با به کار گیری از تابع onreadystatechange() معین می‌کنیم در هنگام تغییر تحول شرایط درخواست چه اتفاقاتی رخ دهد.در پایان نیز با متد open() نوع درخواست و مقصد آنرا معلوم کرده و با تابع send() درخواست را ارسال می‌کنیم.برای ارسال پارامترهای مایحتاج، بایستی آن ها را به صورت حرفه اطلاعاتی (Data String) و به عنوان ورودی send() بدهیم.

شئ درخواست (XMLHttpRequest) دارای یک خصوصیت با نام readyState میباشد. این متغیر معلوم کننده موقعیت فعلی درخواست میباشد. چهار مقدار متفاوت برای این متغیر در حیث گرفته می گردد:
وضعیت 1 یا این که OPENED : وقتی که شئ ایجاد می گردد در‌این شرایط قرار داریم.موقعیت 2 یا این که HEADERS_RECEIVED : زمانی که سرآیندهایی برای درخواست تمجید شده است.شرایط 3 یا این که LOADING : درخواست به سرور ارسال گردیده و در انتظار دریافت پاسخ هستیم.موقعیت 4 یا این که DONE : درخواست ارسال گردیده و پاسخ دریافت شده است.
در کد بالا ابتدا گشوده بینی کردیم که در وضعیت 4 قرار داشته باشیم، یعنی پاسخ را دریافت کرده ایم. حالا با گشوده نگری شرایط درخواست (کد درخواست) میتوان موقعیت های ممکن برای یک درخواست را آیتم گشوده بینی قرار اعطا کرد.
با توجه به هر وضعیت، خوا هیم توانست عکس العمل مختلفی نشان دهیم.

AJAX چیست و چگونه کار می کند؟

با کمک AJAX می توانیم صفحات وب پویا ایجاد کنیم و بلافاصله بدون ارسال مجدد درخواست به سرور، تغییرات به روزرسانی و نمایش داده می شوند. با استفاده از AJAX فقط داده ها یا اطلاعات مهم به جای کل صفحه وب به سرور ارسال می شوند و این باعث می شود تا بار روی سرور از بین برود. در نتیجه پردازش و بارگیری صفحات تعاملی سریعتر خواهد شد.

نحوه کار AJAX

  • کاربر یک رویداد را روی صفحه وب فعال می کند، مانند کلیک روی یک باتن.
  • HTTPRequest (درخواست HTML) با استفاده از شی XMLHTTPRequest به سرور ارسال می شود. این شی با پارامتر درخواست روی شبکه پیکربندی شده است.
ارسال نظر آزاد است، اما اگر قبلا در فارسی بلاگ ثبت نام کرده اید می توانید ابتدا وارد شوید.