از طریق منوی جستجو مطلب مورد نظر خود در وبلاگ را به سرعت پیدا کنید
ساخت API REST با Node و ExpressREST API یک راه استاندارد صنعتی برای سرویس های وب برای ارسال و دریافت داده است. آنها از روش های درخواست HTTP برای تسهیل چرخه درخواست-پاسخ استفاده می کنند و معمولاً داده ها را با استفاده از JSON و به ندرت – HTML، XML و فرمت های دیگر انتقال می دهند. در این راهنما قصد داریم یک REST API بسازیم…
سرفصلهای مطلب
معرفی
REST APIها یک روش استاندارد صنعتی برای سرویس های وب برای ارسال و دریافت داده ها هستند. آنها از روش های درخواست HTTP برای تسهیل چرخه درخواست-پاسخ استفاده می کنند و معمولاً داده ها را با استفاده از JSON و به ندرت – HTML، XML و فرمت های دیگر انتقال می دهند.
در این راهنما، ما قصد داریم یک REST API برای مدیریت کتاب ها با Node.js و Express بسازیم.
برای سادگی، ما از پایگاه داده استفاده نخواهیم کرد، بنابراین نیازی به تجربه استفاده از آن ندارید. به جای آن از یک آرایه ساده جاوا اسکریپت برای ذخیره داده های خود استفاده خواهیم کرد.
REST API چیست؟
REST (انتقال دولتی نمایندگی) یک معماری استاندارد برای ساخت و برقراری ارتباط با خدمات وب است. به طور معمول منابع را الزامی می کند روی وب در قالب متنی (مانند JSON، HTML یا XML) نمایش داده می شود و می توان با مجموعه ای از عملیات از پیش تعیین شده به آن دسترسی پیدا کرد یا تغییر داد. با توجه به اینکه ما معمولاً APIهای REST را برای استفاده از HTTP به جای پروتکلهای دیگر میسازیم، این عملیات با روشهای HTTP مانند GET، POST یا PUT مطابقت دارد.
در مجموعهای از دادهها، مانند کتابها، به عنوان مثال، چند عمل وجود دارد که باید مرتباً انجام دهیم، که خلاصه میشود: ایجاد کردن، خواندن، به روز رسانی و حذف (همچنین به عنوان شناخته شده است عملکرد CRUD).
یک API (رابط برنامه نویسی کاربردی)همانطور که از نام آن پیداست، رابطی است که تعامل بین اجزای مختلف نرم افزار را تعریف می کند. APIهای وب تعیین میکنند که چه درخواستهایی را میتوان به یک مؤلفه (به عنوان مثال، نقطه پایانی برای دریافت فهرستی از کتابها)، روش ایجاد آنها (مثلاً درخواست GET) و پاسخهای مورد انتظار آنها را تعریف کرد.
اکسپرس چیست؟
ExpressJS یکی از محبوب ترین کتابخانه های سرور HTTP برای Node.js است که به طور پیش فرض برای توسعه API چندان مناسب نیست. با استفاده از Express، توسعه API را با انتزاع کردن صفحه دیگ مورد نیاز برای راه اندازی یک سرور ساده می کنیم، که توسعه را سریعتر، خواناتر و ساده تر می کند. میتوانید یک API نمونه را در چند ثانیه و چند خط کد بچرخانید.
اگرچه استفاده اولیه آن ساده کردن چیزها با پیش فرض های معقول بود، اما با استفاده از توابعی به نام بسیار قابل تنظیم است. “میان افزار”.
توجه داشته باشید: اکسپرس بسیار سبک وزن است و ساخته شده است روی بالا میان افزار با استفاده از میانافزار، میتوانید عملکرد آن را فراتر از توابع موجود بهطور پیشفرض گسترش داده و گسترش دهید.
حتی اگر در این راهنما فقط یک REST API بسازیم، چارچوب ExpressJS فقط به این محدود نمی شود – میزبانی فایل های ثابت، انجام رندر سمت سرور، یا حتی استفاده از آن به عنوان یک سرور پراکسی غیر معمول نیست و محدودیت با میان افزار اضافی.
انواع درخواست HTTP
چند نوع روش HTTP وجود دارد که قبل از ساختن REST API باید آنها را درک کنیم. اینها روشهایی هستند که با وظایف CRUD مطابقت دارند:
POST
: برای ارسال داده استفاده می شود، معمولاً استفاده می شود ایجاد کردن موجودیت های جدید یا ویرایش موجودیت های موجود.GET
: برای درخواست داده از سرور استفاده می شود که معمولاً استفاده می شود خواندن داده ها.PUT
: برای جایگزینی کامل منبع با منبع ارسالی استفاده می شود که معمولاً استفاده می شود به روز رسانی داده ها.DELETE
: عادت داشتن حذف موجودیتی از سرور
توجه داشته باشید: توجه داشته باشید که می توانید از هر دو استفاده کنید POST
یا PUT
برای ویرایش داده های ذخیره شده شما مختار هستید که انتخاب کنید که آیا می خواهید از آن استفاده کنید یا خیر PUT
زیرا می توان آن را به طور کامل حذف کرد. با این حال، با افعال HTTP که استفاده می کنید سازگار باشید. اگر استفاده می کنید POST
برای ایجاد و به روز رسانی، پس از آن استفاده نکنید PUT
روش اصلا
چیزی که قرار است بسازیم
بیایید یک برنامه ساده برای ذخیره اطلاعات درباره کتاب ها ایجاد کنیم. در این برنامه اطلاعاتی درباره ISBN کتاب، عنوان، نویسنده، تاریخ انتشار، ناشر و تعداد صفحات ذخیره می کنیم.
به طور طبیعی، عملکرد اصلی API عملکرد CRUD خواهد بود. ما می خواهیم بتوانیم درخواست هایی برای ایجاد، خواندن، به روز رسانی و حذف به آن ارسال کنیم Book
موجودیت ها. البته، یک API ممکن است خیلی بیشتر از این انجام دهد – یک نقطه پایانی برای دریافت داده های آماری، خلاصه، فراخوانی API های دیگر و غیره به کاربران ارائه دهد.
عملکردهای غیر CRUD وابسته به برنامه و مبتنی هستند روی ماهیت پروژه شما، احتمالاً نقاط پایانی دیگری خواهید داشت. با این حال، عملا هیچ پروژه ای بدون CRUD نمی تواند پیش برود.
برای جلوگیری از ایجاد داده های کتاب – بیایید از a استفاده کنیم مجموعه داده از GitHub برای دریافت جزئیات نمونه درباره کتاب ها.
راه اندازی پروژه
ابتدا، اجازه دهید یک پروژه Node.js جدید را مقداردهی کنیم:
$ npm init
اطلاعات درخواستی را مطابق با نیاز خود پر کنید – لازم نیست همه فیلدها را پر کنید، اما آنها راهی آسان برای تنظیم داده های قابل شناسایی برای یک پروژه هستند. زمینه هایی مانند name
برای انتشار برنامه های کاربردی بسیار مرتبط تر هستند Node Package Manager، در میان سایر زمینه ها
همچنین، میتوانید با افزودن عبارت، از تنظیمات پیشفرض استفاده کنید -y
پرچم به تماس:
$ npm init -y
در هر صورت – در نهایت با یک پروژه با a package.json
فایل. این یک است json
فایلی که شامل تمام موارد مربوطه است ابرداده روی پروژه شما و به طور پیش فرض چیزی در امتداد این خطوط به نظر می رسد:
{
"name": "app",
"version": "1.0.0",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"keywords": (),
"description": ""
}
“ورود”/”اصلی” برنامه شما فایلی است که برای شروع صحیح پروژه اجرا می شود – معمولاً اسکریپت اصلی شما، و index.js
به صورت پیش فرض.
علاوه بر این، نسخه برنامه و “اسکریپت” شما اینجا هستند! شما می توانید هر تعداد دستور سفارشی را در آن ارائه کنید scripts
بخش، با یک دستور مرتبط با نام مستعار. اینجا test
نام مستعار یک لفاف برای یک است echo
بیانیه.
شما می توانید آزمایش برنامه را از طریق زیر اجرا کنید:
$ npm test
> (email protected) test /Users/david/Desktop/app
> echo "Error: no test specified" && exit 1
Error: no test specified
اغلب اوقات، یک وجود دارد start
نام مستعار که یک یا چند فرآیندی را که باید اجرا شوند زمانی که میخواهیم یک برنامه را راهاندازی کنیم، ماسک میکند. در شکل اصلی – ما فقط شاخص را اجرا می کنیم page با node:
{
"name": "app",
"version": "1.0.0",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node index.js"
},
"author": "",
"license": "ISC",
"keywords": (),
"description": ""
}
شما می توانید هر تعداد فرمان را در کنار آن قرار دهید node index.js
به عنوان start
اسکریپت و زمانی که اجرا می کنید npm start
– همه می دوند:
$ test npm start
> (email protected) start /Users/david/Desktop/app
> node index.js
توجه داشته باشید: از آنجایی که ما فقط یک دستور در اسکریپت شروع داریم، از نظر عملکردی معادل فقط فراخوانی است $ node index.js
در خط فرمان برای شروع برنامه
اکنون که با پروژه آشنا شدید، بیایید Express را نصب کنیم!
$ npm install --save express
یک فایل جدید در دایرکتوری در کنار a ایجاد می شود node_modules
فهرست راهنما. را package-lock.json
فایل وابستگی های شما را ردیابی می کند و شامل نسخه ها و نام های آنهاست:
{
"name": "app",
"version": "1.0.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
"accepts": {
"version": "1.3.7",
"resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.7.tgz",
"integrity": "sha512-Il80Qs2WjYlJIBNzNkK6KYqlVMTbZLXgHx2oT0pU/fjRHyEp+PEfEPY0R3WCwAGVOtauxh1hOxNgIf5bv7dQpA==",
"requires": {
"mime-types": "~2.1.24",
"negotiator": "0.6.2"
}
},
...
را node_modules
دایرکتوری در واقع میزبان کد وابستگی ها است و می تواند خیلی سریع بزرگ شود. فقط با نصب Express، ما در حال حاضر تعداد زیادی ماژول نصب و ردیابی کرده ایم package-lock.json
فایل.
این ماژول ها، در واقع، کوچک هستند، بنابراین به هیچ وجه مشکلی نیست. با استفاده از package-lock.json
یک کلاینت دیگر می داند که کدام وابستگی ها را دانلود کند و از کدام نسخه ها استفاده کند تا بتواند به درستی برنامه شما را راه اندازی کند.
توجه داشته باشید: هنگام انجام کنترل نسخه با ابزارهایی مانند Git – این یک تمرین خوب در نظر گرفته می شود نه به کد منبع ماژول هایی را که در برنامه استفاده می کنید نسخه کنید. از نظر عملی – پیگیری و فشار نیاورید node_modules
به یک مخزن دیگران می توانند وابستگی ها را بر اساس دانلود کنند روی حیاتی package-lock.json
زمانی که برنامه را با آن اجرا می کنند به طور خودکار اتفاق می افتد npm
.
ایجاد یک نقطه پایانی ساده
اکنون، بیایید شروع به ساخت یک ساده کنیم “سلام دنیا” برنامه این یک نقطه پایانی ساده دارد که فقط پیامی را به عنوان پاسخ به درخواست ما برای دریافت خانه برمیگرداند page.
ابتدا یک فایل به نام ایجاد می کنیم hello-world.js
:
$ nano hello-world.js
سپس، اجازه دهید import چارچوب Express در آن:
const express = require('express');
در مرحله بعد، ما می خواهیم برنامه Express را نمونه سازی کنیم:
const app = express();
و پورت ما را تنظیم کنید:
const port = 3000;
زمانی که به برنامه میگوییم به درخواستها گوش دهد، پورت کمی بعد استفاده میشود. این سه خط دیگ بخار هستند – اما چیز عالی این است که تمام دیگ بخار وجود دارد!
اکنون، می توانیم یک ساده ایجاد کنیم GET
نقطه پایان درست زیر صفحه دیگ بخار. هنگامی که کاربر با یک درخواست GET به نقطه پایانی برخورد می کند، پیام “سلام جهان، از اکسپرس” برگردانده می شود (و در مرورگر ارائه می شود یا نمایش داده می شود روی را console).
ما می خواهیم آن را تنظیم کنیم روی خانه page، بنابراین URL برای نقطه پایانی است /
:
app.get('/', (req, res) => {
res.send('Hello World, from express');
});
در این مرحله، بیایید مشتریان خود را شروع کنیم:
app.listen(port, () => console.log(`Hello world app listening روی port ${port}!`))
بیایید برنامه را اجرا کنیم و از تنها نقطه پایانی که از طریق مرورگر خود داریم بازدید کنیم:
$ node hello-world.js
Hello world app listening روی port 3000!
این از نظر فنی یک API کار می کند! اگرچه، این نقطه پایانی واقعاً کار زیادی انجام نمی دهد. بیایید نگاهی به میانافزارهای رایج بیندازیم که برای کار بیشتر مفید هستند و نقاط پایانی مفیدتری ایجاد میکنند.
Express Middleware
همانطور که در بالا ذکر شد – ExpressJS یک سرور HTTP ساده است و با ویژگی های زیادی همراه نیست. Middleware تقریباً مانند برنامه های افزودنی برای سرور Express عمل می کند و عملکردهای اضافی را در “وسط” یک درخواست ارائه می دهد. بسیاری از برنامه های افزودنی شخص ثالث مانند مورگان برای قطع درختان، مالتر برای مدیریت بارگذاری فایل، به طور معمول استفاده می شود.
در حال حاضر، برای شروع، باید میان افزاری به نام نصب کنیم تجزیه کننده بدن، که به ما کمک می کند بدنه را از یک درخواست HTTP رمزگشایی کنیم:
$ npm install --save body-parser
بدنه درخواست را تجزیه میکند و به ما اجازه میدهد به آن واکنش نشان دهیم.
از آنجایی که ما API را از مکان های مختلف با زدن نقاط پایانی در مرورگر فراخوانی می کنیم. همچنین باید میان افزار CORS را نصب کنیم.
اگر هنوز با آن آشنا نیستید اشتراک منابع متقابل، فعلاً اشکالی ندارد. بیایید فقط میان افزار را نصب کرده و آن را پیکربندی کنیم:
$ npm install --save cors
ساخت REST API با Node و Express
افزودن کتاب
اکنون می توانیم ساخت اپلیکیشن خود را شروع کنیم. یک فایل جدید به نام ایجاد کنید book-api.js
:
const express = require('express')
const bodyParser = require('body-parser');
const cors = require('cors');
const app = express();
const port = 3000;
// Where we will keep books
let books = ();
app.use(cors());
// Configuring body parser middleware
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
app.post('/book', (req, res) => {
// We will be coding here
});
app.listen(port, () => console.log(`Hello world app listening روی port ${port}!`));
همانطور که می بینید، ما می توانیم پیکربندی کنیم body-parser
با وارد کردن و ارسال آن به app.use
روش، که آن را به عنوان میان افزار برای Express فعال می کند app
نمونه، مثال.
ما استفاده خواهیم کرد books
آرایه ای برای ذخیره مجموعه کتاب های ما، شبیه سازی پایگاه داده.
انواع مختلفی از انواع بدن درخواست HTTP وجود دارد. مثلا، application/x-www-form-urlencoded
نوع بدنه پیش فرض برای فرم ها است، در حالی که application/json
چیزی است که ما هنگام درخواست منبع با استفاده از jQuery یا یک سرویس گیرنده REST باطن استفاده می کنیم.
چه body-parser
میانافزاری که انجام خواهد داد، گرفتن بدنه HTTP، رمزگشایی اطلاعات و الحاق آن به req.body
. از آنجا، ما به راحتی می توانیم اطلاعات را از فرم – در مورد ما، اطلاعات یک کتاب – بازیابی کنیم.
درون app.post
روش بیایید کتاب را به آرایه کتاب اضافه کنیم:
app.post('/book', (req, res) => {
const book = req.body;
// Output the book to the console for debugging
console.log(book);
books.push(book);
res.send('Book is added to the database');
});
حالا بیایید یک فرم HTML ساده با فیلدهای: ISBN، عنوان، نویسنده، تاریخ انتشار، ناشر و تعداد صفحات در یک فایل جدید ایجاد کنیم. new-book.html
.
ما داده ها را با استفاده از این فرم HTML به API ارسال خواهیم کرد action
صفت:
<div class="container">
<hr>
<h1>Create New Book</h1>
<hr>
<form action="http://localhost:3000/book" method="POST">
<div class="form-group">
<label for="ISBN">ISBN</label>
<input class="form-control" name="isbn">
</div>
<div class="form-group">
<label for="Title">Title</label>
<input class="form-control" name="title">
</div>
<!--Other fields-->
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
اینجا، ما <form>
ویژگی تگ با نقطه پایانی ما و اطلاعاتی که با آن ارسال می کنیم مطابقت دارد submit
دکمه اطلاعاتی است که روش ما تجزیه می کند و به آرایه اضافه می کند. توجه داشته باشید که method
پارامتر است POST
، درست مانند API ما.
وقتی در را باز می کنید باید چنین چیزی را ببینید page:
با کلیک بر روی “ارسال”، ما با برنامه های خود استقبال می کنیم console.log(book)
بیانیه:
{ isbn: '9781593275846',
title: 'Eloquent JavaScript, Second Edition',
author: 'Marijn Haverbeke',
publish_date: '2014-12-14',
publisher: 'No Starch Press',
numOfPages: '472' }
توجه داشته باشید: لطفاً توجه داشته باشید که از آنجایی که ما از یک آرایه برای ذخیره داده ها استفاده می کنیم، آنها را در راه اندازی مجدد برنامه بعدی خود از دست خواهیم داد.
دریافت همه کتاب ها
حالا بیایید یک نقطه پایانی ایجاد کنیم تا همه کتاب ها را از API دریافت کنیم:
app.get('/books', (req, res) => {
res.json(books);
});
سرور را مجددا راه اندازی کنید. اگر سرور از قبل در حال اجرا است فشار دهید Ctrl + C
تا اول آن را متوقف کند چند کتاب اضافه کنید و باز کنید http://localhost:3000/books
در مرورگر شما باید یک پاسخ JSON با تمام کتابهایی که اضافه کردهاید ببینید.
حالا بیایید یک HTML ایجاد کنیم page برای نمایش این کتاب ها به صورت کاربر پسند.
این بار، ما دو فایل ایجاد می کنیم – book-list.html
که ما به عنوان یک الگو استفاده خواهیم کرد و a book-list.js
فایلی که منطق به روز رسانی/حذف کتاب ها و نمایش آنها را در خود نگه می دارد روی را page:
بیایید با الگو شروع کنیم:
<div class="container">
<hr>
<h1>List of books</h1>
<hr>
<div>
<div class="row" id="books">
</div>
</div>
</div>
<div id="editBookModal" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Edit Book</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form id="editForm" method="POST">
<div class="form-group">
<label for="ISBN">ISBN</label>
<input class="form-control" name="isbn" id="isbn">
</div>
<div class="form-group">
<label for="Title">Title</label>
<input class="form-control" name="title" id="title">
</div>
<!--Other fields-->
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
</div>
</div>
</div>
<!--Our JS file-->
<script src="book-list.js"></script>
با تکمیل الگو، میتوانیم منطق واقعی را برای بازیابی همه کتابها با استفاده از جاوا اسکریپت سمت مرورگر و REST API پیادهسازی کنیم:
const setEditModal = (isbn) => {
// We will implement this later
}
const deleteBook = (isbn) => {
// We will implement this later
}
const loadBooks = () => {
const xhttp = new XMLHttpRequest();
xhttp.open("GET", "http://localhost:3000/books", false);
xhttp.send();
const books = JSON.parse(xhttp.responseText);
for (let book of books) {
const x = `
<div class="col-4">
<div class="card">
<div class="card-body">
<h5 class="card-title">${book.title}</h5>
<h6 class="card-subtitle mb-2 text-muted">${book.isbn}</h6>
<div>Author: ${book.author}</div>
<div>Publisher: ${book.publisher}</div>
<div>Number Of Pages: ${book.numOfPages}</div>
<hr>
<button type="button" class="btn btn-danger">Delete</button>
<button types="button" class="btn btn-primary" data-toggle="modal"
data-target="#editBookModal" onClick="setEditModal(${book.isbn})">
Edit
</button>
</div>
</div>
</div>
`
document.getElementById('books').innerHTML = document.getElementById('books').innerHTML + x;
}
}
loadBooks();
در اسکریپت بالا، ما در حال ارسال a GET
درخواست به نقطه پایانی http://localhost:3000/books
برای بازیابی کتاب ها و سپس ایجاد یک کارت بوت استرپ برای هر کتاب برای نمایش آن. اگر همه چیز به درستی کار می کند باید چیزی شبیه به این را ببینید روی شما page:
احتمالا متوجه شده اید ویرایش کنید و ایجاد کردن دکمه ها و روش های مربوط به آنها در حال حاضر، اجازه دهید آنها را خالی بگذاریم و در حین حرکت آنها را اجرا کنیم.
بازیابی کتاب توسط شابک
اگر میخواهیم کتاب خاصی را به کاربر نمایش دهیم، به راهی برای بازیابی آن از پایگاه داده (یا آرایه، در مورد ما) نیاز داریم. این همیشه توسط یک کلید خاص برای آن موجودیت انجام می شود. در بیشتر موارد، هر موجودیت منحصر به فرد است id
که به ما کمک می کند آنها را شناسایی کنیم.
در مورد ما، هر کتاب دارای یک ISBN است که طبیعتاً منحصر به فرد است، بنابراین نیازی به دیگری نیست id
ارزش.
این معمولاً با تجزیه پارامتر URL برای an انجام می شود id
و جستجوی کتاب با مربوطه id
.
به عنوان مثال، اگر ISBN باشد 9781593275846
URL به نظر می رسد، http://localhost:3000/book/9781593275846
:
app.get('/book/:isbn', (req, res) => {
// Reading isbn from the URL
const isbn = req.params.isbn;
});
در اینجا، ما با URL های پارامتری آشنا می شویم. از آنجایی که شابک بستگی دارد روی در این کتاب، به طور بالقوه تعداد بی نهایت نقطه پایانی در اینجا وجود دارد. با اضافه کردن دو نقطه (:
) به مسیر، می توانیم متغیری را که به متغیر نگاشت شده تعریف کنیم isbn
. بنابراین، اگر یک کاربر بازدید کند localhost:3000/book/5
را isbn
پارامتر خواهد بود 5
.
اگر در سناریوی شما منطقی باشد، می توانید بیش از یک پارامتر را در URL خود بپذیرید. مثلا /image/:width/:height
، و سپس می توانید با استفاده از آن پارامترها را دریافت کنید req.params.width
و req.params.height
.
اکنون، با استفاده از نقطه پایانی خود، می توانیم یک کتاب واحد را بازیابی کنیم:
app.get('/book/:isbn', (req, res) => {
// Reading isbn from the URL
const isbn = req.params.isbn;
// Searching books for the isbn
for (let book of books) {
if (book.isbn === isbn) {
res.json(book);
return;
}
}
// Sending 404 when not found something is a good practice
res.status(404).send('Book not found');
});
دوباره سرور را راه اندازی مجدد کنید، یک کتاب جدید اضافه کنید و باز کنید localhost/3000/{your_isbn}
و برنامه اطلاعات کتاب را برمی گرداند.
حذف کتاب ها
هنگام حذف موجودیتها، ما معمولاً آنها را یکی یکی حذف میکنیم تا از دست دادن تصادفی بزرگ داده جلوگیری کنیم. برای حذف موارد، از HTTP استفاده می کنیم DELETE
روش و یک کتاب را با استفاده از شماره ISBN آن مشخص کنید، درست مانند روش بازیابی آن:
app.delete('/book/:isbn', (req, res) => {
// Reading isbn from the URL
const isbn = req.params.isbn;
// Remove item from the books array
books = books.filter(i => {
if (i.isbn !== isbn) {
return true;
}
return false;
});
res.send('Book is deleted');
});
ما در حال استفاده از app.delete
روش پذیرش DELETE
درخواست ها. از آرایه نیز استفاده کرده ایم filter
روش فیلتر کردن کتاب با ISBN مربوطه برای حذف آن از آرایه.
حالا بیایید آن را پیاده سازی کنیم deleteBook
روش در book-list.js
فایل:
const deleteBook = (isbn) => {
const xhttp = new XMLHttpRequest();
xhttp.open("DELETE", `http://localhost:3000/book/${isbn}`, false);
xhttp.send();
// Reloading the page
location.reload();
}
در این روش با فشار دادن دکمه درخواست حذف را ارسال می کنیم و دوباره آن را بارگذاری می کنیم page برای نمایش تغییرات
ویرایش کتاب ها
بسیار شبیه به حذف موجودیت ها، به روز رسانی آنها مستلزم ربودن یک مورد خاص است. روی ISBN و سپس یکی را ارسال کنید POST
یا PUT
تماس HTTP با اطلاعات جدید.
برگردیم به خودمان book-api.js
فایل:
app.post('/book/:isbn', (req, res) => {
// Reading isbn from the URL
const isbn = req.params.isbn;
const newBook = req.body;
// Remove item from the books array
for (let i = 0; i < books.length; i++) {
let book = books(i)
if (book.isbn === isbn) {
books(i) = newBook;
}
}
res.send('Book is edited');
});
با ارسال الف POST
درخواست، با هدف یک ISBN خاص، کتاب کافی با اطلاعات جدید به روز می شود.
از آنجایی که ما قبلا مدال ویرایش را ایجاد کرده ایم، می توانیم از آن استفاده کنیم setEditModal
روشی برای جمع آوری اطلاعات در مورد کتاب با کلیک روی دکمه “ویرایش”.
ما همچنین فرم را تنظیم خواهیم کرد action
پارامتر با URL کتاب کلیک شده برای ارسال درخواست:
const setEditModal = (isbn) => {
// Get information about the book using isbn
const xhttp = new XMLHttpRequest();
xhttp.open("GET", `http://localhost:3000/book/${isbn}`, false);
xhttp.send();
const book = JSON.parse(xhttp.responseText);
const {
title,
author,
publisher,
publish_date,
numOfPages
} = book;
// Filling information about the book in the form inside the modal
document.getElementById('isbn').value = isbn;
document.getElementById('title').value = title;
document.getElementById('author').value = author;
document.getElementById('publisher').value = publisher;
document.getElementById('publish_date').value = publish_date;
document.getElementById('numOfPages').value = numOfPages;
// Setting up the action url for the book
document.getElementById('editForm').action = `http://localhost:3000/book/${isbn}`;
}
برای بررسی اینکه آیا عملکرد بهروزرسانی کار میکند، کتابی را ویرایش کنید. فرم باید با اطلاعات موجود در مورد کتاب پر شود. چیزی را تغییر دهید و روی “ارسال” کلیک کنید و پس از آن باید پیام “کتاب ویرایش شده است” را مشاهده کنید.
نتیجه
ساختن یک REST API با استفاده از Node.js و Express به همین سادگی است. می توانید به مقام رسمی مراجعه کنید اسناد اکسپرس اگر علاقه مند هستید در مورد چارچوب بیشتر بدانید.
ضمنا کدی که گذاشتم فقط به خاطر آموزش هستش هیچ وقت نباید تو محیط تولیدی ازش استفاده کنید. هنگام نوشتن کد برای تولید، اطمینان حاصل کنید که داده ها را تأیید می کنید و بهترین روش ها را دنبال می کنید.
طبق معمول کد منبع این پروژه را می توانید پیدا کنید روی GitHub.
(برچسبها به ترجمه)# استراحت
منتشر شده در 1403-01-24 14:53:04