Чаще всего, когда вы создаете интерфейсное приложение с такими библиотеками, как React, Vue или Angular и т. Д., Вам нужно будет работать с внутренним API, который может быть не готов к тому времени, поэтому вам придется создавать фиктивный API, разработка которого может занять много времени. А вот _1 _ - простой сервер Node.js, который позволяет вам создавать полностью работающие REST API за считанные минуты без хлопот по установке и настройке системы баз данных, и вы даже можете добавить JWT-аутентификацию на свои конечные точки, используя jsonwebtoken
, добавив несколько строк кода.
В этом руководстве мы узнаем на примерах, как быстро создать REST API и добавить аутентификацию JWT. Мы также увидим, как использовать faker.js
для быстрого создания поддельных данных для нашего API.
Требования
Прежде чем вы сможете использовать json-server
, вам понадобится машина для разработки с установленными Node.js и NPM. При желании вам необходимо установить cURL или Postman, чтобы вы могли протестировать свой API.
Вы можете установить Node.js и NPM с официального сайта.
Установка json-сервера
Перейдите к своему терминалу и выполните следующую команду:
npm install -g json-server
В зависимости от конфигурации npm вам может потребоваться добавить sudo
перед командой install
, чтобы иметь возможность устанавливать пакеты глобально.
Вы также можете установить json-server
локально, сгенерировав новый модуль Node.js, используя:
mkdir myproject cd myproject npm init
Введите необходимые данные и нажмите OK, чтобы создать новый package.json
файл в вашей текущей папке.
Затем вы можете установить json-сервер локально:
npm install json-sever --save
Создание конечных точек API
Чтобы создать конечную точку (и) API, вам нужно всего лишь создать файл JSON с вашими данными. Например, давайте создадим API с /products
конечной точкой.
Создайте файл с именем db.json
и добавьте следующее содержимое:
{ "products": [ { "id": 1, "name": "Product001", "cost": 10.0, "quantity": 1000 }, { "id": 2, "name": "Product002", "cost": 20.0, "quantity": 2000 { "id": 3, "name": "Product003", "cost": 30.0, "quantity": 3000 }, { "id": 4, "name": "Product004", "cost": 40.0, "quantity": 4000 ] }
Этот файл действует как база данных для вашего API.
Теперь запустите json-server
с помощью:
json-server --watch db.json
Это все, что вам нужно для создания API на основе данных, добавленных в db.json
. Теперь вы можете создавать, читать, обновлять и удалять продукты с этого сервера с помощью расширенных функций, таких как разбивка на страницы, сортировка и фильтрация из коробки, которые вы можете ожидать от реального сервера API.
Пагинация данных
Вы можете запросить данные с разбивкой на страницы из конечной точки API, добавив параметр page в свою конечную точку. Например:
curl -X GET "http://localhost:3000/products?_page=1"
Это отправит запрос GET для чтения первой страницы.
Фильтрация данных
Вы также можете добавить фильтры для получения отфильтрованных данных, просто добавив фильтры к своей конечной точке. Например:
curl -X GET "http://localhost:3000/products?name=Product004&cost=30"
&
можно использовать для объединения нескольких фильтров.
Сортировка данных
Вы можете вернуть отсортированные данные с вашей конечной точки, используя параметры _sort
и _order
. Например:
curl -X GET "http://localhost:3000/products?_sort=name&order=DESC"
Вы можете найти больше возможностей, посетив документацию.
Создать фиктивные данные
Вы можете добавить данные в файл JSON вручную, что может быть утомительной задачей, или даже лучше использовать инструмент для автоматического создания поддельных данных для json-server
, что является более практичным подходом.
Мы собираемся использовать инструмент faker.js.
Перейдите к своему терминалу и начните с установки пакета из npm, используя:
Затем создайте файл JavaScript, вы можете называть его как хотите. Позвоните generateData.js
var faker = require('faker'); var database = { products: [] }; for (var i=1; i<=1000; i++) { database.products.push({ id: i, name: faker.random.words(), cost: Math.random()*100, quantity: Math.random()*1000 }); } console.log(JSON.stringify(database));
Мы используем цикл for для создания 1000 поддельных товаров с поддельными названиями, стоимостью и количеством.
Теперь все, что вам нужно сделать, это запустить этот сценарий и вывести данные в ваш db.json
файл, используя:
node generateData.js > db.json
Добавление аутентификации JWT
Json-server
предоставляет множество функций реального мира API, таких как разбиение на страницы, сортировка и т. Д. Но в реальных сценариях в большинстве случаев у вас также будет аутентификация JWT, которая не предоставляется json-server
из коробки, но вы можете легко научиться добавлять ее с помощью несколько строк кода. Итак, давайте посмотрим, как мы можем защитить наши поддельные конечные точки API с помощью пакета jsonwebtoken
.
Сначала начните с установки jsonwebtoken
npm install jsonwebtoken --save
Затем вам нужно создать server.js
файл внутри своей папки, а затем выполнить следующие действия:
Сначала вам потребуются модули, которые вам понадобятся, включая jsonwebtoken
и json-server
.
const fs = require('fs') const bodyParser = require('body-parser') const jsonServer = require('json-server') const jwt = require('jsonwebtoken')
Затем используйте метод create()
, чтобы вернуть экспресс-сервер
const server = jsonServer.create()
Вызовите метод router()
, чтобы вернуть маршрутизатор Express
const router = jsonServer.router('./db.json')
Теперь вам нужно прочитать и проанализировать JSON users.json
файл, который вам сначала нужно создать. Этот файл действует как таблица для зарегистрированных пользователей.
const userdb = JSON.parse(fs.readFileSync('./users.json', 'UTF-8'))
Обязательно создайте users.json
и добавьте несколько пользователей, а затем сохраните его:
{ "users": [ { "id": 1, "name": "bruno", "email": "[email protected]", "password": "bruno" }, { "id": 2, "name": "nilson", "email": "[email protected]", "password": "nilson" } ] }
Затем установите промежуточное ПО по умолчанию (регистратор, статическое, cors и без кеширования)
server.use(jsonServer.defaults());
Или вы также можете добавить свои собственные настройки
server.use(bodyParser.urlencoded({extended: true})) server.use(bodyParser.json())
Затем определите некоторые константы: SECRET_KEY используется для подписи полезных данных и expiresIn для установки времени истечения срока действия токенов доступа JWT.
const SECRET_KEY = '123456789' const expiresIn = '1h'
Добавьте следующие функции:
// Create a token from a payload function createToken(payload){ return jwt.sign(payload, SECRET_KEY, {expiresIn}) } // Verify the token function verifyToken(token){ return jwt.verify(token, SECRET_KEY, (err, decode) => decode !== undefined ? decode : err) } // Check if the user exists in database function isAuthenticated({email, password}){ return userdb.users.findIndex(user => user.email === email && user.password === password) !== -1 }
Теперь вам нужно создать конечную точку POST /auth/login
, которая проверяет, существует ли пользователь в базе данных, а затем создать и отправить пользователю токен JWT:
server.post('/auth/login', (req, res) => { const {email, password} = req.body if (isAuthenticated({email, password}) === false) { const status = 401 const message = 'Incorrect email or password' res.status(status).json({status, message}) return } const access_token = createToken({email, password}) res.status(200).json({access_token}) })
Затем добавьте промежуточное ПО Express, которое проверяет, имеет ли заголовок авторизации схему Bearer, а затем проверяет, действителен ли токен для всех маршрутов, кроме предыдущего маршрута, поскольку это тот, который мы используем для входа в систему пользователей.
server.use(/^(?!\/auth).*$/, (req, res, next) => { if (req.headers.authorization === undefined || req.headers.authorization.split(' ')[0] !== 'Bearer') { const status = 401 const message = 'Bad authorization header' res.status(status).json({status, message}) return } try { verifyToken(req.headers.authorization.split(' ')[1]) next() } catch (err) { const status = 401 const message = 'Error: access_token is not valid' res.status(status).json({status, message}) } })
Наконец смонтируйте json-server
, затем запустите сервер на порту 3000, используя:
server.use(router) server.listen(3000, () => { console.log('Run Auth API Server') })
Вы также можете подключить json-server
к определенной конечной точке (/api
), используя:
server.use('/api', router;
Вот и все, теперь у вас есть защищенный API. Давайте добавим два сценария npm для запуска сервера.
Откройте ваш package.json
файл, затем добавьте эти два скрипта
"scripts": { "start": "json-server --watch ./db.json", "start-auth": "node server.js" },
Стартовый скрипт обычно запускает json-сервер без какой-либо аутентификации.
Start-auth запускает наш server.js
скрипт
Теперь вернитесь к своему терминалу и запустите:
Вы можете найти исходный код этого примера в этом репозитории Github.
Заключение
Теперь вы готовы создать прототип своего интерфейсного веб-приложения, не беспокоясь об API или данных. Вы также можете добавить JWT-аутентификацию к своим макетам конечных точек API, чтобы имитировать больше реальных сценариев. Повеселись!
Первоначально опубликовано на www.techiediaries.com.