利用mock模仿我的项目api

原理

  • 利用axios发动申请
  • 利用axios-mock-adapter解决拦挡申请

外围实现代码

# mock创立const MockAdapter = require('axios-mock-adapter');const axios = require('axios');const Mock = new MockAdapter(axios);Mock.onGet("/api/super-store/big-discounts").reply(async () => {  try {    return [200, bigDiscountList];  } catch (err) {    console.error(err);    return [500, {      message: "Internal server error"    }];  }});## replay 是回复，模仿你申请后的response## get 用 onGet post 用 onPost## 正则间接写  mock.onGet(/\/users\/\d+/) ## 你如果带参数申请，mock的replay外面的函数，应该这样写(config)=>{    JSON.parse(config.data)//解析axios传过来的值    你能够用}## 如果想模仿网络提早，var mock = new MockAdapter(axiosInstance, { delayResponse: 2000 });## 如果你想引入很多mock接口，并全副匹配这些申请例如：const MockAdapter = require('axios-mock-adapter');const axios = require('axios');const Mock = new MockAdapter(axios);import "./server/furniture-shop/productsDB";import "./server/grocery3-shop/productsDB";import "./server/related-products/productsDB";Mock.onAny().passThrough();//这个是match all requests
axios-mock-adapter学习链接：https://www.npmjs.com/package...

常见问题

过程中可能呈现的问题

error - Error: connect ECONNREFUSED 127.0.0.1:80

你写的axios申请url可能是 /api/ 等等，不带前缀的话，默认从你的80端口发申请
你也能够用 axios.defaults.baseURL = '批改你的默认申请url'

造成这个的状况，
1、你的mock可能没有把文件放到相似index文件中，就是你须要利用mock数据的文件
2、如果你是应用框架react、vue或者集成两者的遍历框架，例如next。js等等，同理你须要找到对应文件增加，或者在相似app。js主文件中给全局引入