[Solved]-Can I use mock data and proxy api data at the same time in my react project when using node express as a proxy server?-Reactjs

I find that with the "node express" and "http-proxy-middleware", it is feasible to use mock data and proxy api data at the same time. The details are as follows:

1) Create a mock.js file, which defines the request path and response body of mock datas:

const express = require('express');
const router = express.Router();

router.post('/mock/api/login', function (req, res, next) {
    res.json({
        "payload": {},
        "errorMsg": {
        "errorCode": null,
        "errorMsg": ""
    },
    "status": 0
  })
})

2) In main.js

const express = require('express');
const proxy = require('http-proxy-middleware');
const apiProxy = proxy({
    target: 'http://192.168.1.40:8080',
    changeOrigin: true
});
 const app = express() ;
 const mockDatas = require('./mock.js');
 app.use('/', mockDatas);
app.use('/api', apiProxy);

I had a similar requirement where I needed to mock only a few calls and hit the original API for the others. For this, I hacked a tool Beeceptor for proxying and mocking at the same time. You can define mocking rule to decide when to mock, and the other calls are routed to original API.

This tool is language/platform agnostic as it is hosted and provides subdomain/endpoint.

(Disclaimer: I am the author of Beeceptor, and sharing here as it fulfills the precise need.)