در این قسمت از آموزش Ajax به معرفی ارسال درخواست به سرور با شی XMLHttpRequest می پردازیم . این درخواست اطلاعات لازم را به سرور ارسال کرده و یک فایل که حاوی اسکریپت ، اطلاعات و یا دستور لازم برای ایجاد تغییر در صفحه است را بر روی سرور باز می کند . در ادامه در این بخش از مقالات طراحی سایت ، اطلاعات بیشتری را در اختیار شما قرار می دهیم با ما همراه باشید.
سرور پس از باز کردن فایل درخواستی ، آن را پردازش کرده و پاسخ لازم را به کامپیوتر کاربر ارسال می کند .
برای انجام این عملیات از 2 متد ( ) send و ( ) open شی XMLHttpRequest استفاده می شود . با متد ( ) open ابتدا درخواست ساخته شده و سپس با متد ( ) send ارسال می شود .
شکل کلی ارسال یک درخواست به سرور به صورت زیر است :
xmlhttp.open( metohd , url , async) ;
xmlhttp.send ( " text " ) ;
مثال :
xmlhttp.open("GET","ajax_info.txt",true);
xmlhttp.send( );
این متد درخواست را ایجاد کرده ودارای سه پارامتر اصلی زیر است . به وسیله این پارامترها متد نحوه ارسال اطلاعات ، آدرس فایلی که بر روی سرور باید باز شود و اینکه آیا درخواست به صورت asynchronous یا synchronous باشد ، تعیین می شود .
method تعیین کننده نحوه ارسال اطلاعات به سرور توسط شی XMLHttpRequest است . دو روش برای این منظور وجود دارد : GET یا POST
متد GET سریعتر و ساده تر از متد POST است . در متد GET اطلاعات ارسالی به سرور به ادامه نام فایل درخواستی ( URL ) اضافه می شوند ، اما در متد POST اطلاعات به صورت مخفی و پشت پرده به سرور منتقل می شوند .
معمولا از متد GET برای ارسال اطلاعات استفاده می شود . اما در موارد زیر باید از متد POST استفاده کنید :
هنگامی که نمی خواهید اطلاعات به صورت Cashed باشند . یعنی اطلاعات درون حافظه سرور باقی مانده و ممکن است در درخواست های بعدی از اطلاعات تکراری استفاده شود . برای مثال در عملیات update یک فایل و یا ارسال و دریافت اطلاعات از پایگاه داده از متد Post استفاده کنید .
حجم اطلاعات ارسالی زیاد باشد . متد GET در حجم اطلاعات ارسالی بسیار محدود بوده و در حجم های اطلاعات بالا باید از متد POST استفاده نمایید .
هنگامی که می خواهید اطلاعات حساسی مثل رمز عبور را منتقل کنید ، باید از متد POST استفاده شود . زیرا در متد GET اطلاعات ارسالی به انتهای نام فایل درخواست شده اضافه شده و به همین دلیل قابل رویت هستند . اما در متد POST اطلاعات به صورت مخفی و پشت پرده منتقل می شوند .
مثال ارسال درخواست با متد GET :
مثال 1 :xmlhttp.open( "GET" , "ajax_info.txt" , true ) ;
ارسال با متد GET : xmlhttp.send( );
2. مثال ارسال درخواست به سرور با متد GET و فرستادن اطلاعات مورد نظر با اضافه کردن چند مقدار به ادامه نام فایل درخواستی :
مثال 2 : xmlhttp.open( "GET" , "demo_get2.asp?Name=Omid&Family=Rezaee" , true) ;
ارسال اطلاعات با متد GET : xmlhttp.send( );
3. مثال ارسال درخواست به سرور با متد POST :
مثال 3 : xmlhttp.open( "POST" , "demo_post.asp" , true ) ;
ارسال درخواست با متد POST : xmlhttp.send( );
4. مثال ارسال درخواست به سرور با متد POST و انتقال اطلاعات مورد نظر با آن:
اگر هنگام استفاده از متد POST بخواهید ، اطلاعات مورد نظرتان را نیز ارسال کنید ، باید یک HTTP header را به وسیله متد( ) setRequestHeader به متد خود اضافه کنید . سپس اطلاعات مورد نظر را با متد ( ) send به سرور ارسال کنید . کد زیر روش این کار را نمایش می دهد:
مثال 4 : xmlhttp.open( "POST" , "ajax_test.asp" , true ) ;
ارسال درخواست و اطلاعات با : xmlhttp.setRequestHeader( "Content-type" , "application/x-www-form-urlencoded" ) ;
متد POST : xmlhttp.send( "Name=Omid&Family=Rezaee" ) ;
پارامتر url در متد ( ) open ، در هنگام ارسال درخواست Ajax به سرور ، آدرس یک فایل بر روی سرور را تعیین می کند .
سرور در هنگام دریافت درخواست XMLHttpRequest ، فایلی که آدرس آن را با پارامتر url تعیین کرده اید ، باز کرده و بسته به نوع آن ، آن را پرادزش می کند . این فایل می تواند هر نوع فایلی باشد مثلا یک فایل ساده متنی باشد که حاوی مقداری اطلاعات است . همچنین می تواند یک فایل اسکریپتی مثل java script ، ASP.Net و یا PHP باشد ، که کدهای خاصی را اجرا می کند .
سرور پس از اجرای دستورات موجود در فایل مقصد ، پاسخ لازم را تولید کرده و به کامپیوتر کاربر ارسال می کند . در قسمت بعدی به آموزش نحوه دریافت این پاسخ خواهیم پرداخت .
5. در مثال زیر به تعیین آدرس یک فایل برای پارامتر url پرداخته ایم .
مثال 5 : xmlhttp.open( "POST" , "demo_post.asp" , true ) ;
تعیین فایل مقصد با استفاده از :
خاصیت url : xmlhttp.send( );