پنجشنبه ۰۴ اردیبهشت ۱۴۰۴

Thursday, April 24, 2025 GMT +3:30

فریم ورک های ای جکس (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 در نسخه های بعدی نیاز به استفاده از فریم ورک ها را به حداقل ممکن کاهش خواهد داد.
دسته بندی: آموزش مقدماتی » Ajax
related مطالب بیشتر:
ذخیره و نمایش اطلاعات فایل با ای جکس (Ajax) و PHP
نمایش پیام در حال بارگذاری با ای جکس (Ajax)
ارسال و دریافت اطلاعات با متد GET و POST در ای جکس (Ajax)
نمایش افکت fade in با ای جکس (Ajax)
آموزش ای جکس (Ajax)، تکنیک غیرهمزمانی در وب
دیدگاه
more ۱۱ دیدگاه برای این مطلب ارسال شده است.
more چینش دیدگاه ها به ترتیب از جدیدترین به قدیمی ترین است.
امیر
۱۴:۰۵ ۱۳۹۶/۰۶/۲۳
با سلام خدمت شما دوست عزیز
من یک فرم با ایجکس درست کردم که یک سری اطلاعات رو برای یک صفحه php ارسال میکنه و اطلاعات هم درست در بانک من ذخیره میشه ولی من یک ایراد دارم که تا به امروز رفع نشده ؟ اونم اینکه وقتی اطلاعات ثبت میشه اطلاعات فیلدها هنوز وجود دارند که این درست نیست به زبان سادتر من می خوام وقتی اطلاعات ذخیره میشن فرم هم یا کلن display بشه و یا اینکه مقادیر فیلدها پاک بشن
ممنون میشم جواب بدین
انجام این کار با کدهای جاوا اسکریپت در متد readyState ممکن است:
xmlHttp.onreadystatechange = function(){
if(xmlHttp.readyState == 4){
document.getElementById('input-id').value = '';
}
}
مهدی
۱۷:۴۰ ۱۳۹۵/۰۸/۰۸
googleapis چه جوری تلفظ میشه؟
تلفظ فارسی: "گوگل اپیز" تلفظ اصلی:
https://translate.google.com/#en/fa/googleapis

https://www.youtube.com/watch?v=gZTn6AQDy1g
linkody
۱۴:۰۸ ۱۳۹۵/۰۵/۱۷
استفاده از ajax تو همه زبان های برنامه نویسی یه جوره؟ یعنی همونطوری که توی asp براش کد میزنیم تو php هم میزنیم؟
بله، استفاده از قابلیت Ajax به زبان برنامه نویسی سمت سرور ارتباط مستقیمی ندارد!
۱۴:۴۱ ۱۳۹۵/۰۱/۱۲
من برای اولین بار یک فریم ورک ساده css با نام رکسانا توسعه دادم که بر پایه scss است شما با معرفی این فریم ورک بنده را در توسعه و پیشرفت اولین فریم ورک ایرانی کمک کنید
لینک توضیحات
http://goo.gl/mO9jzJ
CHRIS-7
۲۰:۴۲ ۱۳۹۴/۰۱/۱۹
ممنون بنده توانستم با دانش خود مشکلم را حل کنم.
با تشکر از شما و سایت بسیار مفید و کاربردیتان.
CHRIS-7
۰۶:۴۴ ۱۳۹۴/۰۱/۱۰
با سلام - دوستان بنده چگونه می توانم از آژاکس برای انجمن SMF استفاده کنم - من کدها را در فایل دیگری نوشته اما می خوام آن فایل را فراخوانی کنم - ساده تر بگویم می خوام پستی را که می دهم بتوانم بدون بارگذاری مجدد پیش نمایش پست را مشاهده کنم.
با تشکر
سوال کلی است! ابتدا باید درک درستی از Ajax و قابلیت های آن داشته باشید، در کنار این موضوع باید با ساختار کدنویسی سیستم مدیریت محتوای انجمن نیز آشنا باشید، به عبارت دیگر بدون بررسی دقیق نمی توان راه حل ساده ای ارائه کرد!
مهدی
۱۶:۴۸ ۱۳۹۳/۰۵/۲۳
بازم عالی
Ali
۲۲:۵۶ ۱۳۹۳/۰۳/۲۸
سلام
ممنون از مطالب جالبتون...
من میخوام یک برنامه با آژاکس بنویسم که با در حین چت کردن متن رو همونجا نمایش بده
میتونین یه بخش به عنوان مثال های کاربردی بزنین؟ اگه ممکن باشه چند تا برنامه ساده با آجاکس رو توش بزارین ؟
متشکر از شما
طراحی سیستم چت نیاز به داشتن دانش و آشنایی در حد حرفه ای با مباحث مختلف جاوا اسکریپت و ترکیب آن با Ajax، PHP و MySQL است، متاسفانه نمی توان برای این مورد برنامه یا نمونه ساده ای نوشت! ذاتا پیچیده است و مباحث زیادی را شامل می شود، اگر به دنبال نمونه های ساده هستید، در آموزش های مقدماتی و در خلال مطالب به صورت موردی نمونه هایی وجود دارد.
خلیل
۱۳:۱۹ ۱۳۹۲/۰۷/۲۷
ممنون خیلی خوب بود . اره میتونین در منوی درختی سمت راست بعد از دانستنی ها یه صفحه در موضوع امنیت اضافه کنین که خیلی خیلی بهتر میشه چون موضوع امنیت بیشتر به کار میره . البته یه پیشنهاد بود . بازم ممنون
خیلی ممنون از پیشنهاد ارزشمند شما، در صورت امکان اضافه خواهد شد.
وحید
۰۰:۲۵ ۱۳۹۲/۰۴/۱۷
سلام
من تقریبا نصف مطالب رو خوندم همه چی داره ولی بد نیست یه قسمت دیگه زیر تیتر بهینه سازی اضافه کنین
مثلا تیتر امنیت یا کدهای ایمنی یا نکته های امنیتی خلاصه در مورد امنیت کامل یک وبسایت لطفا
ممنون از پیشنهاد ارزشمند شما، در صورت امکان اضافه خواهد شد.
احسان
۱۸:۲۴ ۱۳۹۱/۰۹/۰۸
نوشته ها تون خیلی عالی بود خدا خیرت بده
more لطفا پیش از ارسال دیدگاه نکات زیر را مد نظر داشته باشید:
- به سوالات کلی، زمانبر، مبهم و مشکلاتی که تلاشی برای رفع آنها نکرده باشید پاسخ مختصر داده شده یا به بخش برنامه نویسی اختصاصی ارجاع داده می شوند.
- کدها و اسکریپت های طولانی را ترجیحا در یک صفحه وب آنلاین یا به صورت حساب موقت و آزمایشی قرار دهید تا امکان بررسی دقیق مشکل و خطایابی میسر باشد.
- تمام دیدگاه های ارسالی خوانده شده و برای هر کاربر مدت زمان لازم جهت پاسخگویی در نظر گرفته می شود، لطفا از طرح سوالات متعدد در بازه زمانی کوتاه خودداری کنید.



 refresh
10 × 10
4 × 6
20 × 20
=