كيفية بناء واجهة برمجة تطبيقات بسيطة مريحة مع NodeJs و ExpressJs و MongoDb

تم تحديثه في 11 تموز (يوليو) 2019: يعد الوصول إلى أكثر من 70،000 قارئ من المعالم الرئيسية لهذه المقالة ومن التعليقات ، فقد كان مفيدًا لكثير من الأشخاص الذين يحاولون أيديهم على إنشاء واجهات برمجة التطبيقات مع NodeJs. لتحسين ذلك ، قمت بتحديث مقتطفات الشفرة في هذا البرنامج التعليمي لإصلاح الأخطاء التي حددها معظم القراء. شكرا لكم جميعا على ردودكم الكريمة ، وآمل أن أجد الوقت قريبا لكتابة واحدة جيدة أخرى. اذهب وانشئ تطبيقات مذهلة للعالم - David Inyangetoh

RESTFul APIs كانت موجودة منذ وقت ما الآن. في وقت كتابة هذا التقرير ، من المستحيل عملياً أن تكون مطور برامج دون الحاجة إلى إنشاء واحد أو أكثر من واجهات برمجة التطبيقات واستخدامها.

API هي اختصار لواجهة برمجة التطبيقات التي أصبحت جزءًا لا يتجزأ من تطوير البرامج. "إنها مجموعة من وسائل الاتصال المحددة بوضوح بين المكونات المختلفة" - ويكيبيديا.

واجهات برمجة تطبيقات RESTFul ، من ناحية أخرى ، هي واجهات برمجة التطبيقات التي تتوافق مع النمط المعماري REST. يشير REST إلى "نقل الحالة التمثيلية" وهو "نمط معماري يحدد مجموعة من القيود والخصائص القائمة على HTTP".

يعد تطبيق JSON API هو التطبيق الأكثر شيوعًا لتطبيق RESTFul على الويب ، وهذا ما سنعمل معه في هذا البرنامج التعليمي. يمكنك معرفة المزيد حول مواصفات JSONAPI والأمثلة والتنفيذ هنا. JSON هو ببساطة Javascript Objectation.

في هذا البرنامج التعليمي ، نبني API بسيطة باستخدام ExpressJs و MongoDb مع وظائف CRUD لجهات الاتصال.

التطبيقات المطلوبة

  • NodeJS
  • ساعي البريد
  • MongoDb
  • IDE

هيا بنا نبدأ…

تمهيد المشروع

للتمهيد لمشروعنا ، نحتاج إلى التحقق من تثبيت NodeJs و NPM و MongoDb على الجهاز الخاص بنا. للقيام بذلك ، افتح المحطة الطرفية أو موجه الأوامر وتشغيل

العقدة -v

هذا يتحقق من تثبيت إصدار Nodejs. يركض

npm -v

للتحقق من تثبيت حزمة إدارة العقدة (npm). انظر الإخراج أدناه

الآن بعد أن تحققنا من تثبيت Node و NPM ، يمكننا متابعة إعداد مشروعنا. إذا لم يتم تثبيت Node على جهازك ، فعليك تنزيل إصدار متوافق مع نظام التشغيل الخاص بك هنا وتثبيته قبل المتابعة.

بعد ذلك ، نحتاج إلى التحقق من تثبيت MongoDb عن طريق التشغيل

مونجو - الإصدار

ما المخرجات ...

إذا لم يكن MongoDb مثبتًا على جهازك ، فيجب عليك التوجه إلى مركز تنزيل MongoDb وتنزيل وتثبيت الإصدار المتوافق مع نظام التشغيل الخاص بك قبل المتابعة.

تسمية مشروعنا

لقد حان الوقت الآن لإعطاء اسم لمشروعنا وسوف نسميه RESTHub. نحن بحاجة إلى العثور على موقع جيد في نظام الملفات لدينا لتخزين ملفات مشروعنا. أنا شخصياً ، منذ أن بدأت العمل باستخدام أدوات ولغات برمجة مختلفة ، اخترت الاحتفاظ بمشاريعي القائمة على العقدة في مشروع nodeprojects على محرك الأقراص المحلي. هذا هو المكان الذي سأقوم فيه بإنشاء دليل جديد لمشروع الدليل باستخدام الأوامر التالية

// انتقل إلى الدليل الجذر لمشاريع العقدة الخاصة بك
CD C: \ n مشاريع المشاريع
// إنشاء دليل لمشروعك الجديد RestHub
مكدير ريستوب
// انتقل إلى الدليل
ريشوب مؤتمر نزع السلاح

تهيئة مشروع NodeJs مع npm init اتبع المعالج لإعداد المشروع.

اقبل الاسم والنسخة الافتراضية ولكن غيّر الوصف كما هو موضح أعلاه. لا تنسَ تغيير اسم المؤلف إلى اسمك وقبول الترخيص الافتراضي لإنشاء package.json. لا تقلق بشأن بعض المدخلات إذا ارتكبت خطأً ، فسيكون الملف متاحًا في دليل جذر المشروع لتتمكن من تعديله متى شئت. يجب عليك شاشة مماثلة لهذا ...

في هذه المرحلة ، يجب عليك التحقق من أن لديك ملف package.json متاحًا لجذر المشروع الخاص بك عن طريق سرد الملفات إما باستخدام ls -l أو dir وفقًا لنظام التشغيل لديك.

الوقت لتثبيت اكسبرس وخادم الإعداد

نحتاج إلى تشغيل خادم ويب من أجل جعل نقطة نهاية واجهة برمجة التطبيقات الخاصة بنا في متناول المتصفح أو أداة مثل PostMan ، وسنستخدم ExpressJS لتحقيق ذلك. إذا لم تكن معتادًا على ExpressJS ، فانتقل إلى الموقع الرسمي لمعرفة المزيد ، وإلا فلنستمر. مع npm نقوم بتثبيت Express في مشروعنا باستخدام هذا الأمر

npm تثبيت صريح - حفظ

سوف يستغرق الأمر بعض الوقت لإكمال التثبيت اعتمادًا على سرعة الاتصال الخاصة بك ولكن في النهاية يتم تثبيت ملفات ExpressJs وتبعياتها على النحو التالي.

ما يكفي من كل هذه المنشآت والمعالجات وتكوينات. نحتاج أن نبدأ كتابة الكود الآن. عندما تفتح IDE المفضل لديك ، يكون لي هو Visual Studio Code.

استخدم IDE المفضل لديك لفتح دليل المشروع وإنشاء ملف index.js

يمكنك مشاهدة دليل واحد node_modules وملف حزمة واحدة. json. Package.json تخزين تكوين مشروع nodeJs بما في ذلك التبعيات. يمكنك أن ترى فقط Expressjs - v4.16.3 تثبيت تحت التبعيات. توجد حزم العقدة المثبتة في node_modules ولا ينبغي لنا تعديل أي شيء في هذا الدليل ، بل يجب أن نستبعد مع gitignore عندما ندفع إلى مستودع بعيد. في package.json ، حددنا index.js كنقطة دخول للتطبيق لدينا. نحن بحاجة إلى إنشاء هذا الملف الآن وإعداد خادم الويب الخاص بنا.

في IDE الخاص بك ، إنشاء ملف index.js وإضافة هذا الرمز ...

// FileName: index.js
// استيراد صريح
اسمح للتعبير عن = يتطلب ("التعبير")
// تهيئة التطبيق
اسمح للتطبيق = express () ؛
// منفذ خادم الإعداد
var port = process.env.PORT || 8080؛
// إرسال رسالة لعنوان URL الافتراضي
app.get ('/'، (req، res) => res.send ('Hello World with Express'))؛
// قم بتشغيل التطبيق للاستماع إلى المنفذ المحدد
app.listen (port ، function () {
     console.log ("Running RestHub on port" + port) ؛
})؛

قم بحفظ الملف وتشغيل فهرس العقدة على نافذة المحطة الطرفية. يجب عليك الحصول على هذا

توجه إلى http: // localhost: 8080 على متصفحك وسترى ...

يا هلا! خادمنا السريع قيد التشغيل الآن. لقد فعلنا ذلك ... نعم! ليس هناك ما هو جميل مثل جعلك تعمل بسلاسة إذا لم تحصل على نفس النتيجة التي حصلت عليها في النقطة ، فاذهب إليها مرة أخرى للتحقق مما إذا كنت قد فاتتك بعض النقاط أو فاصلة منقوطة.

حسنًا ، دعنا نبني تطبيقنا مهنيًا بعض الشيء. على الرغم من أنني سوف أتبع بعضًا من أفضل الممارسات أثناء قيامنا بتنفيذ ذلك ، إلا أنني سأبقيها بسيطة قدر الإمكان. إنه برنامج تعليمي للمبتدئين وتميل معظم البرامج التعليمية التي صادفتها في الماضي إلى تجميع كل شيء في ملف واحد لتنفيذ واجهات برمجة التطبيقات البسيطة مثل هذا. في العالم الواقعي ، لا يحدث هذا خصوصًا إذا اختار فريقك بنية مثل MVC.

سنقوم بضخ جزء بسيط من MVC في بنية التطبيق هذه للحفاظ على هشاشة ملفاتنا ومخاوفنا المنفصلة. نحتاج إلى ثلاثة ملفات أخرى مدرجة أدناه ...

  • مسارات api - يجب تحديد كل نقطة نهاية api في هذا الملف
  • تحكم - يعالج طلبات HTTP ويحدد نقاط النهاية المتاحة
  • نموذج - يدير طبقة قاعدة البيانات (الطلب والاستجابة)

قم بإنشاء ملف في جذر المشروع api-ways.js وأضف الكود التالي إليه.

// اسم الملف: api-ways.js
// تهيئة جهاز التوجيه السريع
دع جهاز التوجيه = يتطلب ("التعبير").
// تعيين استجابة API الافتراضية
router.get ('/' ، وظيفة (مسا ، دقة) {
    res.json ({
        الحالة: "API Its Working" ،
        الرسالة: "مرحبًا بكم في RESTHub المصنوع من الحب!"
    })؛
})؛
// مسارات تصدير API
module.exports = router؛

نقوم أولاً باستيراد جهاز التوجيه السريع ، وتعيين المسار الافتراضي وتصدير الوحدة النمطية حتى نتمكن من الاستيراد في تطبيقنا. لإتاحة الوصول إلى هذا الطريق ، نحتاج إلى تعديل index.js وإضافة أسطر قليلة من التعليمات البرمجية إليه على هذا النحو.

/ / أضف الكود أدناه إلى index.js
// طرق الاستيراد
دع apiRoutes = تتطلب ("./ api-طرق")
// استخدم طرق Api في التطبيق
app.use ('/ api' ، apiRoutes)

ثم أعد تشغيل خادم التطبيق عن طريق إنهاء العملية على الجهاز الطرفي باستخدام ctrl + c أو cmd + c وابدأ مرة أخرى بفهرس العقدة.

في الكود أعلاه ، قمنا باستيراد ملف api-route ونطلب من تطبيقنا استخدام هذه المسارات كلما زار المستخدم example.com/api أو http: // localhost: 8080 / api في حالتنا. اختبار ما إذا كان يعمل من خلال زيارة http: // localhost: 8080 / api ، يجب أن تشاهد هذه الشاشة

بلى! انها عملت. يمكنك أخذ قسط من الراحة وشرب زجاجة ماء كما فعلت للتو. نحن نحرز تقدماً جيداً ولكننا بحاجة إلى إصلاح عنق الزجاجة قليلاً لجعل تقدمنا ​​أكثر سلاسة.

يتطلب إعدادنا الحالي إعادة تشغيل الخادم في كل مرة نقوم فيها بإجراء تغييرات على ملفاتنا أو إضافة ملفات جديدة. هذا يمكن أن يصبح مرهقًا ومحبًا في بعض الأحيان ولكن يوجد حل سريع له. هناك وحدة نمطية العقدة التي توفر هذا الإصلاح السريع. يشاهد ملفاتك ويعيد تشغيل خادم اكسبريس عند وجود تغييرات. من الأفضل تثبيت هذه الوحدة على مستوى العالم حيث قد تحتاجها في مشاريع أخرى مثل ذلك.

تثبيت npm-n nodemon
// على ماك أو لينكس
sudo npm تثبيت -g nodemon

الآن وبعد تثبيت nodemon ، ابدأ تشغيل التطبيق باستخدام فهرس nodemon بدلاً من ذلك وقم بتغيير النص في المسار الافتراضي من Hello World مع Express و Nodemon وقم بتحديث المستعرض الخاص بك لعرض التغييرات.

رائع ، لا داعي للقلق بشأن إعادة تشغيل خادم التطبيق لدينا مرة أخرى عندما نجري تغييرات.

إعداد MongoDb

أريد أن أفترض أنك قمت بتثبيت MongoDb على جهازك بخلاف ذلك ، قم بزيارة مركز تحميل Mongodb للتنزيل والتثبيت. افتح نافذة طرفية أخرى وابدأ تشغيل mongodb-server بهذا الأمر

mongod

سوف تحصل على ناتج مماثل لهذا

الحفاظ على هذه النافذة مفتوحة من أجل استخدام MongoDb. توجه إلى محطة جذر المشروع وقم بتثبيت هذه الحزم

  • npm تثبيت النمس - حفظ
  • محلل للجسم npm - تثبيت محلل للجسم - حفظ

النمس هي حزمة Nodejs لنمذجة Mongodb. أنها تساعدك على التعامل مع التحقق من الصحة ومنطق العمل ل mongodb على Nodejs. يمكنك معرفة المزيد هنا.

يمكّن محلل Body التطبيق الخاص بك من تحليل البيانات من طلب وارد مثل بيانات النموذج عبر urlencode. نحن بحاجة إلى استيراد هذا إلى التطبيق لدينا واستخدامها.

تعديل index.js مع هذه الخطوط
تحديث: لقد قمت بتحديث خط اتصال Mongoose لإضافة خيار useNewUrlParser وإصلاح تحذير الإهمال

// استيراد محلل الجسم
دع bodyParser = require ('محلل للجسم') ؛
// استيراد النمس
دع النمس = يطلب ('النمس') ؛
// تكوين bodyparser للتعامل مع طلبات النشر
app.use (bodyParser.urlencoded ({
   الموسعة: صحيح
}))؛
app.use (bodyParser.json ())؛
// الاتصال بـ Mongoose وتعيين متغير الاتصال
// مهملة: mongoose.connect ('mongodb: // localhost / resthub') ؛
mongoose.connect ('mongodb: // localhost / resthub'، {useNewUrlParser: true})؛
var db = mongoose.connection؛

يجب أن تبدو index.js كاملة بهذا الشكل

// استيراد صريح
اسمح للتعبير = "تتطلب" "التعبير") ؛
// استيراد محلل الجسم
دع bodyParser = require ('محلل للجسم') ؛
// استيراد النمس
دع النمس = يطلب ('النمس') ؛
// بدء التطبيق
اسمح للتطبيق = express () ؛

// طرق الاستيراد
دع apiRoutes = تتطلب ("./ api-طرق") ؛
// تكوين bodyparser للتعامل مع طلبات النشر
app.use (bodyParser.urlencoded ({
    الموسعة: صحيح
}))؛
app.use (bodyParser.json ())؛
// الاتصال بـ Mongoose وتعيين متغير الاتصال
mongoose.connect ('mongodb: // localhost / resthub'، {useNewUrlParser: true})؛
var db = mongoose.connection؛

// أضيفت التحقق من اتصال DB
إذا (! ديسيبل)
    console.log ("خطأ في الاتصال db")
آخر
    console.log ("تم توصيل Db بنجاح")

// منفذ خادم الإعداد
var port = process.env.PORT || 8080؛

// إرسال رسالة لعنوان URL الافتراضي
app.get ('/'، (req، res) => res.send ('Hello World with Express'))؛

// استخدم طرق Api في التطبيق
app.use ('/ api' ، apiRoutes) ؛
// قم بتشغيل التطبيق للاستماع إلى المنفذ المحدد
app.listen (port ، function () {
    console.log ("Running RestHub on port" + port) ؛
})؛

كل شيء يجب أن تعمل بشكل جيد. لقد حان الوقت لإعداد وحدة التحكم الخاصة بنا للتعامل مع طلب API والطراز لحفظ / استرداد البيانات من قاعدة البيانات. سننفذ نموذج بيانات بسيط يقوم بتخزين معلومات اتصال المخازن مع التفاصيل التالية:

  • اسم
  • البريد الإلكتروني
  • هاتف
  • جنس

سننفذ نقاط النهاية التالية

  • الحصول على / api / جهات الاتصال قائمة جميع الاتصالات
  • POST / api / جهات الاتصال إنشاء جهة اتصال جديدة
  • الحصول على / api / contacts / {id} استرداد جهة اتصال واحدة
  • PUT / api / contacts / {id} تحديث جهة اتصال واحدة
  • حذف / api / contacts / {id} حذف جهة اتصال واحدة

سننتقل إلى اثنين (2) من الملفات الأخرى contactController.js و contactModel.js ولصق هذه الرموز.

// contactController.js
// استيراد نموذج الاتصال
جهة الاتصال = تتطلب ('./ contactModel') ؛
// التعامل مع الإجراءات الفهرس
export.index = function (req، res) {
    Contact.get (وظيفة (يخطئ ، جهات الاتصال) {
        إذا (يخطئ) {
            res.json ({
                الحالة: "خطأ" ،
                الرسالة: يخطئ ،
            })؛
        }
        res.json ({
            الحالة: "النجاح" ،
            الرسالة: "تم استرداد جهات الاتصال بنجاح" ،
            البيانات: الاتصالات
        })؛
    })؛
}؛
/ / التعامل مع إنشاء إجراءات الاتصال
export.new = function (req، res) {
    var contact = جهة اتصال جديدة () ؛
    contact.name = req.body.name؟ req.body.name: contact.name؛
    contact.gender = req.body.gender؛
    contact.email = req.body.email؛
    contact.phone = req.body.phone؛
// احفظ جهة الاتصال وتحقق من الأخطاء
    contact.save (وظيفة (يخطئ) {
        // if (يخطئ)
        // res.json (err)؛
res.json ({
            الرسالة: "تم إنشاء جهة اتصال جديدة!" ،
            البيانات: الاتصال
        })؛
    })؛
}؛
// التعامل مع عرض معلومات الاتصال
export.view = function (req، res) {
    Contact.findById (req.params.contact_id ، الوظيفة (err ، جهة الاتصال) {
        إذا (يخطئ)
            res.send (يخطئ)؛
        res.json ({
            الرسالة: "تفاصيل الاتصال loading .." ،
            البيانات: الاتصال
        })؛
    })؛
}؛
// التعامل مع معلومات الاتصال التحديث
export.update = function (req، res) {
Contact.findById (req.params.contact_id ، الوظيفة (err ، جهة الاتصال) {
        إذا (يخطئ)
            res.send (يخطئ)؛
contact.name = req.body.name؟ req.body.name: contact.name؛
        contact.gender = req.body.gender؛
        contact.email = req.body.email؛
        contact.phone = req.body.phone؛
// احفظ جهة الاتصال وتحقق من الأخطاء
        contact.save (وظيفة (يخطئ) {
            إذا (يخطئ)
                res.json (يخطئ)؛
            res.json ({
                الرسالة: "تم تحديث معلومات الاتصال" ،
                البيانات: الاتصال
            })؛
        })؛
    })؛
}؛
// التعامل مع حذف الاتصال
export.delete = function (req، res) {
    Contact.remove ({
        _id: req.params.contact_id
    } ، الوظيفة (يخطئ ، الاتصال) {
        إذا (يخطئ)
            res.send (يخطئ)؛
res.json ({
            الحالة: "النجاح" ،
            الرسالة: "تم حذف الاتصال"
        })؛
    })؛
}؛

حددت وحدة التحكم الطريقة التي تعالج الطلب والاستجابة من نقاط نهاية API مختلفة. بادئ ذي بدء ، نستورد contactModel ونستخدم مثيله للتعامل مع وظائف CRUD (إنشاء واسترجاع وتحديث وحذف) لواجهة برمجة التطبيقات. هنا هو رمز contactModel.js

// contactModel.js
var mongoose = require ('mongoose') ؛
// مخطط الإعداد
var contactSchema = mongoose.Schema ({
    اسم: {
        نوع: سلسلة ،
        مطلوب: صحيح
    }،
    البريد الإلكتروني: {
        نوع: سلسلة ،
        مطلوب: صحيح
    }،
    الجنس: سلسلة ،
    الهاتف: سلسلة ،
    create_date: {
        النوع: التاريخ ،
        الافتراضي: Date.now
    }
})؛
// تصدير نموذج الاتصال
var Contact = module.exports = mongoose.model ('contact'، contactSchema)؛
module.exports.get = function (رد الاتصال ، الحد) {
    Contact.find (رد). يمكن قصر (الحد)؛
}

في النموذج ، نقوم باستيراد mongoose ، وقمنا بإنشاء مخطط قاعدة بيانات جهات الاتصال وقمنا بتصدير الوحدة النمطية لجعلها قابلة للوصول. سيضيف التحديث الأخير طرق الاتصال إلى نقاط النهاية الخاصة بنا. هنا هو رمز كامل ل api-ways.js

// api-ways.js
// تهيئة جهاز التوجيه السريع
دع جهاز التوجيه = يتطلب ("التعبير").
// تعيين استجابة API الافتراضية
router.get ('/' ، وظيفة (مسا ، دقة) {
    res.json ({
        الحالة: "API Its Working" ،
        الرسالة: "مرحبًا بكم في RESTHub المصنوع من الحب!" ،
    })؛
})؛
// استيراد تحكم الاتصال
var contactController = require ('./ contactController') ؛
// طرق الاتصال
router.route ( '/ اتصالات')
    . احصل على (contactController.index)
    .post (contactController.new)؛
router.route ( '/ اتصالات /: contact_id')
    . احصل على (contactController.view)
    .patch (contactController.update)
    . وضع (contactController.update)
    .delete (contactController.delete)؛
// مسارات تصدير API
module.exports = router؛

نجاح باهر! لقد كانت رحلة طويلة حقا. لقد انتهينا من الطهي وقد حان الوقت لاختبار نقاط النهاية الخاصة بنا.

دعنا نحاول مع المتصفح. تفضل بزيارة http: // localhost: 8080 / api / جهات الاتصال التي يجب أن تحصل على هذه الشاشة

تبدو جيدا. ليس لدينا أي جهات اتصال بعد في مجموعتنا. نحتاج إلى إضافة بعض جهات الاتصال إليه. يعد Postman أداة جيدة جدًا لاختبار نقطة نهاية واجهة برمجة التطبيقات لتصحيح الأخطاء وتصحيحها ، إذا كان لديك واحدة مثبتة على جهازك ، فاحصل عليها هنا. يبدو ...

لقد اختبرت للتو / api / جهات الاتصال على ساعي البريد وحصلت على نفس الناتج.

كما يدعم قائمة طويلة من أنواع الطلبات بما في ذلك HTTP GET الأساسي ، POST ، PUT ، DELETE.

لإضافة جهة اتصال جديدة ، قم بتغيير الطريقة من القائمة المنسدلة إلى POST ، وحدد علامة تبويب النص الأساسي ، وقدم قيمًا للمفتاح: مربعات إدخال القيمة ضمن علامة تبويب النص ، ثم انقر فوق إرسال عند الانتهاء. انظر المثال أدناه:

تغيير القيم لإنشاء جهة اتصال أخرى. افتح علامة تبويب أخرى واستخدم طلب GET لعرض جميع جهات الاتصال على هذا النحو.

قم بتحديث المتصفح الخاص بك لمعرفة ما إذا كان قد تم تحديثه. يجب أن تحصل على هذه الشاشة.

حسنا الرجال ، لقد وصلنا إلى نهاية جلستنا الطويلة. المضي قدما ومحاولة الخروج وحذف. حاول أن تبني شيئًا رائعًا وأنشر الإنجيل. يمكنك اللحاق بي على Twitter و facebook و github و ينكدين عبر @ dinyangetoh

أوه ، لقد نسيت تقريبا إضافة رابط جيثب للملفات المصدر. لا تتردد في استنساخها هنا واستمتع ببناء تطبيقات مذهلة.

الروابط المحدثة:

Heroku التطبيق: https://resthub2.herokuapp.com

جيثب: https://github.com/dinyangetoh/resthub2