MATIN MOLKARA
SERIES: JavaScript — PART 50 OF 108

50- آموزش جاوااسکریپت | آشنایی با REST API و انواع درخواست‌های HTTP در AJAX

در این آموزش با مفهوم API و REST API آشنا می‌شوید و تفاوت درخواست‌های GET، POST، PUT و DELETE را در کار با AJAX و Fetch API یاد می‌گیرید.

تا اینجا دیدیم که چگونه می‌توان با AJAX داده را از یک فایل متنی، یک فایل JSON محلی و یک API خارجی دریافت کرد. در این بخش، کمی عمیق‌تر وارد موضوع می‌شویم و با مفهوم REST API و انواع درخواست‌هایی که با AJAX و بعداً با Fetch API می‌توان ارسال کرد آشنا می‌شویم.

تا این مرحله بیشتر تمرکز ما روی درخواست‌های GET بوده است. اما در برنامه‌های واقعی، فقط دریافت داده کافی نیست. معمولاً باید بتوانیم داده ایجاد کنیم، ویرایش کنیم یا حذف کنیم. به همین دلیل لازم است با ساختار REST و متدهای مختلف HTTP آشنا شویم.

API چیست؟

API مخفف Application Programming Interface است. این اصطلاح بسیار گسترده است و فقط به وب محدود نمی‌شود. در سیستم‌عامل، تلفن همراه، مرورگر و حتی بسیاری از دستگاه‌های هوشمند نیز انواع مختلفی از API وجود دارد.

اما در این آموزش، تمرکز ما روی Web API است.

به‌صورت ساده، API قراردادی بین دو نرم‌افزار است که مشخص می‌کند:

  • درخواست چگونه ارسال شود
  • پاسخ با چه ساختاری برگردد
  • چه داده یا عملیاتی در دسترس باشد

در عمل، یک نرم‌افزار می‌گوید: «این اطلاعات را با این ساختار می‌خواهم»
و نرم‌افزار دیگر پاسخ مناسب را با قالب مشخص برمی‌گرداند.

نمونه‌ای از Web API

نمونه‌ای که در بخش قبل بررسی شد، یک Web API بود. در آن مثال:

  • یک درخواست به آدرس مشخصی ارسال می‌شد
  • تعداد آیتم‌های موردنظر در URL قرار می‌گرفت
  • سرور درخواست را پردازش می‌کرد
  • پاسخ را در قالب JSON برمی‌گرداند

این دقیقاً همان الگوی رایج کار با Web APIها است.

REST API چیست؟

REST مخفف Representational State Transfer است.
REST یک سبک معماری برای طراحی برنامه‌های تحت شبکه است که معمولاً بر پایه ارتباط Client-Server و پروتکل HTTP کار می‌کند.

در این معماری، داده‌ها و موجودیت‌های سمت سرور به‌عنوان Resource یا منبع در نظر گرفته می‌شوند. این منابع می‌توانند:

  • خوانده شوند
  • ایجاد شوند
  • ویرایش شوند
  • حذف شوند

برای مثال، در یک برنامه واقعی، منابع می‌توانند شامل موارد زیر باشند:

  • کاربر
  • مقاله
  • محصول
  • نظر
  • سفارش

این داده‌ها معمولاً در پایگاه داده ذخیره می‌شوند و از طریق درخواست‌های HTTP مدیریت می‌شوند.

چرا REST مهم است؟

یکی از مهم‌ترین مزایای REST API این است که بر پایه استانداردهای رایج وب مانند HTTP و معمولاً فرمت JSON کار می‌کند. به همین دلیل تقریباً با هر زبان برنامه‌نویسی قابل استفاده است.

برای مثال، همه این فناوری‌ها می‌توانند با REST API کار کنند:

  • JavaScript
  • PHP
  • Python
  • Java
  • Ruby
  • Ruby on Rails

به همین دلیل REST به یکی از رایج‌ترین استانداردها برای طراحی و مصرف APIها تبدیل شده است.

نقش HTTP در REST

در REST APIها، متدهای HTTP مشخص می‌کنند که قرار است چه عملیاتی روی داده انجام شود.
تا اینجا بیشتر با GET کار کرده‌ایم، اما متدهای مهم دیگری هم وجود دارند که در برنامه‌های واقعی بسیار پرکاربرد هستند.

انواع اصلی درخواست‌های HTTP

چهار متد اصلی که بیشتر از بقیه استفاده می‌شوند عبارت‌اند از:

  • GET
  • POST
  • PUT
  • DELETE

درخواست GET

برای دریافت داده از سرور استفاده می‌شود.
مثلاً:

  • دریافت لیست کاربران
  • دریافت اطلاعات یک مقاله
  • دریافت داده از یک فایل JSON
  • دریافت داده از یک API خارجی

نمونه:

GET /api/users

درخواست POST

برای ارسال داده جدید به سرور و ایجاد یک منبع تازه استفاده می‌شود.
مثلاً:

  • ثبت کاربر جدید
  • افزودن مقاله
  • ایجاد محصول جدید

نمونه:

POST /api/users

در این نوع درخواست معمولاً داده‌ای هم همراه درخواست ارسال می‌شود.

درخواست PUT

برای به‌روزرسانی یک منبع موجود در سرور استفاده می‌شود.
مثلاً:

  • ویرایش اطلاعات کاربر
  • تغییر عنوان مقاله
  • به‌روزرسانی اطلاعات یک محصول

نمونه:

PUT /api/users/1

در اینجا 1 شناسه منبعی است که باید ویرایش شود.

درخواست DELETE

برای حذف یک منبع از سرور استفاده می‌شود.
مثلاً:

  • حذف کاربر
  • حذف محصول
  • حذف مقاله

نمونه:

DELETE /api/users/1

متدهای دیگر HTTP

علاوه بر چهار متد اصلی، چند متد دیگر هم وجود دارند که ممکن است در بعضی پروژه‌ها با آن‌ها روبه‌رو شوید.

HEAD

رفتاری شبیه GET دارد، اما فقط هدرهای پاسخ را برمی‌گرداند و بدنه پاسخ را ارسال نمی‌کند.

HEAD /api/users

OPTIONS

متدها یا قابلیت‌های پشتیبانی‌شده توسط سرور یا API را مشخص می‌کند.

OPTIONS /api/users

PATCH

برای ویرایش بخشی از یک منبع استفاده می‌شود.
این متد شبیه PUT است، اما معمولاً برای به‌روزرسانی جزئی به‌کار می‌رود.

PATCH /api/users/1

Endpoint چیست؟

در کار با APIها زیاد با اصطلاح Endpoint روبه‌رو می‌شوید.
Endpoint همان آدرس یا URL مشخصی است که برای انجام یک عملیات خاص به آن درخواست ارسال می‌کنیم.

برای مثال، اگر یک API برای مدیریت کاربران داشته باشیم، ممکن است Endpointها به این شکل باشند:

دریافت همه کاربران

GET /api/users

دریافت یک کاربر با شناسه مشخص

GET /api/users/1

ایجاد کاربر جدید

POST /api/users

به‌روزرسانی کاربر

PUT /api/users/1

حذف کاربر

DELETE /api/users/1

نکته مهم این است که بعضی از این آدرس‌ها ممکن است یکسان باشند، اما متد HTTP آن‌ها متفاوت باشد.
برای مثال، این دو درخواست یک URL یکسان دارند، اما رفتارشان متفاوت است:

GET /api/users
POST /api/users

در درخواست اول داده دریافت می‌شود و در درخواست دوم داده جدید ایجاد می‌شود.

ساختار URL در APIها همیشه یکسان نیست

همه APIها دقیقاً از یک الگوی مشابه پیروی نمی‌کنند.
بعضی از آن‌ها ممکن است URLها را به شکل متفاوتی طراحی کنند. برای مثال:

GET /users
POST /users
PUT /users/1
DELETE /users/1

یا حتی:

GET /users
POST /users/add
PUT /users/update/1
DELETE /users/delete/1

هرچند الگوی اول به ساختار رایج REST نزدیک‌تر است، اما در عمل ممکن است با مدل‌های مختلفی روبه‌رو شوید. به همین دلیل همیشه باید مستندات همان API را بررسی کنید.

ارسال داده همراه درخواست

در درخواست‌های POST، PUT و گاهی PATCH معمولاً باید داده‌ای هم همراه درخواست فرستاده شود.

برای مثال، هنگام ایجاد کاربر جدید:

{
  "name": "John Doe",
  "email": "john@example.com"
}

یا هنگام ویرایش اطلاعات یک کاربر:

{
  "name": "John Smith"
}

در این حالت، سرور هم باید شناسه منبع را بداند و هم داده جدید را دریافت کند.

جمع‌بندی تفاوت متدها

برای مرور سریع، می‌توان متدهای اصلی را این‌طور خلاصه کرد:

GET     -> دریافت داده
POST    -> ایجاد داده جدید
PUT     -> ویرایش کامل داده موجود
PATCH   -> ویرایش بخشی از داده موجود
DELETE  -> حذف داده

ارتباط این مفاهیم با AJAX

زمانی که از AJAX یا Fetch API استفاده می‌کنید، در واقع همین درخواست‌های HTTP را از جاوااسکریپت ارسال می‌کنید.
تا اینجا بیشتر روی GET تمرکز داشتیم، اما در ادامه می‌توان برای ساخت برنامه‌های واقعی از متدهای دیگر هم استفاده کرد.

برای مثال:

  • با GET داده دریافت می‌کنید
  • با POST داده جدید ثبت می‌کنید
  • با PUT یا PATCH داده را ویرایش می‌کنید
  • با DELETE داده را حذف می‌کنید

به همین دلیل درک REST API یکی از پایه‌های مهم کار با جاوااسکریپت، AJAX و توسعه فرانت‌اند است.

جمع‌بندی

در این آموزش با مفهوم کلی API و REST API آشنا شدیم و دیدیم که چگونه متدهای مختلف HTTP برای مدیریت داده‌ها استفاده می‌شوند.

نکات مهم این بخش عبارت‌اند از:

  • API راهی برای ارتباط بین دو نرم‌افزار است.
  • Web APIها معمولاً از HTTP و JSON استفاده می‌کنند.
  • REST یک سبک معماری برای طراحی APIهای تحت وب است.
  • منابع در REST با متدهای HTTP مانند GET، POST، PUT و DELETE مدیریت می‌شوند.
  • Endpoint همان آدرس مشخصی است که برای انجام یک عملیات روی آن درخواست ارسال می‌شود.
  • ساختار APIها ممکن است متفاوت باشد، بنابراین مطالعه مستندات هر API ضروری است.

در بخش بعدی، می‌توان این مفاهیم را به‌صورت عملی‌تر دنبال کرد و کار با درخواست‌های مختلف را در قالب یک کتابخانه ساده برای AJAX پیاده‌سازی کرد.

// 0 comments
#REST API#جاوااسکریپت#آموزش REST API#آموزش AJAX#Web API#Fetch API#JavaScript#HTTP Requests#AJAX#API

نظرات (0)

نظر خود را بنویسید