Debugging API calls that use a proxy in package.json

Question

If I'm using a proxy in my package.json, for example, something like this:

"proxy": "https://my-api-url.com"

If I want to see the URL actually being fetched by the fetch API, how can I do so? I'm not sure that this question makes sense, but I'm doing my best -- in Chrome's network tab, I can see that the request url is http://localhost:3000/some/endpoint, but how do I know if the proxy is working correctly?

Apologies if this question doesn't make sense or is unclear.

Answer 1

I ended up using the following Webpack config, just in case it helps anyone else:

    proxy: {
        "/api": {
            "target": "https://link-to-your-api",
            "secure": false,
            "pathRewrite": {
                "^/api": ""
            },
            "changeOrigin": true,
            "logLevel": "debug"
        }
    }
},

With that config, I was able to make requests using the Fetch API like so:

  const response = await fetch('/api/path1/path2/endpoint/', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      'Cache-Control': 'no-cache'
    },
    body: JSON.stringify(yourRequestBody)
  });