How to work with two different APIs with React?

In package.json, you can configure the proxy server to make API requests to different targets based on maching the pattern for different API requests in the way it is shown as follows.

Things to note:

• Order of the API patterns matters, the generic request(*) must be last.
• The regex should be such that it matches the complete url, a partial match resulted in errors for me.

The following piece of code worked for me. There are 3 different servers, one for the reports request, one for the access control request, and rest all requests should go to the third server.

"proxy": {
    "/report/.*(_get)": {
      "target": "http://localhost:8093/"
    },
    "/access/.*(_get)": {
      "target": "http://localhost:8091/"
    },
    "/.*": {
      "target": "https://egov-micro-dev.egovernments.org/",
      "changeOrigin": true
    }
  },

Hope this helps.