Чаще всего, когда вы создаете интерфейсное приложение с такими библиотеками, как 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.