آگهی
article

فریم ورک های ای جکس (Ajax Frameworks)

ajax-framework

اغلب استفاده ما از ای جکس (Ajax) در برنامه نویسی وب به قابلیت های ذاتی و استاندارد آن محدود می شود و شاید خواندن این مطلب برای کاربردهای عمومی چندان هم ضروری نباشد اما اگر بخواهیم تا حد تسلط کامل پیش برویم ناگزیر باید با مبحث فریم ورک های ای جکس حداقل در حد اطلاعات اولیه آشنا باشیم، بعضا ممکن است در پروژه های بزرگ برنامه نویسی برخی کارهای پیچیده با صرف کدنویسی ای جکس و متدهای متداول آن محقق نشود یا در کارهای گروهی به دلیل ایجاد سرعت و هماهنگی بیشتر یا سلیقه اعضاء تیم نیاز به کار با کتابخانه ها، API ها و توابع دیگری باشد که در این آموزش در مجموع به آنها فریم ورک می گوئیم، به همین خاطر در ادامه مباحث مقدماتی ای جکس (Ajax) این مطلب را اختصاص داده ایم به آشنایی با فریم ورک های ای جکس (Ajax Frameworks) تا با نگاهی بازتر بتوانیم از تمام قابلیت های تکنیک غیرهمزمانی در وب استفاده کنیم.

فریم ورک (Framework) چیست؟


منظور از فریم ورک (Framework) قابلیتی است که معمولا با کمک گرفتن از مجموعه ای از دستورالعمل ها، کتابخانه ها، رابط کاربری، کلاس ها و در کل امکانات فراهم شده از جانب یک نرم افزار یا یک زبان برنامه نویسی، ساختاری جدید ایجاد می کند تا به کارگیری آن نرم افزار یا زبان برنامه نویسی در راستای اهداف ایجاد فریم ورک، ساده تر و نتیجه با سهولت بیشتری محقق گردد، به عبارتی هدف از ایجاد فریم ورک ها معمولا فراهم نمودن ساز و کاری است که بتوان از امکانات یک نرم افزار یا زبان برنامه نویسی به نحو سریع تر و در برخی موارد کاملتر و حرفه ای تر استفاده کرد، فریم ورک های ای جکس نیز از این امر مستثنی نیستند و قابلیت ارسال درخواست و دریافت پاسخ از سرور و همچنین کار با آبجکت XMLHttpRequest را دارند و معمولا برای ساخت برنامه های تحت وب با رابط کاربری (User Interface) بهینه به کار می روند.

فریم ورک های ای جکس چه قابلیت هایی دارند؟


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

پر کاربرد ترین فریم ورک ها و کتابخانه های ای جکس


اینکه برای کار با ای جکس از چه فریم ورکی باید استفاده کنیم مسئله بسیار مهمی است چرا که انتخاب اشتباه می تواند دوباره کاری های زیادی را سبب شود و آرامش ما را بر هم زند! به همین دلیل توصیه می شود از فریم ورک هایی استفاده کنیم که شناخته شده، پرکاربرد و به روز باشند، در زیر لیستی جهت نمونه ارائه می شود.

کتابخانه جی کئوری (jQuery Library)


جی کئوری (jQuery) در واقع یک کتابخانه (Library) از متدها و توابع جاوا اسکریپتی با پشتیبانی از ای جکس است،  یادگیری این کتابخانه بسیار آسان و کاربردی است و مثال های زیادی برای کار با آن در فضای وب وجود دارد، در واقع شعار برنامه نویسان و توسعه دهندگان jQuery کم بنویس و کارهای زیاد انجام بده (Write Less, Do More) است!، این فریم ورک در آدرس 
jquery.com
در دسترس قرار دارد و کافی است فایل اصلی آن را دانلود و در صفحه خود به صورت یک سورس جاوا اسکریپتی معمولی وارد کنیم، سپس می توانیم از قابلیت ها و دستورات آن متناسب با نیاز برنامه استفاده کنیم:
https://api.jquery.com/jquery.ajax/
مثال:
<input name="user" id="user" type="text">
<div id="result"></div>
<script>
var user = $("#user").val();
$.ajax({
  type: "GET",
  url: "index.php",
  data: user,
  cache: false,
  success: function(data){
     $("#result").text(data);
  }
});
</script>
در این نمونه کد مقادیر فیلد متنی user به فایل index.php ارسال و نتیجه در بلاک div با آی دی result نمایش داده می شود.
در صورت آشنایی با جاوا اسکریپت کار با جی کئوری بسیار ساده تر و روند فرآیندها سریع تر خواهد بود.

رابط برنامه های کاربردى گوگل یا Google APIs


یکی دیگر از پرکاربردترین کتابخانه های توابع و کلاس ها در ای جکس توسط تیم توسعه وب گوگل ارائه شده است، این بستر عمدتا مبتنی بر جی کئوری است و جهت ایجاد ساز و کاری برای استفاده از امکانات برنامه ها و خدمات مختلف این غول دنیای فناوری در دسترس است که تحت عنوان Google APIs (API مخفف Application Programming Interface یا رابط برنامه کاربردی) شناخته می شود، بیشتر سایت هایی که از فریم ورک های ای جکس استفاده می کنند ترجیح می دهند از این سورس های آماده بهره بگیرند چرا که کافی است کاربر یک بار از سایتی با این API دیدن کند تا از آن پس فایل فریم ورک در حافظه مرورگر ذخیره شده و در مشاهدات بعدی از همان صفحه یا سایر صفحاتی که از فایل مشابه استفاده می کنند به سرعت بارگذاری شود، این کتابخانه ای جکس گوگل در آدرس های مستقیم به فایل آن قابل دسترسی است، به طور مثال نمونه کد زیر آدرس نسخه 1.7.1 جی کئوری بهینه شده (فشرده سازی شده) را فراخوانی می کند که باید کد آن را مطابق نمونه زیر در صفحه خود درج کنیم (یا حتی می توانیم فایل را دانلود کرده و در سرور خود آپلود و فراخوانی کنیم).
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
همچنین بد نیست به آدرس 
https://developers.google.com/closure
نیز سری بزنیم (متاسفانه در حال حاضر این لینک برای IP های ایران مسدود است)، در این آدرس توسعه دهنده گان گوگل مجموعه ابزارهایی را تحت عنوان Closure Tools معرفی کرده اند که برای استفاده بهینه از جاوا اسکریپت می تواند کاربردی باشد.

کتابخانه ای جکسی مایکروسافت


برای کسانی که به زبان ASP.NET برنامه نویسی می کنند امکانات بسیار خوبی در زمینه متدهای ای جکس و کتابخانه های از پیش طراحی شده توسط شرکت مایکرسافت ارائه شده است که در آدرس 
asp.net/ajax
قابل دسترسی است.

سایر فریم ورک های ای جکس


در پایان این مطلب بد نیست اشاره ای داشته باشیم به سایر فریم ورک های مرتبط با ای جکس از جمله کتابخانه Mootools در آدرس
mootools.net
کتابخانه Prototype  در آدرس 
prototypejs.org
و همچنین کلاس (در حال تکمیل شدن) Tiny Ajax برای PHP در آدرس
codeigniter.com/wiki/TinyAjax
به نظر می رسد W3C با توسعه آبجکت XMLHttpRequest در نسخه های بعدی نیاز به استفاده از فریم ورک ها را به حداقل ممکن کاهش خواهد داد.
sectionدسته بندی: آموزش مقدماتی » Ajax
related مطالب بیشتر:
» آموزش ای جکس (Ajax)، تکنیک غیرهمزمانی در وب
» نمایش افکت fade in با ای جکس (Ajax)
» ذخیره و نمایش اطلاعات فایل با ای جکس (Ajax) و PHP
» ارسال و دریافت اطلاعات با متد GET و POST در ای جکس (Ajax)
» نمایش پیام در حال بارگذاری با ای جکس (Ajax)
commentنظرات (۱۱ یادداشت برای این مطلب ارسال شده است)
more یادداشت های جدید بر اساس تاریخ ارسال در انتهای یادداشت های موجود نمایش داده می شوند.
نویسنده: احسان
زمان: ۱۸:۲۴:۵۸ - تاریخ: ۱۳۹۱/۰۹/۰۸
نوشته ها تون خیلی عالی بود خدا خیرت بده
نویسنده: وحید
زمان: ۰۰:۲۵:۰۸ - تاریخ: ۱۳۹۲/۰۴/۱۷
سلام
من تقریبا نصف مطالب رو خوندم همه چی داره ولی بد نیست یه قسمت دیگه زیر تیتر بهینه سازی اضافه کنین
مثلا تیتر امنیت یا کدهای ایمنی یا نکته های امنیتی خلاصه در مورد امنیت کامل یک وبسایت لطفا
پاسخ: 
سلام
ممنون از پیشنهاد ارزشمند شما، در صورت امکان اضافه خواهد شد.
نویسنده: خلیل
زمان: ۱۳:۱۹:۳۵ - تاریخ: ۱۳۹۲/۰۷/۲۷
ممنون خیلی خوب بود . اره میتونین در منوی درختی سمت راست بعد از دانستنی ها یه صفحه در موضوع امنیت اضافه کنین که خیلی خیلی بهتر میشه چون موضوع امنیت بیشتر به کار میره . البته یه پیشنهاد بود . بازم ممنون
پاسخ: 
خیلی ممنون از پیشنهاد ارزشمند شما، در صورت امکان اضافه خواهد شد.
نویسنده: Ali
زمان: ۲۲:۵۶:۴۹ - تاریخ: ۱۳۹۳/۰۳/۲۸
سلام
ممنون از مطالب جالبتون...
من میخوام یک برنامه با آژاکس بنویسم که با در حین چت کردن متن رو همونجا نمایش بده
میتونین یه بخش به عنوان مثال های کاربردی بزنین؟ اگه ممکن باشه چند تا برنامه ساده با آجاکس رو توش بزارین ؟
متشکر از شما
پاسخ: 
سلام
طراحی سیستم چت نیاز به داشتن دانش و آشنایی در حد حرفه ای با مباحث مختلف جاوا اسکریپت و ترکیب آن با Ajax، PHP و MySQL است، متاسفانه نمی توان برای این مورد برنامه یا نمونه ساده ای نوشت! ذاتا پیچیده است و مباحث زیادی را شامل می شود، اگر به دنبال نمونه های ساده هستید، در آموزش های مقدماتی و در خلال مطالب به صورت موردی نمونه هایی وجود دارد.
نویسنده: مهدی
زمان: ۱۶:۴۸:۴۸ - تاریخ: ۱۳۹۳/۰۵/۲۳
بازم عالی
نویسنده: CHRIS-7
زمان: ۰۶:۴۴:۵۲ - تاریخ: ۱۳۹۴/۰۱/۱۰
با سلام - دوستان بنده چگونه می توانم از آژاکس برای انجمن SMF استفاده کنم - من کدها را در فایل دیگری نوشته اما می خوام آن فایل را فراخوانی کنم - ساده تر بگویم می خوام پستی را که می دهم بتوانم بدون بارگذاری مجدد پیش نمایش پست را مشاهده کنم.
با تشکر
پاسخ: 
سلام
سوال کلی است! ابتدا باید درک درستی از Ajax و قابلیت های آن داشته باشید، در کنار این موضوع باید با ساختار کدنویسی سیستم مدیریت محتوای انجمن نیز آشنا باشید، به عبارت دیگر بدون بررسی دقیق نمی توان راه حل ساده ای ارائه کرد!
نویسنده: CHRIS-7
زمان: ۲۰:۴۲:۲۱ - تاریخ: ۱۳۹۴/۰۱/۱۹
ممنون بنده توانستم با دانش خود مشکلم را حل کنم.
با تشکر از شما و سایت بسیار مفید و کاربردیتان.
نویسنده: وحید الوندی
زمان: ۱۴:۴۱:۰۳ - تاریخ: ۱۳۹۵/۰۱/۱۲
من برای اولین بار یک فریم ورک ساده css با نام رکسانا توسعه دادم که بر پایه scss است شما با معرفی این فریم ورک بنده را در توسعه و پیشرفت اولین فریم ورک ایرانی کمک کنید
لینک توضیحات
http://goo.gl/mO9jzJ
نویسنده: linkody
زمان: ۱۴:۰۸:۴۴ - تاریخ: ۱۳۹۵/۰۵/۱۷
استفاده از ajax تو همه زبان های برنامه نویسی یه جوره؟ یعنی همونطوری که توی asp براش کد میزنیم تو php هم میزنیم؟
پاسخ: 
بله، استفاده از قابلیت AJAX به زبان برنامه نویسی سمت سرور ارتباط مستقیمی ندارد!
نویسنده: مهدی
زمان: ۱۷:۴۰:۱۱ - تاریخ: ۱۳۹۵/۰۸/۰۸
googleapis چه جوری تلفظ میشه؟
پاسخ: 
تلفظ فارسی: "گوگل اپیز" تلفظ اصلی:
https://translate.google.com/#en/fa/googleapis

https://www.youtube.com/watch?v=gZTn6AQDy1g
نویسنده: امیر
زمان: ۱۴:۰۵:۴۰ - تاریخ: ۱۳۹۶/۰۶/۲۳
با سلام خدمت شما دوست عزیز
من یک فرم با ایجکس درست کردم که یک سری اطلاعات رو برای یک صفحه php ارسال میکنه و اطلاعات هم درست در بانک من ذخیره میشه ولی من یک ایراد دارم که تا به امروز رفع نشده ؟ اونم اینکه وقتی اطلاعات ثبت میشه اطلاعات فیلدها هنوز وجود دارند که این درست نیست به زبان سادتر من می خوام وقتی اطلاعات ذخیره میشن فرم هم یا کلن display بشه و یا اینکه مقادیر فیلدها پاک بشن
ممنون میشم جواب بدین
پاسخ: 
انجام این کار با کدهای جاوا اسکریپت در متد readyState ممکن است:
xmlHttp.onreadystatechange = function(){
if(xmlHttp.readyState == 4){
document.getElementById('input-id').value = '';
}
}
more لطفا پیش از ارسال یادداشت نکات زیر را مد نظر داشته باشید:
- مواردی که به کلی خارج از موضوع این مطلب هستند را در فرم منوی "تماس با ما" مطرح و پاسخ را از طریق ایمیل دریافت کنید.
- به سوالات کلی، مبهم، غیرضروری و مشکلاتی که تلاشی برای رفع آن نکرده باشید پاسخ خاصی داده نخواهد شد.
- کدها و اسکریپت های طولانی را ترجیحا در یک صفحه وب آنلاین قرار دهید تا امکان تست و بررسی وجود داشته باشد.
- تمام یادداشت ها بررسی و برای هر کاربر زمان مشخصی جهت پاسخگویی در نظر گرفته می شود، لذا از طرح سوالات متعدد در بازه زمانی کوتاه خودداری کنید.




8 × 3
 refresh
نکته:
با توجه به تاریخ نگارش آموزش های سایت و پیشرفت تکنولوژی های مرتبط با وب در سالیان اخیر، محتوای برخی از مطالب قدیمی ممکن است نیاز به ویرایش و به روزرسانی داشته باشد که این کار هم زمان با تهیه نسخه جدید «وبگو» به مرور در حال انجام است، لطفا در استفاده از مطالب سایت به این نکته دقت داشته و حتی المقدور از چند منبع مختلف استفاده نمائید.
آخرین دیدگاه ها
form شریفی
در:
سلام معنی متن زیر چیست؟
۱۸:۲۸:۰۹ ۱۳۹۸/۱۱/۰۱

form امین
در:
سلام خسته نباشید یه اسکریپت دارم که وقتی کاربر ثبت نام میکنه یه پوشه و محتواش ایجاد میشه. میخوام یه صفحه با هر ثبت نام...
۱۴:۱۸:۵۱ ۱۳۹۸/۱۰/۳۰

form Admin
در:
سلام دوست عزیز. میشه بگویید چگونه میتوان در وبلاگ کادری را باز کرد که بازدید کنندگان بتوانند در آن چیزی بنویسند. ممنون میشم...
۱۱:۲۸:۵۰ ۱۳۹۸/۱۰/۳۰

form مهدی
در:
سلام میشه به من کمک کنید من چجوری برای وب سایتم لینک بزارم؟ اگه میشه برای ایمیلم جواب را ارسال کنید.
۲۰:۲۹:۰۸ ۱۳۹۸/۱۰/۲۹

form مهدی
در:
سلام من مهدی هستم. چجوری باید برای سایتی که ساختم آدرس بسازم که وقتی در سرچ گوگل بنویسیم برایمان بیاورد.
۱۹:۴۶:۲۳ ۱۳۹۸/۱۰/۲۸

form sadegh
در:
سلام من میخوام قالب وبلاگم رو تغییر بدم و تاریخ یا تعداد کامنت های مطالب پربازدید رو بهش اضافه کنم ولی طبق جدولی که...
۱۲:۳۰:۰۳ ۱۳۹۸/۱۰/۲۸

form امیر علی
در:
سلام من یه وبلاگ برای امان زمان ساختم الان وقتی میخوام از مدیریت برم توش میاره که فیلتره ولی وقتی ادرسش رو سرچ میکنم میاره...
۲۰:۲۶:۲۷ ۱۳۹۸/۱۰/۲۷

form حمید شیخلر
در:
سلام خسته نباشید دوست عزیز من یه راهنمایی میخواستم یه شخصی برنامه بله رو دانلود کرده ولی مخفیانه شماره تلفن من رو داده پیامک کد...
۱۷:۴۷:۴۸ ۱۳۹۸/۱۰/۲۶

form سید محسن
در:
من داخل وبلاگم تو بلاگفا یک متن نوشتم ولی 4 بار تکرار شده علتش چیه؟
۱۵:۰۵:۳۱ ۱۳۹۸/۱۰/۲۴

form ainaz
در:
سلام من در صفحم عکس گذاشتم ولی عکسم تیکه تیکه افتاده باید چکار کنم
۲۰:۵۶:۵۷ ۱۳۹۸/۱۰/۲۳

form zb84
در:
هنگام آپدیت افزونه های وردپرس به این ارور برخورد میکنم لطفا راهنمایی کنید.
۲۱:۳۴:۲۷ ۱۳۹۸/۱۰/۲۲

form esmaeel
در:
سلام من فونتا رو اوکی می کنم تو وبسایت وقتی با کامپیوتر میرم فونتا درسته ولی وقتی با گوشی میرم فونت نمیاد مشکلش چی میتونه...
۱۹:۲۹:۰۹ ۱۳۹۸/۱۰/۱۹

form john
در:
سلام خدمت شما ببخشید آیا میشه از کد های پی اچ پی هم داخل وبلاگ استفاده کرد؟
۱۳:۴۴:۱۵ ۱۳۹۸/۱۰/۱۸

form ابوالفضل شیخیانی
در:
عالی بود، ممنون بابت این پستتون
۲۲:۳۰:۴۰ ۱۳۹۸/۱۰/۱۶

form بهنام
در:
سلام من میخوام برای یک متغیر دو تا مقدار تعیین کنم مثلا هم باشه واضح تر بگم میخوام بگم اگه...
۱۷:۱۶:۳۶ ۱۳۹۸/۱۰/۱۶
آگهی