1. مهمان گرامی، جهت ارسال پست، دانلود و سایر امکانات ویژه کاربران عضو، ثبت نام کنید.
    بستن اطلاعیه

تحولی بزرگ در عرصه وب ( بخش اول )

شروع موضوع توسط minaaa ‏7/1/11 در انجمن Ajax

  1. minaaa

    کاربر پیشرفته

    تاریخ عضویت:
    ‏9/12/10
    ارسال ها:
    19,773
    تشکر شده:
    6,457
    امتیاز دستاورد:
    113

    اینترنت و مهمترین سرویس آن وب علاوه بر این که حیات بشری را در هزاره سوم دستخوش تحولات فراوانی کرده است ، توانسته است منشاء تحولات گسترده ای در سایر حوزه های فناوری گردد . در واقع ، تحول در زندگی بشریت مدیون پیشرفت در سایر حوزه های فناوری‌ است . یکی از این حوزه ها ، صنعت نرم افزار است .
    برای آشنائی با این تحول بد نیست مروری سریع داشته باشیم به گذشته وب و نرم افزار تا از این رهگذر بتوانیم ضرورت ایجاد فناورهای جدیدی نظیر Ajax ( برگرفته شده از Asynchronous JavaScript And XML ) را بهتر درک کنیم .
    مروری بر وب ، نرم افزار و تاثیر متقابل آنها بر یکدیگر
    موجودات جدیدی که ما امروزه آنها را با نام برنامه های وب می شناسیم ، ماحصل تاثیر وب بر نرم افزار و رشد رو به فزاینده استفاده از اینترنت در متن زندگی ، ماحصل تاثیر نرم افزار بر وب است . اجازه دهید ببینیم موضوع از کجا و با چه مختصاتی شروع گردید و هم اینک در چه وضعیتی به سر می بریم .
    وب ایستا : زمانی که تیم . برنرز لی در سال ۱۹۹۰ اولین پیشنهاد خود در رابطه با وب را ارائه کرد ، ایده کار بسیار ساده بود : ایجاد یک شبکه از اطلاعات متصل شده به یکدیگر با استفاده از ابرمتن ها و URIs ( برگرفته شده از Uniform Resource Identifiers ) . وب در آغاز به عنوان یک رسانه اشتراک اطلاعات مطرح گردید تا از طریق آن دانشمندان و محققین بتوانند دانش و اطلاعات را بین خود به اشتراک گذاشته و نتایج تحقیقات را با یکدیگر مبادله نمایند . ارائه دهند گان با استفاده از یک استاندارد مستند سازی ، اطلاعات خود را تهیه و آنها را به مخاطبان خود ارائه می کردند . در آغاز برای استاندارد مستند سازی از ابزاری که در آن زمان خود هنوز استاندارد نشده بود استفاده می گردید . HTML ، ابزاری است که با بکارگیری مجموعه ای از تگ ها ، استاندارد لازم جهت نمایش یک مستند در نرم افزارهای نمایش دهنده ( مرورگرها ) را فراهم می نماید . نرم افزارهای نمایش دهنده ، مجهز به مفسرهائی جهت تفسیر تگ ها و نمایش اطلاعات موجود در مستند بر اساس تعاریف از قبل تعریف شده شدند . در آن زمان که به سال های ابتدائی دهه ۹۰ میلادی برمی گردد ، چیزی با نام برنامه های وب وجود نداشت و وب به عنوان رسانه ای جهت اشتراک و مبادله اطلاعات مطرح بود . تمامی تعاملات در عرصه وب محدود به درخواست یک مستند توسط سرویس گیرنده و ارسال آن توسط سرویس دهنده بود .

    وب پویا با تمرکز بر روی پردازش های سمت سرویس گیرنده : در ادامه ، نیاز به انجام برخی پردازش های اولیه مطرح گردید . با توجه به این که اینترنت از یک بستر سرویس گیرنده و سرویس دهنده ( client server based) به منظور دریافت درخواست کاربر و پاسخ به آن استفاده می کرد ، طراحان و پیاده کنندگان برای تحقق پردازش ها بر روی دو گزینه متمرکز شدند : انجام پردازش ها در سمت سرویس گیرنده و یا سمت سرویس دهنده . در آغاز ، برای انجام پردازش ها بر روی سرویس گیرنده متمرکز شدند . با این هدف که بتوان پردازش های مورد نیاز را ( با حوزه ای که در آن زمان تعریف شده بود ) ، در سمت سرویس گیرنده انجام داد . برای تحقق خواسته فوق لازم بود که بستر و ابزارهای لازم در بطن مرورگر ها ایجاد گردد . ظهور فناورهائی نظیر Html-DOM ، جاوااسکریپت ، CSS ( برگرفته شده از cascading style sheets ) و DHTML ( برگرفته شده از Dynamic HTML ) از جمله مهمترین تلاش های انجام گرفته در آن زمان برای تحقق پردازش ها در سمت سرویس گیرنده بود . برای آشنائی بیشتر با تلاش های انجام گرفته در آن زمان بد نیست مروری سریع داشته باشیم به آنچه طی سالیان گذشته در عرصه وب اتفاق افتاده است .
    • <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">
      <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">عرضه جاوا اسکریپت : Netscape Navigator اولین مرورگر وبی بود که پس از طراحی و پیاده سازی موفقیت آمیز توانست به عنوان کاتالیزوری در رشد وب و عرضه فناوری های مرتبط با آن نقش بسیار مثبتی را ایفاء‌ کند . اغلب سازمان ها و شرکت ها از مرورگر فوق به عنوان معیار استاندارد خود برای پیاده سازی فناوری های جدید استفاده می کردند . یکی از این فناوری ها ، جاوا اسکریپت بود .
      جاو ااسکریپت توسط Brendan Eich از نت اسکیپ ایجاد و نسخه شماره دو آن در سال ۱۹۹۵ عرضه گردید . برای اولین مرتبه ، پیاده کنندگان قادر به ایجاد صفحات وبی شدند که می توانست با کاربر تعامل برخورد نماید . استفاده از جاوا اسکریپت برای معتبر سازی داده در سمت سرویس گیرنده و حذف برخی مبادلات غیره ضروری بین سرویس گیرنده و سرویس دهنده از جمله مهمترین دستاورد بکارگیری جاوا اسکریپت در آن زمان بود . بدین ترتیب نطفه پردازش های ساده در سمت سرویس گیرنده به کمک جاوا اسکریپت بسته شد . قابلیت فوق در زمانی که اکثر کاربران اینترنت از طریق یک مودم با سرعت ۸ . ۲۸ ( Kbps ) به شبکه وصل می شدند ، باعث می شد که تعداد دفعاتی که کاربران مجبور به انتظار برای دریافت یک پاسخ از سرویس دهنده باشند ، کاهش یابد . تحول فوق اولین مرحله جدی به سمت رویکرد Ajax در آن زمان بود .       <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">ایجاد فریم : در نسخه اولیه HTML با هر سند به عنوان یک موجودیت رفتار می شد تا این که در نسخه شماره چهار فریم ها معرفی گردیدند . با استفاده از فریم ها نمایش یک صفحه وب می توانست مشتمل بر بکارگیری مجموعه ای از سایر صفحات وب باشد . ایده فوق یک اصلاح ساختاری اساسی در خصوص نحوه نمایش یک صفحه وب بود . Netscape Navigator 2.0 اولین مرورگری بود که از فریم ها و جاوا اسکریپت حمایت کرد . این یک مرحله جدی به سمت رشد و توسعه Ajax در آن زمان بود .
      با توجه به این که یک فریم ، یک درخواست مجزاء را برای سرویس دهنده ایجاد می کرد ، قابلیت کنترل یک فریم و محتویات آن با استفاده از جاوا اسکریپت دنیای جدیدی را پیش روی طراحان و پیاده کنندگان صفحات وب قرار داد .       <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">روش فریم مخفی : به موازات این که پیاده کنندگان درگیر نحوه استفاده از فریم ها شدند ، یک روش جدید با هدف تسهیل در امر ارتباط بین سرویس گیرنده و سرویس دهنده مطرح گردید . روش فریم مخفی شامل تنظیم یک frameset با طول و یا عرض صفر پیکسل است که هدف اساسی آن انجام فرآیند مقداردهی اولیه با سرویس دهنده بود . فریم مخفی شامل یک فرم HTML با فیلدهای خاصی است که می توانست بطور اتوماتیک توسط جاوا اسکریپت تکمیل و برای سرویس دهنده ارسال گردد . زمانی که فریم از سرویس دهنده مراجعت می کرد ، یک تایع دیگر جاوا اسکریپت فراخوانده می شد تا اعلام نماید که داده از سمت سرویس دهنده برگردانده شده است . روش فریم مخفی ، اولین مدل درخواست و پاسخ غیرهمزمان را برای برنامه های وب به ارمغان آورد ( اولین رویکرد به مدل ارتباطی Ajax ) . <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">Dynamic HTML و DOM : تا سال ۱۹۹۶ ، وب یک دنیای ایستا را تجربه می کرد و برای تعامل محدود با کاربر از جاوا اسکریپت و روش فریم های مخفی استفاده می گردید . همچنان امکان تغییر در محتویات یک صفحه بدون نیاز به load مجدد آن از سرویس دهنده وجود نداشت . در ادامه IE 4.0 ( برگرفته شده از Internet Explorer ) توسط شرکت مایکروسافت ارائه گردید . در این نسخه علاوه بر بکارگیری اکثر فناوری های استفاده شده در Netscape Navigator ، یک ویژگی مهم دیگر با نام DHTML ( برگرفته شده از Dynamic HTML ) نیز ارائه گردید . DHTML به پیاده کنندگان اجازه می داد تا بتوانند هر بخشی از یک صفحه مستقر شده در حافظه سرویس گیرنده را با استفاده از جاوا اسکریپت تغییر دهند . DHTML به همراه عرضه غیره منتظره CSS ( برگرفته شده از cascading style sheets ) به وب و نحوه پیاده سازی صفحات وب یک نیروی تازه داد. پیاده کنندگان توانستند با ترکیب DHTML و روش فریم های مخفی هر بخشی از یک صفحه را با استفاده از اطلاعات دریافت شده از سرویس دهنده refresh نمایند . ویژگی فوق در زمان خود توانست یک تحول بزرگ در عرصه وب را ایجاد نماید .
      در ادامه ، DOM ( برگرفته شده از Document Object Model ) ارائه گردید . برخلاف DHTML که صرفا” امکان تغییر بخش هائی خاص از یک صفحه وب را فراهم می کرد ، DOM دارای یک هدف بلندپروازانه دیگر بود . هدف DOM ارائه یک ساختار برای تمامی صفحه بود . انجام عملیات و یا پردازش بر اساس ساختار فوق ، امکان تغییر یک صفحه را فراهم می آورد . این مرحله بعدی به سمت Ajax بود .       <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">Iframes : با این که روش فریم مخفی بطور غیرقابل پیش بینی متداول گردید ، ولی دارای چالش های مختص به خود بود . افرادی می بایست زمان زیادی را صرف نوشتن یک frameset می کردند تا شرایط استفاده از فریم های مخفی فراهم گردد . زمانی که عنصر </ iframe > در سال ۱۹۹۷ و به عنوان بخشی از نسخه رسمی HTML 4.0 ارائه گردید ، یک قدم اساسی دیگر به سمت انقلاب بر روی وب حرکت شد .
      در مقابل تعریف frameset ، پیاده کنندگان قادر به استفاده از فریم ها در هر مکانی از صفحه شدند . بدین ترتیب پیاده کنندگان توانستند از iframe نامرئی ( با بکارگیری قابلیت های CSS ) در یک صفحه استفاده نمایند و شرایط عملیاتی لازم جهت مبادله داده بین سرویس گیرنده و سرویس دهنده را فراهم نمایند . زمانی که نسخه نهائی DOM در IE 5.0 و Netscape 6.0 پیاده سازی گردید ، قابلیت ایجاد فریم ها به صورت پویا نیز فراهم گردید . در چنین حالتی از یک تابع جاوا اسکریپت به منظور ایجاد یک iframe ، ایجاد یک درخواست و دریافت پاسخ ( جملگی بدون نیاز به اضافه کردن تگ های HTML اضافه در یک صفحه ) استفاده می گردید . این روش معروف به روش iframe مخفی گردید .
    • XMLHttp : پیاده کنندگان مرورگر شرکت مایکروسافت پس از مشاهده عمومیت استفاده از روش هائی‌ نظیر فریم مخفی و iframe مخفی ، تصمیم گرفتند یک ابزار بهتر جهت تعامل بین سرویس دهنده و سرویس گیرنده را ارائه نمایند . این ابزار به شکل یک اکتیوایکس و با نام XMLHttp در سال ۲۰۰۱ ارائه گردید .
      زمانی که مایکروسافت حمایت خود از XML را از طریق یک کتابخانه با نام MSXML آغاز کرد ، شی XMLHttp نیز به همراه آن ارائه گردید .
      با این که شی‌ فوق به همراه خود نام XML را یدک می کشید ولی چیزی بمراتب بیشتر از روشی برای انجام عملیات بر روی داده XML بود . شی فوق همانند یک درخواست HTTP بود که می توانست توسط جاوا اسکریپت کنترل گردد . پیاده کنندگان دارای قدرت دستیابی به کدهای وضعیت HTTP و هدر همانند داده برگردانده شده از طریق سرویس دهنده بودند . داده می توانست به صورت XML ساختیافته ، اشیاء سریال شده جاوا اسکریپت و یا سایر فرمت های مورد نظر پیاده کننده باشد . در مقابل استفاده از فریم های مخفی و یا iframe ، این امر میسر گردید که به سرویس دهنده از طریق کد و توسط جاوا اسکریپت دستیابی داشت ( مستقل از چرخه load و reload صفحه ) . شی XMLHttp پس از مدتی به عنوان یک موفقیت بزرگ برای پیاده کنندگان مرورگر IE عرض اندام کرد .
      به موازات متداول شدن شی فوق ، پیاده کنندگان در Mozilla نسخه اختصاصی از XMLHttp را پیاده سازی کردند . در مقابل اجازه دستیابی از طریق اکتیو ایکس ، پیاده کنندگان موزیلا متدها و خصلت ها را در یک شی ذاتی مرورگر و با نام objectXMLHttpRequest ارائه کردند . پس از این که دو مرورگر اصلی در بازار هر یک توانستند به نوعی از XMLHttp حمایت نمایند ، مرورگرهائی دیگر نظیر Opera و Safari نیز هر یک به نوعی حمایت خود از شی فوق را اعلام کردند .
    بدین ترتیب پیاده کنندگان صفحات وب توانستند ، صفحاتی را خلق نمایند که با تعبیه کدهای مورد نیاز در آنها ، امکان پردازش در سمت سرویس گیرنده را فراهم نمایند . انجام پردازش های اولیه نظیر تغییر رنگ و شکل ظاهری صفحات ، مدیریت عناصر موجود بر روی یک صفحه و تغییر آنها در زمان اجراء متناسب با عملیات کاربر ، بررسی صحت داده ورودی توسط کاربر در یک فرم ساده اطلاعاتی ، دریافت داده در پس زمینه و عدم نیاز به ارسال تمامی صفحه و بهنگام سازی بخش هائی خاص از آن ( با بکارگیری فریم ها ) ، نمونه هائی از تاثیر فناوری هائی بود که توان پردازش در سمت سرویس گیرنده را در اختیار پیاده کنندگان قرار می داد .
    وب پویا با تمرکز بر روی پردازش های سمت سرویس دهنده
    همزمان با گسترش اینترنت و وب ، ایجاد صفحات وب با محتویات پویا با اتکاء به منابع داده موجود در سمت سرویس دهنده و سایر شرایط تاثیر گذار در فرآیند پاسخ به درخواست کاربران مطرح گردید . همین موضوع باعث شد که توجه به سرویس دهنده برای انجام برخی پردازش ها نیز در دستور کار قرار بگیرد . ظهور فناورهائی نظیر ASP ( برگرفته شده از Active Server Page ) و PHP ( برگرفته شده از Hypertext Preprocessor ) از اوایل سال ۱۹۹۶ پاسخی به این نیاز بود . از آن زمان به بعد بود که کم کم واژه برنامه های وب قدم در عرصه نرم افزار گذاشت . اگر به تعاریف آن زمان برگردیم مشاهده می کنیم که در ابتدا از این اصطلاح در خصوص صفحات وب پویا استفاده می گردید .
    نگرش جزیره ای به فناورهای مرتبط با برنامه های وب تا اوایل سال ۱۹۹۹ ادامه یافت . تا این که شرکت های متعددی به فکر ارائه یک پلت فرم با در نظر گرفتن واقعیتی به نام اینترنت افتادند . دات نت ، پلت فرم ارائه شده توسط شرکت مایکروسافت یک نمونه در این زمینه است که از صدر تا ذیل آن با در نظر گرفتن واقعیتی با نام اینترنت طراحی و پیاده سازی شده است .
    در این دوران بود که به برنامه های وب با یک نگاه جامع تر و سیستماتیک تر نگاه می شد . در طی پنج سال گذشته ، این نوع برنامه ها توانستند با بکارگیری مجموعه ای از فناوری ها منشاء تحولات عمده ای در خصوص بردن اینترنت در متن زندگی (و نه حاشیه ! ) مردم جهان باشند . ایده ” نرم افزار به عنوان سرویس ” و یا برنامه نویسی سرویس گراء از نگرش های جدید به مقوله نرم افزار و دنیای برنامه نویس‍ی در عرصه وب است .

    موج استفاده از اینترنت برای ارائه خدمات online ( ارائه شده به کاربران از طریق برنامه های وب ) باعث گردید تا معماری و رفتار اینگونه برنامه ها با تامل بیشتر مطالعه و بررسی گردد . هدف ، ایجاد برنامه های وب با کارآئی مطلوب است تا ضمن ارائه خدمات خود دارای ویژگی هائی نظیر : افزایش تعامل کاربر با برنامه ( همانند برنامه های desktop ) ، استفاده بهینه از محیط انتقال و به حداقل رساندن ترافیک آن ، مدیریت بهینه منابع سمت سرویس گیرنده در پاسخ به رویدادهای محقق شده سمت سرویس گیرنده ، عدم ارسال اطلاعات غیره ضروری توسط سرویس گیرنده و … باشند . ماحصل این تفکرات ظهور فناوری جدیدی با نام Ajax است که شرکت هائی نظیر گوگل و مایکروسافت توانستند از سال ۲۰۰۵ با بکارگیری این فناوری تحول بزرگی را در عرصه برخی از سرویس ها و خدمات خود ایجاد نمایند .
    حمع بندی !
    همزمان با بحث معماری سرویس گیرنده و سرویس دهنده دو واژه fat-client و thin-client قدم در ادبیات نرم افزار گذاشتند . در معماری فوق ، هدف استفاده از توان پردازشی سرویس گیرنده و سرویس دهنده برای اجرای یک برنامه است . استفاده از توان پردازشی هر یک از عناصر اصلی درگیر در معماری فوق و تعریف سهمی خاص برای هر یک ( سرویس گیرنده و سرویس دهنده ) ، از اهداف اولیه و در عین حال بسیار مهم معماری فوق است .
    پیاده کنندگان برنامه های کامپیوتری خصوصا” برنامه های وب ، همواره با این سوال مواجه بوده و هستند که در تقسیم سهم پردازش ، چه میزان سهم را می بایست به سرویس گیرنده داد ؟ چه پردازش هائی را می توان در سمت سرویس گیرنده انجام داد ؟ در پاسخ به این سوال رویکردهای مختلفی مطرح شده است . fat client و thin client دو نمونه متداول در این زمینه می باشند .

    در fat client ، هدف بکارگیری پتانسیل های مرورگر برای انجام اکثر پردازش ها در یک برنامه وب است . رویکرد فوق در اواسط دهه ۹۰ میلادی در کانون توجه طراحان و پیاده کنندگان وب قرار گرفت . علت این امر به تلاش شرکت های بزرگ نرم افزاری در جهت تولید و ارائه فناورهائی بود که توانمندی مرورگر در انجام پردازش را افزایش می داد . ظهور فناورهائی نظیر جاوا اسکریپت ، ایجاد یک اینترفیس برنامه نویسی در مرورگر ،‌ایجاد یک مدل شی گراء ( ولو ناقص ) برای یک سند HTML با هدف امکان دستیابی به هر یک از عناصر موجود در آن ، عرضه DHTML و CSS جملگی نشاندهنده تلاش هائی است که در آن زمان با هدف افزایش توان پردازش در سمت سرویس گیرنده مطرح شد .

    پس از گذشت مدت زمان کوتاهی ( از ابتدای سال ۱۹۹۶ ) ، تمایل به سمت برنامه های وب با ویژگی thin client مطرح گردید . در مدل فوق ، هدف کاهش سهم پردازش در سمت سرویس گیرنده و افزایش پردازش های سمت سرویس دهنده بود . ظهور فناورهای متعددی نظیر ASP و PHP تنها نمونه ای اندک از تلاش های انجام یافته در آن دوران برای افزایش توان پردازش در سمت سرویس دهنده است .

    با این که در سالیان گذشته همچنان از پتانسیل های سمت سرویس گیرنده برای انجام پردازش در برنامه های وب استفاده می گردید ، ولی رفتار اکثر برنامه های وب مبتنی بر این واقعیت بود که : ” داده را وارد نمائید ، صفحه را برای سرویس دهنده ارسال نمائید و منتظر دریافت پاسخ باشید ” .

    هم اینک ما شاهد یک تحول بزرگ دیگر در عرصه برنامه نویسی هستیم . تحولی که مهمترین دستاورد آن ، تولد نسل جدیدی از برنامه های وب است که در آنها کاربر با برنامه دارای تعامل بمراتب بیشتری نسبت به نسل گذشته برنامه های وب است . این تحول عظیم نرم افزاری به کمک مجموعه ای از فن آوری ها که در مجموع به آنها Ajax گفته می شود ، محقق می گردد .

    آیا Ajax قصد دارد با تغییر در الگوی رفتاری برنامه های وب فاصله آنها را با برنامه های desktop کاهش دهد ؟ آیا زمان آن رسیده است که برای پردازش های سمت سرویس گیرنده از یک پلت فرم جامع ، همانند پلت فرم های ارائه شده سمت سرویس دهنده ، استفاده گردد ؟ آیا تاکنون از این فناوری به منظور ایجاد برنامه های وب استفاده شده است ؟ با استفاده از چه مکانیزم هائی می توان مبادله اطلاعات بین سرویس گیرنده و سرویس دهنده را کاهش و از پهنای باند موجود استفاده بهینه کرد ؟
     
    minaaa, ‏7/1/11
    #1
  2. minaaa

    کاربر پیشرفته

    تاریخ عضویت:
    ‏9/12/10
    ارسال ها:
    19,773
    تشکر شده:
    6,457
    امتیاز دستاورد:
    113
    تحولی بزرگ در عرصه وب ( بخش دوم )

    <DIV id=pid_140839 style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 5px; PADDING-TOP: 5px">
    <SPAN class=Apple-style-span style="WORD-SPACING: 0px; FONT: medium 'Times New Roman'; TEXT-TRANSFORM: none; COLOR: rgb(0,0,0); TEXT-INDENT: 0px; WHITE-SPACE: normal; LETTER-SPACING: normal; BORDER-COLLAPSE: separate; orphans: 2; widows: 2"><SPAN class=Apple-style-span style="FONT-SIZE: 11px; COLOR: rgb(102,102,102); FONT-FAMILY: tahoma">
    نویسنده : شرکت سخاروش
    در بخش اول ضمن بررسی تاثیر متقابل وب بر نرم افزار ، مروری داشتیم به وب ایستا و وب پویا و این که برای انجام پردازش های مورد نیاز در برنامه های وب می توان از امکانات و فناوری های متعددی در سمت سرویس گیرنده و سرویس دهنده استفاده کرد . هدف از بیان مطالب فوق ، پاسخ به این سوال بود که چرا به وجود یک فناوری دیگر نظیر Ajax نیاز است ( گرچه Ajax یک فناوری نیست و مجموعه ای از فناوری ها را شامل می شود ) .
    با این که ایده فناورهائی نظیر Ajax در گذشته نیز وجود داشته است و پیاده کنندگان برنامه های وب در زمان خود با بکارگیری برخی فناوری ها و ترفندها توانسته بودند مشکل خود را تا حدود زیادی برطرف نمایند ولی گذشت زمان و گسترش باور نکردنی اینترنت ، باعث شد تا استفاده از بستر فوق برای ارائه سرویس های online در دستور کار اکثر سازمان ها و شرکت ها در اقصی نقاط جهان قرار بگیرید . همین موضوع باعث شد که دگر باره جامعه بزرگ طراحان و پیاده کنندگان برنامه های وب این نیاز را احساس کنند که به یک راه حل جامع و سیستماتیک برای برخورد با مسائل خود ( خصوصا” تعامل با کاربر ) در دنیای نوین برنامه نویسی وب نیاز دارند . دنیائی که در آن دقت و سرعت در ارائه خدمات online با بکارگیری کمترین منابع و تولید بیشترین بهره وری ، رمز ماندگاری یک سازمان در مدار رقابت و پیشرفت است . همین امر باعث شد که شرکت های بزرگ تولید کننده نرم افزار و خدمات online نیز دست به کار شوند و چیزی را خلق کنند که ما امروزه از آن با نام Ajax یاد می کنیم .
    در این بخش به بررسی موارد زیر خواهیم پرداخت :    ​
    • <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">
      <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">تولد Ajax و ریشه یابی علت انتخاب این نام <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">Ajax و فناوری های مرتبط با آن <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">اصول حاکم بر فناوری Ajax .
    • نحوه کارکرد Ajax در برنامه های وب
    تولد Ajax
    در فوریه سال ۲۰۰۵ ، Jesse James Garrett از Adaptive Path مقاله ای را با عنوان ” یک رویکرد جدید به برنامه های وب “ بر روی وب سایت خود منشتر کرد . وی در این مقاله ضمن اشاره به این موضوع که فاصله بین برنامه های وب و desktop در حال از بین رفتن است ، به بررسی دو نمونه از برنامه های وب جدید با نام Google Suggest و Google Maps پرداخته بود . Garrett پس از تشریح نحوه عملکرد برنامه های فوق ، برای اولین مرتبه از واژه Ajax در مقاله خود استفاده کرد .
    وی در مقاله خود دنیائی را پیش بینی کرده بود که در آن برنامه های وب از لحاظ قابلیت دستیابی ، پاسخ گوئی و سادگی قابل مقایسه با برنامه های desktop خواهند شد .
    Ajax چیست ؟​
    • <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">
      <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">Ajax برگرفته شده از Asynchronous JavaScript XML است و مشتمل بر مجموعه ای از فناوری ها است ، نه صرفا” یک فناوری . <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">Ajax ، اساس و پایه چیزی است که امروزه از آن با نام وب ۲ نام برده می شود ( نسل جدید وب ) . ایده اصلی ، ایجاد برنامه های وبی است که دارای شکل ظاهری و توانمندی هائی مشابه با برنامه های desktop باشند . <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">Ajax چی‍زی بیشتر از یک نگرش جدید به برنامه های وب نیست . نگرشی که در آن صرفا” یک حجم اندک از اطلاعات بین سرویس گیرنده و سرویس دهنده با هدف افزایش تعامل کاربر با برنامه ، مبادله می گردد . <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">Ajax ، مشتمل بر مجموعه ای از فن آوری ها است که هر یک دارای جایگاه مختص به خود می باشند :
      - فن آوری های استاندارد presentation نظیر XHTML و CSS
      - بهنگام سازی پویای یک صفحه مستقر شده در حافظه با استفاده از DOM ( برگرفته شده از Document Object Model )
      - مبادله و پردازش داده با استفاده از XML (فرمت مبادله داده ) و XSLT ‌( تبدیل XML به XHTML )
      - بازیابی داده غیرهمزمان با استفاده از XMLHttpRequest ( کارگزار اولیه مبادله اطلاعات )
      و جاوا اسکریپت که همه چیز را به یکدیگر مرتبط می نماید و از آن برای برنامه نویسی Ajax engine استفاده می گردد .
      <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">در دنیای واقعی ، از تمامی فناوری های فوق در Ajax استفاده می گردد ولی به وجود HTML/XHTML ، DOM و Javascript بیش از همه نیاز است چون :
      از XHTML برای نمایش اطلاعات استفاده می گردد .
      از DOM برای تغییر بخش هائی از یک صفحه XHTML بدون نیاز به load مجدد صفحه استفاده می گردد.
      از جاوا اسکریپت ، برای مقداردهی اولیه ارتباط بین سرویس گیرنده و سرویس دهنده و بهنگام سازی صفحات وب به کمک DOM استفاده می گردد .       <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">یک عنصر اساسی و مهم دیگر که در مقاله Garrett به آن اشاره نشده است ، ضرورت انجام پردازش های سمت سرویس دهنده است . تمامی فناوری های اشاره شده ( در پاراگراف قبل ) ، در ارتباط مستقیم با Ajax engine سمت سرویس گیرنده می باشند . بدون وجود یک سرویس دهنده مطمئن و پاسخگو به منظور ارسال محتویات برای Ajax engine ، در عمل Ajax فاقد کارآئی لازم خواهد بود . صرفنظر از فناوری استفاده شده در سمت سرویس دهنده ( نظیر PHP و یا ASP.NET ) ، می بایست این اطمینان حاصل گردد که داده با فرمت صحیح برای Ajax engine ارسال می گردد . <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">از شی XMLHttpRequest درون جاوا اسکریپت برای ارتباط با سرویس دهنده استفاده می گردد تا در ادامه بتوان داده برگردانده شده از سرویس دهنده ( با فرمت Xml و یا متن معمولی ) را پردازش کرد . <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">از DHTML و CSS برای نمایش نتایج در مرورگر استفاده می گردد .
    • هدف از کنارهم قرار گرفتن تمامی فناوری های اشاره شده ، این است که شکل ظاهری برنامه های وب و نحوه پاسخ گوئی آنها به خواسته کاربران مشابه برنامه های desktop گردد .
    همانگونه که در نام این فناوری مشخص است ، Ajax مشتمل بر مجموعه ای از فناوری ها است : Asynchronous JavaScript XML​
    • <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">
      <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">غیرهمزمان و یا asynchronous بدین معنی است که مرورگر لازم نیست منتظر بماند تا داده از سرویس دهنده برگردانده شود و می تواند به محض دریافت داده آن را پردازش نماید . به عبارت دیگر ، انتقال داده در پس زمینه انجام شده و مرورگر مجبور به توقف و انتظار برای تحقق اتفاقی نخواهد بود .
      رویکرد فوق نشاندهنده یکی از ویژگی های مهم و حیاتی Ajax است . در چنین مواردی‌، می توان داده را پس از ارسال توسط سرویس دهنده ، پردازش کرد . لازم نیست تمامی برنامه را معطل رسیدن داده از سمت سرویس دهنده کرد .
      در صورتی که لازم است پردازش های سمت سرویس گیرنده منتظر دریافت داده بمانند ، مکانیرم دریافت و پردازش داده می بایست بطور همزمان انجام شود . در صورتی که یک ارتباط ضعیف بین سرویس گیرنده و سرویس دهنده برقرار شده باشد این موضوع می تواند عملکرد و موفقیت یک برنامه وب را با مشکل مواجه نماید .       <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">بخش جاوا اسکریپت واژه Ajax نیز بسیار مهم است چراکه بالفعل شدن پتانسیل های Ajax در مرورگر توسط آن محقق می گردد . Ajax به کمک جاوا اسکریپت با سرویس دهنده ارتباط خود را برقرار می نماید و در ادامه نیز داده برگردانده شده از سرویس دهنده را پردازش می نماید . <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">بخش xml واژه Ajax دارای چه مسئولیتی است ؟ XML به عنوان یک استاندارد جهانی در عرصه وب مطرح است و به کمک آن می توان از یک روش مبتنی بر متن برای مبادله داده در عرصه اینترنت استفاده کرد . یکی از دلایل مهم گسترش xml ، ماهیت مبتنی بر متن آن است . با توجه به این که طراحی اینترنت بگونه ای انجام شده بود تا بتواند مستندات مبتنی بر متن نظیر اسناد HTML را نمایش دهد ، وجود xml به منزله قلابی است که می توان آن را دور اینترنت انداخت و به صید داده پرداخت. داده ئی که به همراه ساختار خود می تواند امکان پردازش را در سایر سیستم ها فراهم نماید . به همین دلیل است که برنامه های Ajax بگونه ای نوشته می گردند تا بتوانند بر روی داده برگردانده شده از سرویس دهنده با فرمت xml ، عملیات مورد نظر را انجام دهند . به عبارت دیگر ، پس از برقراری ارتباط با سرویس دهنده ، داده با فرمت xml برگردانده خواهد شد .
      xml ، صرفا” یکی از روش های برگرداندن داده است و در صورت لزوم می توان از فرمت هائی دیگر نظیر متن معمولی نیز استفاده کرد .       <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">در کنار جاوا اسکریپت و XML ، فناوری Ajax با فناوری های دیگری نظیر DHTML و CSS نیز کار می کند . به کمک فناورهای فوق می توان داده موجود در یک صفحه وب را بدون نیاز به load تمامی صفحه بهنگام کرد ( صرفا” load بخشی که ضرورت آن احساس می شود ) . پتانسیل فوق یکی از اهداف و ویژگی های مهم برنامه های وب مبتنی بر فناوری Ajax محسوب می گردد .
    • بخشی از جاوا اسکریپت که امکان Ajax را میسر می سازد ، شی XMLHttpRequest است . شی فوق تقریبا” در تمامی مرورگرهای مدرن و پیشرفته از قبل تعبیه شده است . به کمک این شی امکان اتصال به سرویس دهنده و مدیریت داده برگردانده شده از آن در پس زمینه فراهم می گردد .
      اقتدار Ajax نه تنها وابسته به جاوا اسکریپت بلکه مدیون شی XMLHttpRequest است .
    اصول Ajax
    Ajax هنوز در ابتدای راه است و بسیاری از پیاده کنندگان با این پرسش مواجه هستند که از این فناوری در چه زمانی و در چه نوع برنامه هائی می توان استفاده کرد . عدم شناخت مناسب از این فناوری باعث می شود تا از آن در برنامه هائی استفاده گردد که نه تنها قابلیت و یا ویژگی جدیدی را به برنامه اضافه نمی نماید بلکه در بسیاری از موارد عدم موفقیت یک برنامه و نارضایتی کاربران آن را به دنبال خواهد داشت .
    زمانی می توان این ادعا را داشت که یک برنامه وب مبتنی بر Ajax در اهداف خود موفق بوده است که در آن اصول زیر رعایت شده باشد .    ​
    • <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">
      <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">به حداقل رساندن ترافیک : برنامه های Ajax می بایست حتی المقدور حجم اندکی از اطلاعات را برای سرویس دهنده ارسال و یا از آن دریافت نمایند . به عبارت دیگر ، با بکارگیری Ajax می بایست حجم ترافیک بین سرویس گیرنده و سرویس دهنده کاهش یابد . <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">عدم سردرگمی کاربر : برنامه های وب مبتنی بر فناوری Ajax مدل تعامل با کاربر مختلفی را نسبت به برنامه های وب سنتی معرفی کرده اند . در مقابل وب استاندارد ( کلیک کن و منتظر باش ) ، برخی برنامه های Ajax از یک رویکرد دیگر برای پیاده سازی بخش رابط کاربر خود نظیر drag-and-drop و یا double-clicking استفاده می نمایند . صرفنظر از نوع مدل انتخاب شده برای پیاه سازی تعامل با کاربر ، مهم ارائه امکانات بخش رابط کاربر بگونه ای است که همواره کاربر در سریع ترین زمان بتواند در خصوص انجام حرکت بعدی خود تصمیم گیری نماید . <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">استفاده منطقی از تجارب مثبت گذشته : وقت خود را بی خودی به ابداع مدل های تعامل با کاربر جدید که کاربران شما با آنها آشنا نیستند ، هدر ندهید . استفاده از تجارب برنامه های وب سنتی و desktop می تواند پیاده کنندگان را در طراحی یک مدل مناسب جهت تعامل با کاربر کمک نماید . <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">اجتناب از بکارگیری عناصر غیرضروری : از بکارگیری عناصر غیر ضروری نظیر تکرار انیمیشن و بخش هائی نظیر blinking page اجتناب کنید. بکارگیری این چنین عناصری باعث می شود تا کاربران در زمان انجام فعالیت های مورد نظر دچار سردرگمی شوند . <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">قابلیت دسترسی و رضایت کاربران : برنامه های Ajax را با در نظر گرفتن رفتار و نوع خواسته کاربران طراحی و پیاده سازی نمائید . برای طراحی و پیاده سازی خود را در یک مکان بسته محبوس ننمائید. در غیر اینصورت همواره این احتمال وجود خواهد داشت که خواسته برخی از کاربران نادیده گرفته شود . قابلیت دسترسی و رضایت کاربران یکی از نکات بسیار مهم در موفقیت یک برنامه کامپیوتری محسوب می گردد . <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">پیشگیری از دانلود تمامی صفحه : تمامی ارتباط با سرویس دهنده پس از مقدار دهی اولیه دانلود صفحه ، می بایست توسط Ajax engine مدیریت گردد . عدم مدیریت صحیح بر روی فرآیند فوق می تواند بخش رابط کاربر یک برنامه وب را با مشکل اساسی مواجه سازد ( نظیر دانلود حجم اندکی از داده در یک مکان و دانلود تمامی صفحه در بخش دیگر )
    • توجه به نیاز کاربران قبل از هر چیز : برنامه های Ajax را قبل از هر چیز با کاربران خیالی در ذهن طراحی نمائید . سهولت در انجام عملیات متداول می بایست در دستور کار قرار بگیرد . کمتر در اندیشه انجام کارهای تبلیغاتی و یا افکت های غیرضروری باشید .
    نقطه مشترک بین تمامی اصول اشاره شده ، قابلیت استفاده از یک برنامه با حداکثر ظرفیت و رضایتمندی کاربران است . هدف اولیه Ajax ، بهبود و ارتقاء بخش رابط کاربر برنامه ها با هدف رضایتمندی بیشتر کاربران است .
    نحوه کار Ajax
    در برنامه های وب سنتی مرورگر مسئولیت مقداردهی اولیه درخواست ها و پردازش آنها جهت ارسال به سرویس دهنده وب را برعهده دارد . در مقابل ، در Ajax یک لایه میانی ( که Garrett آن را Ajax engine نامید ) مسئولیت مدیریت ارتباط برقرار شده را برعهده می گیرد . Ajax engine در واقع یک شی جاوا اسکریپت و یا تابع است و زمانی که به اطلاعاتی از سرویس دهنده نیاز باشد ،‌ از آن استفاده خواهد شد .
    در مقابل برنامه های وب سنتی که یک لینک به یک منبع دیگر ارائه می گردد ( نظیر یک صفحه وب دیگر ) ، در برنامه های وب مبتنی بر Ajax ، هر لینک باعث فراخوانی Ajax engine می گردد که وظیفه آن زمانبندی و انجام درخواست بطور غیرهمزمان است .
    سرویس دهنده ( که از لحاظ سنتی اسناد HTML ، تصاویر ، CSS و جاوا اسکریپت را ارائه می نماید ) ، بگونه ای پیکربندی می گردد تا داده مورد نیاز را در اختیار Ajax Engine قرار دهد. این داده می تواند متن معمولی ، XML و یا سایر فرمت های مورد نیاز داده باشد. بدیهی است در چنین مواردی ، Ajax engine می بایست قادر به خواندن و تفسیر داده باشد .
    پس از دریافت پاسخ لازم از سرویس دهنده ، Ajax engine عملیات خود را که اغلب بررسی داده و ایجاد تغییرات لازم در بخش رابط کاربر است ، آغاز می نماید . با توجه به این که در فرآیند فوق به اطلاعات کمتری نسبت به برنامه های وب سنتی نیاز است ، بخش رابط کاربر با سرعت بیشتری بهنگام می گردد و کاربر قادر به انجام کارهای خود با سرعت بیشتری است .
    در شکل ۱ ، عملکرد برنامه های وب سنتی نسبت به برنامه های وب مبتنی بر Ajax نشان داده شده است .    ​
    <DIV style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px" align=right><FONT size=2><FONT face="Times New Roman"><FONT face=Tahoma>
     
    minaaa, ‏7/1/11
    #2
  3. minaaa

    کاربر پیشرفته

    تاریخ عضویت:
    ‏9/12/10
    ارسال ها:
    19,773
    تشکر شده:
    6,457
    امتیاز دستاورد:
    113
    تحولی بزرگ در عرصه وب ( بخش سوم )

    <DIV id=pid_140840 style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 5px; PADDING-TOP: 5px">
    <SPAN class=Apple-style-span style="WORD-SPACING: 0px; FONT: medium 'Times New Roman'; TEXT-TRANSFORM: none; COLOR: rgb(0,0,0); TEXT-INDENT: 0px; WHITE-SPACE: normal; LETTER-SPACING: normal; BORDER-COLLAPSE: separate; orphans: 2; widows: 2"><SPAN class=Apple-style-span style="FONT-SIZE: 11px; COLOR: rgb(102,102,102); FONT-FAMILY: tahoma">
    در بخش اول ضمن بررسی تاثیر متقابل وب بر نرم افزار ، مروری داشتیم به وب ایستا و وب پویا و این که برای انجام پردازش های مورد نیاز در برنامه های وب می توان از امکانات و فناوری های متعددی در سمت سرویس گیرنده و سرویس دهنده استفاده کرد . هدف از بیان مطالب فوق ، پاسخ به این سوال بود که چرا به وجود یک فناوری دیگر نظیر Ajax نیاز است ( گرچه Ajax یک فناوری نیست و مجموعه ای از فناوری ها را شامل می شود ) .
    در بخش دوم با Ajax و فناوری های مرتبط با آشنا شدیم . در این بخش به بررسی نمونه برنامه هائی خواهیم پرداخت که در آنها از فناوری Ajax استفاده می گردد .
    Google Suggest
    اجازه دهید کار خود را با نمونه ای آغاز نمائیم که برای شما کاملا” آشنا است . در زمان استفاده از اینترنت هر یک از ما بدفعات از موتورهای جستجو جهت یافتن اطلاعات مورد نیاز حود استفاده می کنیم . Google یکی از محبوبترین و قدرتمندترین موتورهای جستجو در اینترنت است . پس از تایپ کلید واژه مورد نظر و فشردن کلید Google Search ، کلید واژه مورد نظر برای سرویس دهنده ارسال می گردد . در ادامه ،‌ با توجه به ایجاد زیرساخت اطلاعاتی لازم در سمت سرویس دهنده ، نتایج استخراج و برای شما ارسال می گردد .
    Google Suggest ، یکی از اولین نمونه برنامه هائی است که در آن از Ajax استفاده شده است .برنامه فوق دارای اینترفیسی مشابه صفحه اصلی گوگل است ( یک text box جهت تایپ کلید واژه مورد نظر به همراه یک button جهت جستجو ) . همه چیز مشابه صفحه اصلی و قدیمی گوگل است تا زمانی که شروع به تایپ متن مورد نظر خود در text box نکرده اید . به موازات تایپ متن در محل مربوطه ، گوگل پیشنهادات و یا اطلاعاتی را از سرویس دهنده دریافت و به شما ارائه می نماید ( یک لیست از واژه ها به همراه تعداد نتایج مربوط به هر یک ) .
    به عنوان نمونه فرض کنید عبارت srco.ir را در بخش مربوطه تاپپ نمائیم ، به موازات تایپ هر یک از حروف ، گوگل پیشنهادات خود را ارائه می نماید . نحوه عملکرد Google Suggest در شکل ۱ نشان داده شده است .    ​
    <DIV style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px" align=right><FONT size=2><FONT face="Times New Roman"><FONT face=Tahoma>
     
    minaaa, ‏7/1/11
    #3
  4. minaaa

    کاربر پیشرفته

    تاریخ عضویت:
    ‏9/12/10
    ارسال ها:
    19,773
    تشکر شده:
    6,457
    امتیاز دستاورد:
    113
    تحولی بزرگ در عرصه وب ( بخش چهارم )

    <DIV id=pid_140842 style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 5px; PADDING-TOP: 5px">
    <SPAN class=Apple-style-span style="WORD-SPACING: 0px; FONT: medium 'Times New Roman'; TEXT-TRANSFORM: none; COLOR: rgb(0,0,0); TEXT-INDENT: 0px; WHITE-SPACE: normal; LETTER-SPACING: normal; BORDER-COLLAPSE: separate; orphans: 2; widows: 2"><SPAN class=Apple-style-span style="FONT-SIZE: 11px; COLOR: rgb(102,102,102); FONT-FAMILY: tahoma">.wysiwyg { BACKGROUND: #f5f5ff; FONT: 10pt tahoma,tahoma,tahoma; COLOR: #000000 } P { MARGIN: 0px } .inlineimg { VERTICAL-ALIGN: middle } نویسنده : شرکت سخاروش
    در این بخش قرار بود که در رابطه با فریمورک های مختلف ارائه شده جهت بکارگیری فناوری Ajax آشنا شویم . ولی به دلیل درخواست تعداد زیادی از خوانندگان مبنی بر آشنائی بیشتر با معماری Ajax ، برنامه نویسی غیرهمزمان در برنامه های وب و شی XMLHttpRequest ، این بخش را به بررسی موارد فوق اختصاص دادیم تا علاقه مندان بتوانند قبل از پرداختن به اصل موضوع با برخی مفاهیم کلیدی و مهم بیشتر آشنا شوند .
    مقدمه
    Ajax یک رویکرد و یا الگوی جدید برای پیاده سازی برنامه های وب است که در آن از اسکریپت های سمت سرویس گیرنده برای مبادله داده با سرویس دهنده وب استفاده می گردد. رویکرد فوق باعث می شود که صفحات وب بدون نیاز به refresh کامل بتوانند بطور پویا بهنگام گردند ( رویائی برای پیاده کنندگان برنامه های وب ) . مهمترین دستاورد رویکرد فوق ، ارتباط بدون وقفه و پیوسته کاربران با برنامه های وب است .
    برخی از کارشناسان بر این اعتقاد هستند که رویکرد فوق بیش از آن که یک الگو باشد یک فناوری است . در واقع ، Ajax ترکیبی از مجموعه فناوری های مرتبط به هم است که از آنها با یک نگرش جدید در جهت تولید نسل جدیدی از برنامه های وب استفاده می گردد .
    نام بردن از فناورهائی که در Ajax از آنها استفاده می گردد کار مشکلی نیست ولی مهم این است که بدانیم این فناورها در کنار یکدیگر به چه صورت کار می کنند و هر یک از آنها در Ajax دارای چه مختصاتی است .شکل ۱ ، نحوه تعامل و ارتباط این فناوری ها را از منظر مرورگر نشان می دهد .
    <DIV style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px" align=center><FONT face="Times New Roman"><FONT size=2>
     
    minaaa, ‏7/1/11
    #4
  5. minaaa

    کاربر پیشرفته

    تاریخ عضویت:
    ‏9/12/10
    ارسال ها:
    19,773
    تشکر شده:
    6,457
    امتیاز دستاورد:
    113
    تحولی بزرگ در عرصه وب ( بخش پنجم )

    <DIV id=pid_140843 style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 5px; PADDING-TOP: 5px">
    <SPAN class=Apple-style-span style="WORD-SPACING: 0px; FONT: medium 'Times New Roman'; TEXT-TRANSFORM: none; COLOR: rgb(0,0,0); TEXT-INDENT: 0px; WHITE-SPACE: normal; LETTER-SPACING: normal; BORDER-COLLAPSE: separate; orphans: 2; widows: 2"><SPAN class=Apple-style-span style="FONT-SIZE: 11px; COLOR: rgb(102,102,102); FONT-FAMILY: tahoma">نویسنده : شرکت سخاروش
    پس از آشنائی با اصول اولیه Ajax در طی چهار مقاله ، پیاده کنندگانی که علاقه مند به استفاده از این فناوری در برنامه های وب می باشند این پرسش را مطرح می نمایند که آیا برای استفاده از پتانسیل های Ajax می بایست از یک فریمورک و یا toolkit خاص استفاده کرد ؟ در ادامه ضمن پاسخ به این سوال ، به بررسی معماری ASP.NET Ajax خواهیم پرداخت .
    چرا به یک فریمورک Ajax نیاز داریم ؟ بدون بهره گیری از پتانسیل های یک toolkit و یا یک فریمورک ، پیاد ه سازی برنامه های مبتنی بر Ajax کار ساده ای نخواهد بود و پیاده کنندگان با مسائل متعددی مواجه خواهند شد :
    • <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">
      <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">سازگاری بین مرورگرها : گذشته از پیاده سازی نسخه های متعدد و مختلف از شی XMLHttpRequest ، هر مرورگر یک نسخه متفاوت از DOM را پیاده سازی کرده است . به روز نگه داشتن تغییرات بین مرورگرها و مدیریت تشخیص مرورگرها می تواند یک فرآینده مشکل و خسته کننده را برای پیاده کنندگان به دنبال داشته باشد .یکی از اهداف مهم یک toolkit و یا فریمورک ، تفکیک پیچیدگی ها و تفاوت ها است تا پیاده کنندگان بتوانند با بکارگیری مجموعه ای از امکانات رابط برنامه نویسی ( API ) ، عملیات مشابه و یکسانی را انجام دهند .
    • ضرورت درک عمیق تر از جاوا اسکریپت : جاوا اسکریپت ذاتا” یک زبان پیچیده نیست ، گرچه ، تعداد زیادی از پیاده کنندگان برنامه های وب این عقیده را ندارند. جاوا اسکریپت ویژگی هائی نظیر شی گراء و یا Type safe را که بتواند انتظار برنامه نویسان را تامین نماید ، ارائه نمی نماید . مفاهیمی نظیر توارث ، اینترفیس ها و رویدادها را می توان در جاوا اسکریپت شبیه سازی کرد ولی پیاده سازی آنها برای پیاده کنندگان کار مشکلی خواهد بود . اشکال زدائی و عدم حمایت از زبان های اسکریپت نویسی سمت سرویس گیرنده در محیط های IDE ( برگرفته شده از integrated development environments ) نیز به پیچیدگی کار می افزاید .
    با توجه به موارد فوق ، توصیه می گردد در زمان پیاده سازی برنامه های وب مبتنی بر Ajax از یک فریمورک و یا toolkit استفاده شود و پیاده کنندگان خود را درگیر برخی کارهای پیچیده و تکراری ننمایند .
    ASP. NET Ajax یکی از فریمورک های ارائه شده در این خصوص است که در ادامه با معماری آن بیشتر آْشنا می شویم .
    معماری فریمورک ASP. NET Ajax
    فریمورک ASP. NET Ajax ، به پیاده کنندگان این امکان را می دهد که بتوانند برنامه های وب قدرتمندتر ، با توان پاسخگوئی بیشتر و سازگار با مرورگرهای مختلف را ایجاد نمایند . در نگاه اول ممکن است این گونه برداشت شود که فریمورک یک کتابخانه Ajax است . با این که استنباط فوق درست است ولی تصویری واقعی از آنچه وجود دارد را در ذهن ایجاد نمی کند.
    با بررسی معماری فریمورک فوق و آشنائی با نحوه عملکرد هر یک از عناصر موجود در این ساختار ، با قابلیت های فریمورک ASP. NET Ajax بیشتر خواهیم شد .
    شکل ۱ ، ساختار معماری فریمورک ASP. NET Ajax را نشان می دهد . اولین چیزی که در شکل فوق مشهود است ، پوشش این فریمورک در دو سمت سرویس گیرنده و سرویس دهنده است . علاوه بر مجموعه ای از کتابخانه های سمت سرویس گیرنده و عناصر ، با مجموعه ای از امکانات در سمت سرویس دهنده مواجه هستیم که امکان بکارگیری آنها توسط کنترل های سرویس دهنده ASP. NET و سرویس ها وجود دارد .
    <DIV style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px" align=center><FONT size=2><FONT face="Times New Roman"><FONT face=Tahoma>
     
    minaaa, ‏8/1/11
    #5
  6. minaaa

    کاربر پیشرفته

    تاریخ عضویت:
    ‏9/12/10
    ارسال ها:
    19,773
    تشکر شده:
    6,457
    امتیاز دستاورد:
    113
    تحولی بزرگ در عرصه وب ( بخش ششم )

    <DIV id=pid_140844 style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 5px; PADDING-TOP: 5px">
    <SPAN class=Apple-style-span style="WORD-SPACING: 0px; FONT: medium 'Times New Roman'; TEXT-TRANSFORM: none; COLOR: rgb(0,0,0); TEXT-INDENT: 0px; WHITE-SPACE: normal; LETTER-SPACING: normal; BORDER-COLLAPSE: separate; orphans: 2; widows: 2"><SPAN class=Apple-style-span style="FONT-SIZE: 11px; COLOR: rgb(102,102,102); FONT-FAMILY: tahoma">نویسنده : شرکت سخاروش
    در بخش پنجم ضمن اشاره به ضرورت استفاده از یک فریمورک در برنامه های وب مبتنی بر Ajax ، با عناصر موجود در سمت سرویس دهنده و سرویس گیرنده فریمورک ASP.NET AJAX آشنا شدیم . در این بخش با نحوه تعامل این عناصر در جهت تامین خواسته پیاده کنندگان برنامه های وب آشنا خواهیم شد . بدین منظور به بررسی دو سناریوی مختلف خواهیم پرداخت : مدل پیاده سازی با محوریت سرویس گیرنده و مدل پیاده سازی با محوریت سرویس دهنده .
    طراحی انعطاف پذیر معماری ASP. NET Ajax ، دو رویکرد و یا مدل پیاده سازی مختلف را ارائه می نماید . به اولین سناریو که در سمت سرویس گیرنده پیاده سازی می گردد ، “مدل پیاده سازی با محوریت سرویس گیرنده” و به دومین رویکرد که مبتنی بر سرویس دهنده است ، “مدل پیاده سازی با محوریت سرویس دهنده ” گفته می شود .
    قبل از هر چیز لازم است با نحوه عملکرد هر یک از مدل های فوق بیشتر آشنا شویم تا بتوانیم از هر یک در زمان مناسب استفاده کنیم .
    مدل پیاده سازی با محوریت سرویس گیرنده
    در این مدل ، لایه Presentation متاثر از اسکریپت های سمت سرویس گیرنده با بکارگیری DHTML و جاوا اسکریپت است. این بدان معنی است که یک برنامه با هوشمندی و تعامل بیشتر ، از طریق سرویس دهنده برای سرویس گیرنده ارسال می گردد ( در زمان استقرار صفحه در حافظه برای مرتبه اول ) . پس از آن ، تعامل بین برنامه مرورگر و سرویس دهنده محدود به بازیابی داده مورد نیاز جهت بهنگام سازی صفحه است . در این مدل کاربران با برنامه تعامل زیادی خواهند داشت ( برنامه ای که در سمت سرویس گیرنده و در مرورگر کاربر اجراء شده است ) .
    شکل ۱ ، مدل پیاده سازی با محوریت سرویس گیرنده را نشان می دهد .
    <DIV style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px" align=center><FONT size=2><FONT face="Times New Roman"><FONT face=Tahoma>
     
    minaaa, ‏8/1/11
    #6
  7. minaaa

    کاربر پیشرفته

    تاریخ عضویت:
    ‏9/12/10
    ارسال ها:
    19,773
    تشکر شده:
    6,457
    امتیاز دستاورد:
    113
    تحولی بزرگ در عرصه وب ( بخش هفتم )

    <DIV id=pid_140845 style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 5px; PADDING-TOP: 5px">
    :D
    <SPAN class=Apple-style-span style="WORD-SPACING: 0px; FONT: medium 'Times New Roman'; TEXT-TRANSFORM: none; COLOR: rgb(0,0,0); TEXT-INDENT: 0px; WHITE-SPACE: normal; LETTER-SPACING: normal; BORDER-COLLAPSE: separate; orphans: 2; widows: 2"><SPAN class=Apple-style-span style="FONT-SIZE: 11px; COLOR: rgb(102,102,102); FONT-FAMILY: tahoma">wysiwyg { BACKGROUND: #f5f5ff; FONT: 10pt tahoma,tahoma,tahoma; COLOR: #000000 } P { MARGIN: 0px } .inlineimg { VERTICAL-ALIGN: middle } نویسنده : شرکت سخاروش
    تاکنون و در طی شش مقاله با مواردی نظیر شی XMLHttpRequest ، برخی الگوهای Ajax استفاده شده در زمان پیاده سازی برنامه های وب قدرتمند با توانائی ایجاد تعامل بیشتر ، معماری ASP.NET AJAX و سناریوهای مختلف پیاده سازی آشنا شدیم .
    در این بخش با استناد به موارد فوق با نحوه استفاده از این فریمورک آشنا خواهیم شد و صفحات وب مبتنی بر Ajax را با تبعیت از مدل پیاده سازی با محوریت سرویس دهنده ایجاد خواهیم کرد .
    مدل پیاده سازی با محوریت سرویس دهنده
    همانگونه که در بخش ششم اشاره گردید ، در این مدل ، منطق برنامه و اکثر عناصر بخش رابط کاربر بر روی سرویس دهنده باقی می مانند و در ادامه ، تغییرات مورد نیاز رابط کاربر برای برنامه مرورگر ارسال می گردد ( در مقابل این که تغییرات از طریق اجرای اسکریپت های سمت سرویس گیرنده ایجاد شوند) .
    برای آشنائی عملی با مدل فوق ، در ادامه یک نمونه مثال ساده و در عین حال کاربردی را با یکدیگر دنبال می نمائیم .
    مثال : ایجاد یک صفحه مبتنی بر Ajax با تمرکز بر روی پتانسیل های سمت سرویس دهنده فریمورک ASP. NET Ajax
    در این مثال می خواهیم تعداد مقالاتی را که بر روی سایت سخا روش و در هر یک از گروه های مختلف منتشر شده است ، به اطلاع ملاقات کنندگان سایت برسانیم .برای سادگی کار ، فرض می شود که تعداد مقالات منشتر شده بر روی سایت از طریق بانک اطلاعاتی بازیابی نخواهد شد و در مقابل از یک کلاس با نام Maghalat برای بازیابی تعداد مقالات منشتر شده در هر گروه استفاده خواهیم کرد . کلاس فوق دارای صرفا” یک متد با GetNumberOfMaghalat است که وظیفه آن برگرداندن تعداد مقالات منتشر شده در هر گروه است .
    پس از آشنائی اولیه با صورت مسئله ، مراحل زیر را برای پیاده سازی یک صفحه وب مبتنی بر Ajax با محوریت سرویس دهنده ، دنبال می نمائیم .
    مرحله اول : ایجاد سایت
    اولین مرحله در پیاده سازی هر نوع برنامه وب مبتنی بر ASP. NET ، ایجاد وب سایت اولیه است . بدین منظور از برنامه ویژوال استودیو نسخه های ۲۰۰۵ و یا ۲۰۰۸ استفاده کرده ( و یا نسخه Visual Web Developer ) و برای وب سایت خود تمپلیت ASP.NET AJAX-Enabled Web Site را انتخاب می کنیم . بدین ترتیب ، یک وب سایت با قابلیت استفاده از اسمبلی ASP. NET AJAX ( با نام System.Web.Extensions.dll ) از طریق GAC ( برگرفته شده از Global Assembly Cache ) ایجاد می گردد . این کار همچنین باعث ایجاد یک فایل web.config پیچیده می گردد که شامل تنظیمات اضافه دیگر برای ارتباط با فریمورک ASP. NET AJAX است .
    شکل ۱ ، نحوه انتخاب تمپلیت ASP.NET AJAX-Enabled Web Site را در زمان ایجاد یک وب سایت نشان می دهد .
    <DIV style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px" align=center><FONT face="Times New Roman"><FONT face=Tahoma><FONT size=2>
     
    minaaa, ‏8/1/11
    #7
  8. minaaa

    کاربر پیشرفته

    تاریخ عضویت:
    ‏9/12/10
    ارسال ها:
    19,773
    تشکر شده:
    6,457
    امتیاز دستاورد:
    113
    تحولی بزرگ در عرصه وب ( بخش هشتم )


    .wysiwyg { BACKGROUND: #f5f5ff; FONT: 10pt tahoma,tahoma,tahoma; COLOR: #000000 } P { MARGIN: 0px } .inlineimg { VERTICAL-ALIGN: middle } نویسنده : شرکت سخاروش
    در
    بخش
    هفتم     با نحوه ایجاد یک صفحه مبتنی بر Ajax با تمرکز بر
    روی پتانسیل های سمت سرویس دهنده فریمورک ASP. NET Ajax آشنا شدیم . بدین
    منظور یک نمونه مثال ساده را بررسی کردیم که در آن از کنترل های UpdatePanel
    و UpdateProgress به منظور نشان دادن قابلیت
    Ajax در صفحات
    ASP. NET
    استفاده شده بود .
    در این بخش با نحوه ایجاد یک صفحه مبتنی بر Ajax با تمرکز بر روی
    پتانسیل های سمت سرویس گیرنده فریمورک ASP. NET Ajax ، آشنا خواهیم شد .
    مقدمه
    رویکرد مبتنی بر سرویس دهنده در عین سادگی و شفافیت دارای چالش های مختص
    به خود با توجه به اصول اولیه تعریف شده در خصوص برنامه های مبتنی بر
    Ajax است . پیاده سازی نرم افزارهای
    مبتنی بر Ajax زمانی که فرصت و یا بهتر بگوئیم
    شرایط اجرای اکثر ماژول های برنامه در مرورگر ( در مقابل سرویس دهنده ) فراهم گردد
    ، نتایج بمراتب موثرتری را به دنبال خواهند داشت .
    فراموش نکنیم یکی از مهمترین اصول برنامه های Ajax ،
    عرضه هوشمندانه تر برنامه ها توسط مرورگر می باشد و به همین دلیل است که نقش سرویس
    دهنده به ارسال داده مورد نیاز جهت بهنگام سازی بخش رابط کاربر محدود شده است .
    بدیهی است تفکر فوق و تحقق عملی آن در زمان طراحی و پیاده سازی اینگونه برنامه ها ،
    کاهش محسوس مبادله داده بین سرویس دهنده و مرورگر را به دنبال خواهد داشت .
    مدل پیاده سازی با محوریت سرویس گیرنده
    همانگونه که در
    بخش ششم
    اشاره گردید ، در این مدل ، لایه Presentation
    متاثر از اسکریپت های سمت سرویس گیرنده با بکارگیری DHTML
    و جاوا اسکریپت می
    گردد. این بدان معنی است که یک برنامه با هوشمندی و تعامل بیشتر ،
    از طریق سرویس دهنده برای سرویس گیرنده ارسال می گردد ( در زمان استقرار صفحه در
    حافظه برای مرتبه اول ) . پس از آن ، تعامل بین برنامه مرورگر و سرویس دهنده محدود
    به بازیابی داده مورد نیاز جهت بهنگام سازی صفحه است . در این مدل کاربران با
    برنامه تعامل
    زیادی خواهند داشت (
    برنامه ای که در سمت سرویس گیرنده و در مرورگر کاربر اجراء شده است ) .
    برای آشنائی عملی با مدل فوق ، در ادامه یک نمونه مثال ساده و در عین حال کاربردی
    را بررسی خواهیم کرد.
    در این مثال با فراخوانی یک سرویس وب از طریق کد سمت سرویس گیرنده ، داده مورد نیاز
    جهت بهنگام سازی بخش رابط کاربر از سرویس دهنده دریافت خواهد شد .
    قبل از تشریح
    مثال فوق ، بد نیست در ابتدا با برخی از مفاهیم کلیدی و مهم در رابطه
    با بکارگیری سرویس های وب از طریق کد سمت سرویس گیرنده در برنامه های
    وب مبتنی بر
    Ajax آشنا شویم .
    دستیابی به سرویس های وب از
    طریق کد سمت سرویس گیرنده
    ASP. NET Ajax روش های متعددی را
    به منظور
    فراخوانی سرویس های وب ارائه می نماید . جاوا اسکریپت ، XML
    Script و AutoCompleteExtender نمونه هائی
    در این زمینه می باشند . با استفاده از امکانات ارائه شده در فریمورک فوق ، پیاده
    کنندگان می توانند سرویس های وب را ( فایل هائی با انشعاب
    asmx . ) از طریق مرورگر و
    به کمک کدهای سمت سرویس گیرنده فراخوانده و از
    پتانسیل های آنها در برنامه های وب با هدف بهبود بخش رابط کاربر استفاده نمایند .
    در چنین مواردی ، یک صفحه می تواند متدهای سمت سرویس دهنده را بدون انجام
    postback و نیاز به بازخوانی تمامی صفحه
    فراخوانده و از آنها استفاده
    نماید
    ، چراکه صرفا” داده بین مرورگر و سرویس دهنده وب مبادله خواهد شد .
    بکارگیری کلاس های پراکسی جاوا اسکریپت
    یکی از روش های فریمورک ASP.NET Ajax برای
    فراخوانی سرویس های وب
    است .بدین ترتیب می توان یک متد از سرویس وب موجود در سمت سرویس دهنده را با
    فراخوانی متد کلاس پراکسی جاوا اسکریپت مرتبط با آن فراخواند .
    ASP. NET Ajax ، همچنین امکانات لازم برای جاوا اسکریپت
    به منظور فراخوانی سرویس هائی نظیر پروفایل و membership
    را ارائه می نماید .
    در مثالی که در ادامه بررسی خواهیم کرد ، از طریق جاوا اسکریپت در سمت سرویس گیرنده
    ، متد مورد نیاز سرویس وب در سمت سرویس دهنده صدا زده می شود .
    آشنائی با پراکسی های
    ASP.NET AJAX Web Service
    کد پراکسی دارای یک نقش مهم و حیاتی در ارسال و دریافت پیام از سرویس
    های وب است . فراخوانی یک سرویس وب با استفاده از پراکسی سمت سرویس گیرنده یکی از
    ویژگی های مهم فریمورک
    ASP. NET Ajax در سمت سرویس گیرنده است . در دات نت ، با
    استفاده از wsdl.exe و یا بکارگیری گزینه
    Add Web Reference در ویژوال استودیو ، امکان ایجاد
    پراکسی
    فراهم می گردد . پراکسی های
    ASP. NET Ajax با روش های فوق تولید نخواهند شد و برای ایجاد آنها می بایست
    از خصلت Service
    کنترل ScriptManager
    استفاده کرد .
    فعال کردن قابلیت
    فراخوانی سرویس های وب به کمک جاوا اسکریپت
    برای فراخوانی سرویس های وب از طریق اسکریپت می بایست پیکربندی لازم را
    به کمک فایل web.config انجام داد . بدین منظور لازم است
    ScriptHandlerFactory HTTP handler را از طریق فایل web.config
    ، ریجستر کرد تا قادر به پردازش درخواست هائی باشد که از سمت سرویس گیرنده و به کمک
    اسکریپت ها قصد استفاده از سرویس های وب را دارند. در مواردی که فراخوانی یک سرویس
    وب توسط ASP.NET Ajax صورت نمی پذیرد ، درخواست مربوطه
    به هندلر پیش فرض ارجاع داده می شود.
    کد زیر ، یک نمونه فایل web.config به همراه
    handler مربوطه را نشان می دهد .





    <span style="font-size: xx-small; font-family: Tahoma;"> کد PHP:
    <code style="margin: 0px; padding: 0px; font-style: inherit; font-weight: inherit; font-family: monospace; line-height: 12px;"><code style="margin: 0px; padding: 0px; font-style: inherit; font-weight: inherit; font-family: monospace; line-height: 12px;">
    <system.web>
    <    httpHandlers>
    <    remove verb=”*” path=”*.asmx”/>
    <    add verb=”*” path=”*.asmx”
    type    =”System.Web.Script.Services.ScriptHandlerFactory” validate=”false”/>
    </    httpHandlers>
    <    system.web>
    </code></code>​

    توجه داشته باشید در زمان ایجاد یک وب سایت مبتنی بر
    Ajax در ویژوال استودیو نسخه های ۲۰۰۵ و یا ۲۰۰۸
    ، تنظیمات
    فوق بطور اتوماتیک در فایل web.config
    اعمال خواهد شد .
    پس از اعمال تغییرات فوق ،
    برای فعال کردن
    قابلیت فراخوانی یک سرویس وب از طریق اسکریپت در یک صفحه ASP.NET
    ،
    مراحل زیر را می بایست انجام داد :

    • <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">
      <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">مرحله اول : اضافه کردن کنترل ScriptManager بر روی صفحه
    • مرحله دوم :
      اضافه کردن یک مرجع به سرویس وب توسط عنصر asp:ServiceReference و تنظیم خصلت
      path آن به گونه ای که به سرویس وب اشاره نماید . شی
      ServiceReference به ASP.NET Ajax اعلام می نماید
      که یک کلاس پراکسی جاوا اسکریپت را برای فراخوانی سرویس وب مورد نظر توسط اسکریپت ،
      تولید نماید .

    کد زیر ، نحوه فراخوانی یک سرویس وب با نام
    Test.asmx توسط اسکریپت را نشان می دهد .





    <span style="font-size: xx-small; font-family: Tahoma;"> کد PHP:
    <code style="margin: 0px; padding: 0px; font-style: inherit; font-weight: inherit; font-family: monospace; line-height: 12px;"><code style="margin: 0px; padding: 0px; font-style: inherit; font-weight: inherit; font-family: monospace; line-height: 12px;"> <asp:ScriptManager runat=”server”
    ID    =”scriptManager”>
    <    Services>
    <    asp:ServiceReference path=”~/WebServices/Test.asmx”
    />
    </    Services>
    </    asp:ScriptManager>
    </code></code>​



    در زمان تفسیر صفحه ای که شامل عنصر
    <asp:ScriptManager> می باشد ، یک کلاس پراکسی جاوا
    اسکریپت برای سرویس وب Test.asmx ایجاد می
    گردد . کلاس پراکسی ، دارای متدهای مرتبط با هر یک از متدهای موجود در سرویس وب
    Test.asmx می باشد . صفحه همچنین شامل کلاس های پراکسی جاوا
    اسکریپت مرتبط با نوع های داده سرویس دهنده است که به عنوان پارامتر ورودی و
    یا مقادیر برگردانده شده
    توسط متدهای سرویس وب
    مورد استفاده قرار می گیرد . بدین ترتیب ، اسکریپت قادر به مقداردهی اولیه
    پارامترها و برگرداندن مقادیر خواهد بود .
    پس از این مقدمه نسبتا” طولانی و شاید هم خسته کننده ! ولی ضروری ،
    اجازه دهید در ادامه به منظور آشنائی با قابلیت های فریمورک
    ASP.NET Ajax در سمت سرویس گیرنده ، یک نمونه مثال کاربردی را با یکدیگر
    دنبال نمائیم .


    مثال : ایجاد یک صفحه مبتنی بر Ajax
    با تمرکز بر روی پتانسیل های سمت سرویس گیرنده
    در این مثال می خواهیم تعداد مقالاتی را که بر روی سایت
    سخا روش و در هر یک از گروه های مختلف منتشر شده است ، به اطلاع ملاقات کنندگان
    سایت برسانیم .برای سادگی کار ، فرض می شود که تعداد مقالات منشتر شده بر روی
    سایت از طریق بانک اطلاعاتی بازیابی نخواهد شد و در مقابل از یک کلاس
    با نام Maghalat برای
    بازیابی تعداد مقالات منشتر شده در هر گروه استفاده خواهیم کرد . کلاس فوق دارای
    صرفا” یک متد با
    GetNumberOfMaghalat است که وظیفه آن برگرداندن تعداد
    مقالات منتشر شده در هر گروه است .
    برای دستیابی به خدمات این متد از یک سرویس وب با نام MaghalatService.asmx
    استفاده خواهیم کرد که از طریق کد سمت سرویس گیرنده فعال خواهد شد .
    پس از آشنائی اولیه با صورت مسئله ،
    مراحل زیر را برای پیاده سازی یک صفحه وب مبتنی بر
    Ajax با محوریت سرویس
    گیرنده ، دنبال می نمائیم .
    مراحل اول (
    ایجاد سایت ) و دوم (
    طراحی و پیاده سازی کلاس Maghalat ) همانند مثال ارائه شده در
    بخش
    هفتم     است .


    مرحله سوم : تعریف یک سرویس وب

    برای جستجو و یافتن تعداد مقالات منتشر شده در هر گروه از یک
    سرویس وب با نام
    MaghalatService.asmx استفاده
    خواهیم کرد که متد
    GetNumberOfMaghalat کلاس Maghlat
    را فرامی خواند . کد سرویس وب فوق در جدول زیر نشان داده شده است .



    <span style="font-family: Tahoma;">

    کد PHP:
    <code style="margin: 0px; padding: 0px; font-style: inherit; font-weight: inherit; font-family: monospace; line-height: 12px;"><code style="margin: 0px; padding: 0px; font-style: inherit; font-weight: inherit; font-family: monospace; line-height: 12px;"><%@
    WebService
    Language    =”VB</acronym>”
    Class=”MaghalatService”
    %>
    Imports System
    Imports System    .Web
    Imports
    System    .Web.Services
    Imports
    System    .Web.Services.Protocols
    Imports
    System    .Web.Script.Services <ScriptService()> _
    Public
    Class     MaghalatService

    Inherits System    .Web.Services.WebService

    <ScriptMethod()> _
    <WebMethod()> _

    Public Function
    GetNumberOfMaghalat(ByVal
    articleGroup     As
    String)
    As
    Integer

    System    .Threading.Thread.Sleep(1000)

    Return     Maghalat.GetNumberOfMaghalat(articleGroup)
    End
    Function
    End Class
    </code></code>​



    توضیحات :


    • <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">
      <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">namespace با نام System.Web.Script.Services
      بخشی از هسته فریمورک ASP.NET Ajax است که
      برخی از عملیات مبادله داده در شبکه و اسکریپت نویسی را کپسوله می نماید . <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">از دو خصلت جدید ScriptService
      و ScriptMethod در زمان تعریف متد و کلاس سرویس وب
      استفاده شده است . با استفاده از خصلت های فوق ، فریمورک ASP.NET Ajax
      تشخیص می دهد که کدام بخش از سرویس ها توسط پراکسی های جاوا اسکریپت بکار گرفته شده
      است . وجود خصلت ScriptMethod ضروری نیست ولی با
      استفاده از آن می توان برخی تنظیمات متد را انجام داد . <LI style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; LIST-STYLE-POSITION: outside; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: disc">پرداختن به این موضوع که پراکسی چه چیزهائی را تولید
      می نماید ، خارج از حوصله این مقاله است. با نگاهی به انتهای پراکسی تعریف شده در
      سرویس وب فوق ،در انتها با
      متد GetNumberOfMaghalat مواجه می شویم .
      متد فوق به اسکریپت سمت سرویس گیرنده مکانیزمی را
      ارائه می نماید که بتواند متدهای وب
      موجود در سرویس وب را استفاده نماید .
      در زمان فراخوانی سرویس وب از مجموعه
      پارامترهای بمراتب بیشتری استفاده
      خواهد شد که پیاده کنندگان آنها را در سرویس وب تعریف نکرده اند .
    • در صورت مشاده فایل ASMX
      در مرورگر به همراه سوئیچ js</acronym>/ ، پراکسی جاوا اسکریپت
      تولید شده توسط فریمورک برای سرویس فوق نشان داده می شود .




    <span style="font-size: xx-small; font-family: Tahoma;"> کد PHP:
    <code style="margin: 0px; padding: 0px; font-style: inherit; font-weight: inherit; font-family: monospace; line-height: 12px;"><code style="margin: 0px; padding: 0px; font-style: inherit; font-weight: inherit; font-family: monospace; line-height: 12px;"> var MaghalatService=function() {
    MaghalatService.initializeBase(this);
    this._timeout = 0;
    this._userContext = null;
    this._succeeded = null;
    this._failed = null;
    }
    MaghalatService.prototype={
    _get_path:function() {
    var     p = this.get_path();
    if (    p) return p;
    else return     MaghalatService._staticInstance.get_path();},
    GetNumberOfMaghalat:function(articleGroup,succeededCallback, failedCallback,
    userContext) {
    return     this._invoke(this._get_path(),
    ‘GetNumberOfMaghalat’,false,{articleGroup:articleGroup},succeededCallback,failedCallback,userContext);
    }}
    MaghalatService.registerClass(‘MaghalatService’,Sys.Net.WebService*****);
    MaghalatService._staticInstance = new MaghalatService();
    MaghalatService.set_path = function(value) {
    MaghalatService._staticInstance.set_path(value); }
    MaghalatService.get_path = function() { return
    MaghalatService._staticInstance.get_path(); }
    MaghalatService.set_timeout = function(value) {
    MaghalatService._staticInstance.set_timeout(value); }
    MaghalatService.get_timeout = function() { return
    MaghalatService._staticInstance.get_timeout(); }
    MaghalatService.set_defaultUserContext = function(value) {
    MaghalatService._staticInstance.set_defaultUserContext(value); }
    MaghalatService.get_defaultUserContext = function() { return
    MaghalatService._staticInstance.get_defaultUserContext(); }
    MaghalatService.set_defaultSucceededCallback = function(value) {
    MaghalatService._staticInstance.set_defaultSucceededCallback(value); }
    MaghalatService.get_defaultSucceededCallback = function() { return
    MaghalatService._staticInstance.get_defaultSucceededCallback(); }
    MaghalatService.set_defaultFailedCallback = function(value) {
    MaghalatService._staticInstance.set_defaultFailedCallback(value); }
    MaghalatService.get_defaultFailedCallback = function() { return
    MaghalatService._staticInstance.get_defaultFailedCallback(); }
    MaghalatService.set_path(“/Ajax1/MaghalatService.asmx”);
    MaghalatService.GetNumberOfMaghalat=
    function(    articleGroup,onSuccess,onFailed,userContext)
    {    MaghalatService._staticInstance
    </code></code>​



    مرحله چهارم : ایجاد یک
    صفحه ASP.NET
    در ادامه یک صفحه aspx . را به منظور استفاده
    از امکانات ارائه شده در سرویس فوق ایجاد می نمائیم . در اولین گام می بایست قابلیت
    استفاده از Ajax در صفحه فعال گردد . بدین منظور از کنترل ScriptManager استفاده
    خواهیم کرد . در ادامه ، یک مرجع به سرویس وب توسط عنصر asp:ServiceReference
    اضافه کرده و مقدار خصلت
    path آن را MaghalatService.asmx در نظر می گیریم .



    کد PHP:
    <code style="margin: 0px; padding: 0px; font-style: inherit; font-weight: inherit; font-family: monospace; line-height: 12px;"><code style="margin: 0px; padding: 0px; font-style: inherit; font-weight: inherit; font-family: monospace; line-height: 12px;"><asp:ScriptManager
    ID    =”ScriptManager1″
    runat    =”server”
    >
    <    Services>
    <    asp:ServiceReference
    Path    =”MaghalatService.asmx”
    />
    </    Services>
    </    asp:ScriptManager>
    </code></code>​




    در بخش ویژوال صفحه ASP.NET
    از عناصر سرویس دهنده استفاده نشده است و صرفا” از عناصر HTML
    که امکان دستیابی به آنها از طریق کدهای سمت سرویس گیرنده وجود دارد ، استفاده شده
    است .





    <span style="font-size: xx-small; color: rgb(0, 0, 255); font-family: Tahoma;"> کد PHP:
    <code style="margin: 0px; padding: 0px; font-style: inherit; font-weight: inherit; font-family: monospace; line-height: 12px;"><code style="margin: 0px; padding: 0px; font-style: inherit; font-weight: inherit; font-family: monospace; line-height: 12px;"> <div
    align    =”center”>
    <    span
    style    =”font-size:
    10pt;
    font-family:
    Tahoma”>




    <    strong
    dir    =”rtl”
    style    =”text-align:
    center”>ایجاد یک صفحه وب مبتنی بر
    Ajax     <br
    />

    ((     پیاده سازی با محوریت پتانسیل های سمت سرویس گیرنده فریمورک ASP.NET Ajax
    )) </strong>
    <    br
    />
    </    span>

    <    br
    />
    <    select
    id    =”ArticleGroup”
    size    =”5″
    style    =”font-size:
    12pt;
    width:
    146px;
    color:
    navy;
    font-family:
    Tahoma”>

    <    option
    value    =”Software”>

    نرم افزار
    </option>

    <    option
    value    =”Hardware”
    >سخت
    افزار     </option>




    <    option
    value    =”Security”>
    امنیت اطلاعات
    </option>

    <    option
    value    =”Network”>
    شبکه </option>




    <    option
    value    =”others”>سایر
    </option>
    </    select>



    </    div>

    <    br/>

    <    div
    align    =”center”
    style
    =”font-family
    :Tahoma ;
    font-size :small
    “    >
    <    span
    id    =”maghalatResults”></span>
    <    span
    id    =”loading”
    style    =”display:none;“>

    <    img
    src    =”images/ajax1.gif”
    alt    =”"
    />



    &nbsp;&nbsp;
    در حال بارگذاری…


    </span>

    </div>
    </code></code>​




    با توجه به این که
    برای ایجاد بخش رابط کاربر به امکانات موجود در سمت سرویس دهنده نیاز نمی باشد ،
    صرفا” از عناصر HTML معمولی در مقابل کنترل های سرویس
    دهنده استفاده شده است . در صفحه فوق از عناصری نظیر Select
    ( جهت ارائه لیست گروه مقالات ) و Span
    ( جهت نمایش فیدبک دیداری به کاربر در زمان بازیابی داده از سرویس دهنده ) استفاده
    شده است .
    برای دمیدن روح حیات در کالبد صفحه فوق از کد جاوا اسکریپت زیر استفاده شده است .




    کد PHP:
    <code style="margin: 0px; padding: 0px; font-style: inherit; font-weight: inherit; font-family: monospace; line-height: 12px;"><code style="margin: 0px; padding: 0px; font-style: inherit; font-weight: inherit; font-family: monospace; line-height: 12px;">
    <script
    type    =”text/javascript”>
    <!    –
    var
    articleGroup = null;
    Sys.Application.add_load(page_load);
    Sys.Application.add_unload(page_unload); function
    page_load(sender, e){
    articleGroup = $get(“ArticleGroup”);
    $addHandler(articleGroup,
    “change”,
    articleGroup_onchange);
    }

    function
    page_unload(sender, e){
    $removeHandler(articleGroup,
    “change”,
    articleGroup_onchange);
    }
    function
    articleGroup_onchange(sender, e){
    $get(“maghalatResults”).innerHTML
    = “”;
    $get(“loading”).style.display
    = “block”;
    var
    selectedValue = articleGroup.value;

    MaghalatService.GetNumberOfMaghalat(selectedValue,onSuccess);
    }
    function
    onSuccess(result){
    $get(“loading”).style.display
    = “none”;
    $get</span     ​
     
    minaaa, ‏8/1/11
    #8