في عالم تطوير الويب، تعتبر إجراء طلبات API مهمة أساسية. سواء كنت تبني تطبيقًا للواجهة الأمامية، أو خدمة خلفية، أو تختبر API، فإن معرفة كيفية إجراء هذه الطلبات بكفاءة أمر بالغ الأهمية. اثنان من الأدوات الشائعة لهذا الغرض هما curl و JavaScript fetch. ستأخذك هذه الدليل عبر تفاصيل استخدام هذه الأدوات، مع تقديم أمثلة عملية ونصائح على طول الطريق.
قبل أن نبدأ، إذا كنت تبحث عن طريقة سهلة لاختبار واجهات برمجة التطبيقات الخاصة بك، أنصحك بشدة بتنزيل Apidog مجانًا. يبسط Apidog عملية اختبار API، مما يجعل العمل مع واجهات برمجة التطبيقات المعقدة سهلاً.
فهم طلبات API
ما هي واجهة برمجة التطبيقات (API)؟
واجهة برمجة التطبيقات (API) هي مجموعة من القواعد التي تسمح للكيانات البرمجية المختلفة بالتواصل مع بعضها البعض. تحدد واجهات برمجة التطبيقات الطرق وصيغ البيانات التي يمكن للتطبيقات استخدامها للتفاعل مع الخدمات الخارجية، أو قواعد البيانات، أو التطبيقات الأخرى.
لماذا تستخدم طلبات API؟
طلبات API أساسية لجلب البيانات من الخوادم، وتقديم البيانات ليتم معالجتها، والتفاعل مع خدمات الويب المختلفة. إنها العمود الفقري للتطبيقات الحديثة على الويب، مما يمكن من وظائف مثل مصادقة المستخدم، واسترجاع البيانات، والتكامل مع الأطراف الثالثة.
مقدمة في cURL
ما هو curl؟
cURL هي أداة سطر الأوامر تستخدم لنقل البيانات باستخدام عناوين URL. تدعم مجموعة واسعة من البروتوكولات، بما في ذلك HTTP، و HTTPS، و FTP، والعديد من البروتوكولات الأخرى. curl تستخدم على نطاق واسع لاختبار واجهات برمجة التطبيقات، وتنزيل الملفات، وأداء طلبات الويب.
تثبيت cURL
cURL مثبت مسبقًا على معظم أنظمة Unix، بما في ذلك macOS و Linux. بالنسبة لنظام Windows، يمكنك تنزيله من موقع curl الرسمي.
للتحقق مما إذا كانت cURL مثبتة على نظامك، افتح وحدة التحكم أو موجه الأوامر الخاص بك وقم بتشغيل:
curl --version
الاستخدام الأساسي لـ cURL
إجراء طلب GET بسيط
لإجراء طلب GET أساسي باستخدام cURL، يمكنك استخدام الأمر التالي:
curl https://api.example.com/data
هذا الأمر يجلب البيانات من عنوان URL المحدد.
إضافة رؤوس
في بعض الأحيان، تحتاج إلى إضافة رؤوس إلى طلبك. يمكن القيام بذلك باستخدام علامة -H:
curl -H "Authorization: Bearer YOUR_ACCESS_TOKEN" https://api.example.com/data
إجراء طلب POST
لإرسال بيانات إلى الخادم، يمكنك استخدام طريقة POST. ها هي كيفية القيام بذلك باستخدام curl:
curl -X POST -H "Content-Type: application/json" -d '{"key":"value"}' https://api.example.com/data
في هذا الأمر، -X POST تحدد طريقة الطلب، و -H تضيف رأس، و -d ترسل البيانات.
مقدمة في JavaScript fetch
ما هو JavaScript fetch؟
واجهة برمجة التطبيقات fetch هي واجهة حديثة تسمح لك بإجراء طلبات HTTP من المتصفح. إنها بديل أبسط وأكثر قوة لـ XMLHttpRequest وتستخدم على نطاق واسع في تطوير الواجهة الأمامية.
الاستخدام الأساسي لـ fetch
إجراء طلب GET بسيط
إليك كيفية إجراء طلب GET باستخدام fetch :
fetch('https://api.example.com/data')
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('خطأ:', error));
هذا الكود يجلب البيانات من عنوان URL المحدد و يسجلها في وحدة التحكم.
إضافة رؤوس
لإضافة رؤوس إلى طلب fetch الخاص بك، يمكنك استخدام الخيار headers:
fetch('https://api.example.com/data', {
headers: {
'Authorization': 'Bearer YOUR_ACCESS_TOKEN'
}
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('خطأ:', error));
إجراء طلب POST
لإرسال بيانات إلى الخادم باستخدام fetch، يمكنك استخدام طريقة POST:
fetch('https://api.example.com/data', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ key: 'value' })
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('خطأ:', error));
مقارنة بين cURL و JavaScript fetch
حالات الاستخدام
cURL مثالي لـ:
- مهام سطر الأوامر
- أتمتة السكريبتات
- اختبار APIs دون واجهة رسومية
JavaScript fetch مثالي لـ:
- تطبيقات الويب
- العمليات غير المتزامنة في المتصفح
- إطارات العمل الحديثة مثل React و Vue
الصيغة وقابلية الاستخدام
تستخدم cURL واجهة سطر الأوامر مع صيغة يمكن أن تصبح معقدة مع الخيارات المتقدمة. ومع ذلك، فهي قوية للغاية ومرنة.
JavaScript fetch، من ناحية أخرى، تقدم صيغة أكثر قابلية للقراءة تعتمد على الوعود، مما يسهل التعامل مع العمليات غير المتزامنة وإدارة الردود.
معالجة الأخطاء
تتم معالجة الأخطاء في cURL باستخدام رموز الخروج وتحليل الردود يدويًا. في JavaScript fetch، تكون معالجة الأخطاء أكثر وضوحًا مع كتل catch، مما يوفر طريقة أكثر بديهية للتعامل مع الاستثناءات.
أمثلة عملية
مثال 1: جلب بيانات المستخدم
استخدام cURL
curl https://jsonplaceholder.typicode.com/users
هذا الأمر يسترجع قائمة بالمستخدمين من واجهة برمجة التطبيقات التجريبية.
استخدام JavaScript fetch
fetch('https://jsonplaceholder.typicode.com/users')
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('خطأ:', error));
مثال 2: إرسال نموذج
استخدام cURL
curl -X POST -H "Content-Type: application/json" -d '{"name":"جون دو","email":"john.doe@example.com"}' https://jsonplaceholder.typicode.com/users
استخدام JavaScript fetch
fetch('https://jsonplaceholder.typicode.com/users', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ name: 'جون دو', email: 'john.doe@example.com' })
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('خطأ:', error));
استخدام Apidog لتبسيط طلبات API
إذا كنت ترغب في تسريع سير عمل واجهات برمجة التطبيقات الخاصة بك بشكل أكبر، فكر في استخدام Apidog. Apidog هي أداة قوية مصممة لجعل إدارة واجهات برمجة التطبيقات سهلة وفعالة. يوفر ميزات مثل توثيق API، والاختبار، والمراقبة في مكان واحد.
لماذا تستخدم Apidog؟
- واجهة سهلة الاستخدام: يوفر Apidog واجهة بديهية تجعل إدارة واجهات برمجة التطبيقات سهلة.
- ميزات شاملة: من إنشاء واختبار واجهات برمجة التطبيقات إلى مراقبة أدائها، يغطي Apidog جميع جوانب إدارة واجهات برمجة التطبيقات.
- مجاني للاستخدام: يمكنك تنزيل واستخدام Apidog مجانًا، مما يجعله متاحًا للمطورين من جميع المستويات.
ابدأ العمل مع APIs cURL عن طريق استيرادها إلى Apidog
يدعم Apidog المستخدمين الذين يرغبون في استيراد أوامر cURL إلى Apidog. في مشروع فارغ، انقر على زر + الأرجواني حول الجزء العلوي الأيسر من نافذة Apidog، واختر استيراد cURL.
انسخ والصق أمر cURL في المربع المعروض على شاشتك.
إذا نجحت، يجب أن تكون الآن قادرًا على عرض أمر cURL في شكل طلب API.
توليد كود JavaScript Fetch على الفور
يمكن لـ Apidog توليد الكود اللازم لجافا سكريبت لتطبيقك في غمضة عين.
أولاً، حدد زر </> توليد الكود على أي API أو طلب، واختر توليد كود العميل من القائمة المنسدلة.
بعد ذلك، اختر JavaScript، وابحث في قسم Fetch. يجب أن ترى الآن الكود المولد. كل ما عليك فعله هو نسخه ولصقه في بيئة تطويرك المدمجة (IDE) ومتابعة تطوير تطبيقك.
أفضل الممارسات لطلبات API
تأمين مفاتيح API
احتفظ دائمًا بمفاتيح API بأمان. تجنب إدخالها في الشيفرة المصدرية، خاصة في التطبيقات الخاصة بالواجهة الأمامية. استخدم متغيرات البيئة أو خزائن مؤمنة لإدارة مفاتيحك.
معالجة الأخطاء
تضمن معالجة الأخطاء المناسبة أن تطبيقك يمكنه التعامل بشكل جيد مع الفشل. تحقق دائمًا من رموز حالة الرد وتعامل مع الأخطاء بشكل مناسب.
تحسين الأداء
لتحسين الأداء، ضع في اعتبارك:
- تخزين الردود مؤقتًا
- تقليل عدد طلبات API
- استخدام صيغ بيانات فعالة (مثل JSON)
مواضيع متقدمة
استخدام cURL مع النصوص
يمكنك أتمتة أوامر cURL باستخدام النصوص البرمجية. هذا مفيد للمهام المتكررة، مثل جلب البيانات، أو المعالجة الجماعية، أو اختبار واجهات برمجة التطبيقات.
#!/bin/bash
API_URL="https://api.example.com/data"
API_KEY="your_api_key"
response=$(curl -H "Authorization: Bearer $API_KEY" $API_URL)
echo $response
استخدام fetch مع Async/Await
async و await تجعل طلبات fetch أكثر قراءة وقابلية للإدارة:
async function fetchData() {
try {
const response = await fetch('https://api.example.com/data');
const data = await response.json();
console.log(data);
} catch (error) {
console.error('خطأ:', error);
}
}
fetchData();
الخاتمة
في هذا الدليل، استعرضنا كيفية إجراء طلبات API باستخدام cURL و JavaScript fetch. كلا الأداتين لهما مزاياها وهما مناسبة لمهام مختلفة. تتفوق cURL في عمليات سطر الأوامر والبرمجة النصية، بينما fetch مثالي لتطبيقات الويب والعمليات غير المتزامنة.
تذكر، إذا كنت تريد تبسيط عملية اختبار واجهة برمجة التطبيقات الخاصة بك، فكر في تنزيل Apidog مجانًا. إنها أداة ممتازة تجعل العمل مع واجهات برمجة التطبيقات أسهل بكثير.