mocker-api为REST API创建模拟API

联合创作 · 2023-10-01 16:57

mocker-api 为 REST API 创建模拟 API。 当您尝试在没有实际 REST API 服务器的情况下测试应用程序时,它会很有用。


特征:


🔥内置支持热Mocker文件替换。
🚀通过JSON快速轻松地配置API。
🌱模拟API代理变得简单。
💥可以独立使用,无需依赖webpack和webpack-dev-server。


快速开始



mkdir mocker-app && cd mocker-app

# Create a mocker configuration file based on rules
touch api.js

# Global install dependent.
npm install mocker-api -g
# Run server
mocker ./api.js

安装


你可以将 package.json 配置作为当前项目依赖项。



npm install mocker-api --save-dev

使用


mocker-api 在开发模式支持模拟数据, 将入口文件放入 mocker/index.js.


您可以通过添加 httpProxy 配置来修改 http-proxy 选项并添加事件侦听器



const proxy = {
// Priority processing.
// apiMocker(app, path, option)
// This is the option parameter setting for apiMocker
_proxy: {
proxy: {
'/repos/(.*)': 'https://api.github.com/',
'/:owner/:repo/raw/:ref/(.*)': 'http://127.0.0.1:2018'
},
changeHost: true,
// modify the http-proxy options
httpProxy: {
options: {
ignorePath: true,
},
listeners: {
proxyReq: function (proxyReq, req, res, options) {
console.log('proxyReq');
},
},
},
},
// =====================
'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 /api/:owner/:repo/raw/:ref/(.*)': (req, res) => {
const { owner, repo, ref } = req.params;
// http://localhost:8081/api/admin/webpack-mock-api/raw/master/add/ddd.md
// owner => admin
// repo => webpack-mock-api
// ref => master
// req.params[0] => add/ddd.md
return res.json({
id: 1,
owner, repo, ref,
path: req.params[0]
});
},
'POST /api/login/account': (req, res) => {
const { password, username } = req.body;
if (password === '888888' && username === 'admin') {
return res.json({
status: 'ok',
code: 0,
token: "sdfsdfsdfdsf",
data: {
id: 1,
username: 'kenny',
sex: 6
}
});
} else {
return res.status(403).json({
status: 'error',
code: 403
});
}
},
'DELETE /api/user/:id': (req, res) => {
console.log('---->', req.body)
console.log('---->', req.params.id)
res.send({ status: 'ok', message: '删除成功!' });
}
}
module.exports = proxy;

参数选项



  • proxy => {} Proxy settings.

  • changeHost => {} Setting req headers host.

  • httpProxy => {} Set the listen event and configuration of http-proxy

  • bodyParserJSON JSON body parser

  • bodyParserText Text body parser

  • bodyParserRaw Raw body parser

  • bodyParserUrlencoded URL-encoded form body parser

  • bodyParserConf => {} bodyParser settings. eg: bodyParserConf : {'text/plain': 'text','text/html': 'text'} will parsed Content-Type='text/plain' and Content-Type='text/html' with bodyParser.text


⚠️ 没有通配符 * - 使用参数 (.*), suport v1.7.3+


延迟反应


你可以使用工具自带方法增强模拟. #17



const delay = require('mocker-api/utils/delay');
const noProxy = process.env.NO_PROXY === 'true';

const proxy = {
'GET /api/user': {
id: 1,
username: 'kenny',
sex: 6
},
// ...
}
module.exports = (noProxy ? {} : delay(proxy, 1000));

apiMocker



apiMocker(app, mocker[,proxy])

多入口mocker 文件监听



const mockerFile = ['./mock/index.js'];
// or
// const mockerFile = './mock/index.js';
apiMocker(app, mockerFile, proxy)

在命令行中使用


Base example



⚠️ Not dependent on webpack and webpack-dev-server.




# Global install dependent.
npm install mocker-api -g
# Run server
mocker ./mocker/index.js

Or you can put it the package.json config as a current project dependency.



{
"name": "base-example",
"scripts": {
+ "api": "mocker ./mocker"
},
"devDependencies": {
+ "mocker-api": "^1.6.4"
},
"license": "MIT"
}

在 Express 中使用


Express example



⚠️ Not dependent on webpack and 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);

在 Webpack 中使用


webpack example


To use api mocker on your Webpack projects, simply add a setup options to your webpack-dev-server options:


Change your config file to tell the dev server where to look for files: 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',
print: './src/print.js'
},
devtool: 'inline-source-map',
+ 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({
title: 'Development'
})
],
output: {
filename: '[name].bundle.js',
path: require.resolve(__dirname, 'dist')
}
};

Must have a file suffix! For example: ./mocker/index.js.


Let's add a script to easily run the dev server as well: package.json



{
"name": "development",
"version": "1.0.0",
"description": "",
"main": "webpack.config.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
+ "start": "webpack-dev-server --open",
"build": "webpack"
},
"keywords": [],
"author": "",
"license": "MIT",
"devDependencies": {
....
}
}

模拟API代理简单模式。



{
before(app){
+ apiMocker(app, path.resolve('./mocker/index.js'), {
+ proxy: {
+ '/repos/*': 'https://api.github.com/',
+ },
+ changeHost: true,
+ })
}
}

 


 

浏览 31
点赞
评论
收藏
分享

手机扫一扫分享

编辑 分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

编辑 分享
举报