Слияние кода завершено, страница обновится автоматически
Mocker API создаёт макеты для REST API. Это может быть полезно при тестировании приложения без реального сервера REST API.
Возможности:
🔥 Встроенная поддержка горячей замены файлов Mocker.
🚀 Быстрая и простая настройка API через JSON.
🌱 Простота проксирования фиктивного API.
💥 Может использоваться независимо, без использования webpack и webpack-dev-server.
mkdir mocker-app && cd mocker-app
# Создать файл конфигурации Mocker на основе правил
touch api.js
# Глобальная установка зависимостей.
npm install mocker-api -g
# Порт по умолчанию: 3721
mocker ./api.js
# Назначенный порт
# Запустить сервер на localhost:8000
mocker ./api.js --host localhost --port 8000
Вы можете добавить его в конфигурацию package.json как зависимость текущего проекта.
npm install mocker-api --save-dev
Mocker API поддерживает фиктивные данные для разработки, настроенные в mocker/index.js.
Можно изменить параметры http-proxy и добавить прослушиватели событий, добавив конфигурацию httpProxy.
const proxy = {
// Приоритетная обработка.
// apiMocker(app, path, option)
// Это параметр настройки для apiMocker
_proxy: {
proxy: {
// Преобразует строку пути, такую как `/user/:name`, в регулярное выражение.
// https://www.npmjs.com/package/path-to-regexp
'/repos/(.*)': 'https://api.github.com/',
'/:owner/:repo/raw/:ref/(.*)': 'http://127.0.0.1:2018',
'/api/repos/(.*)': 'http://127.0.0.1:3721/'
},
// Переписывает целевой URL-путь. Ключи объекта будут использоваться в качестве RegExp для сопоставления путей.
// https://github.com/jaywcjlove/mocker-api/issues/62
pathRewrite: {
'^/api/repos/': '/repos/',
},
changeHost: true,
// Изменить параметры http-прокси
httpProxy: {
options: {
ignorePath: true,
},
listeners: {
proxyReq: function (proxyReq, req, res, options) {
console.log('proxyReq');
},
},
},
},
// =====================
// GET-запрос по умолчанию.
// https://github.com/jaywcjlove/mocker-api/pull/63
'/api/user': {
id: 1,
username: 'kenny',
sex: 6
},
'GET /api/user': {
id: 1,
username: 'kenny',
sex: 6
},
'GET /api/user/list': [
{
id: 1,
username: 'kenny',
sex: 6
}, {
id: 2,
username: 'kenny',
sex: 6
}
],
'GET
``` **Перевод текста на русский язык:**
[webpack](https://github.com/webpack/webpack) и [webpack-dev-server](https://github.com/webpack/webpack-dev-server).
```bash
# Глобальная установка зависимостей.
npm install mocker-api -g
# Запуск сервера
mocker ./mocker/index.js
Или вы можете добавить это в package.json как зависимость текущего проекта.
{
"name": "base-example",
"scripts": {
+ "api": "mocker ./mocker"
},
"devDependencies": {
+ "mocker-api": "2.9.4"
},
+ "mocker": {
+ "port": 7788
+ },
"license": "MIT"
}
Пример Express, чтобы использовать api mocker в ваших проектах express.
⚠️ Не зависит от webpack и webpack-dev-server.
const express = require('express');
+ const path = require('path');
+ const apiMocker = require('mocker-api');
const app = express();
+ apiMocker(app, path.resolve('./mocker/index.js'))
app.listen(8080);
или
const express = require('express');
+ const apiMocker = require('mocker-api');
const app = express();
+ apiMocker(app, {
+ 'GET /api/user': {
+ id: 1,
+ sex: 0
+ }
+ });
app.listen(8080);
Пример webpack, чтобы использовать api mocker в ваших проектах Webpack. Просто добавьте настройки установки в настройки [webpack-dev-server]:
Измените файл конфигурации, чтобы сообщить серверу разработки, где искать файлы: webpack.config.js.
const HtmlWebpackPlugin = require('html-webpack-plugin');
+ const path = require('path');
+ const apiMocker = require('mocker-api');
module.exports = {
entry: {
app: './src/index.js',
},
output: {
filename: '[name].bundle.js',
path: path.resolve(__dirname, 'dist')
},
+ devServer: {
+ ...
+ before(app){
+ apiMocker(app, path.resolve('./mocker/index.js'), {
+ proxy: {
+ '/repos/(.*)': 'https://api.github.com/',
+ '/:owner/:repo/raw/:ref/(.*)': 'http://127.0.0.1:2018'
+ },
+ changeHost: true,
+ })
+ }
+ },
plugins: [
new HtmlWebpackPlugin({
template: path.resolve('./public/index.html'),
title: 'Webpack App Mocker API'
})
],
};
Должен быть файл с суффиксом! Например: ./mocker/index.js.
Давайте добавим скрипт для лёгкого запуска сервера разработки: package.json.
{
"name": "development",
"version": "1.0.0",
"description": "",
"main": "webpack.config.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
+ "start": "webpack serve --progress --mode development",
"build": "webpack --mode production"
},
"keywords": [],
"author": "",
"license": "MIT",
"devDependencies": {
"html-webpack-plugin": "4.5.0",
"mocker-api": "2.9.4",
"webpack": "5.22.0",
"webpack-cli": "4.5.0",
"webpack-dev-server": "3.11.2"
}
}
Проксирование фиктивного API стало проще.
{
before(app){
+ apiMocker(app, path.resolve('./mocker/index.js'), {
+ proxy: {
+ '/repos/(.*)': 'https://api.github.com/',
+ },
+ changeHost: true,
+ })
}
}
Пример create-react-app, чтобы использовать api mocker в вашем проекте [create-react-app]. Создайте src/setupProxy.js и поместите следующее содержимое в него:
+ const apiMocker = require('mocker-api');
+ const path = require('path');
module.exports = function(app) {
+ apiMocker(app,
``` ```
path.resolve('./mocker/index.js'), {
proxy: {
'/repos/(.*)': 'https://api.github.com/',
},
changeHost: true,
};
```;
```diff
{
.....
"devDependencies": {
"mocker-api": "2.9.4"
},
....
}
$ yarn install
$ yarn run build
$ yarn run watch
$ yarn run test
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Комментарии ( 0 )