Get POST request body in Vite server.proxy["/api"].configure

Question

I am migrating a project from Webpack to Vite and have run into an issue with proxying requests to one of the endpoints in the MVC.Net backend.

Due to circumstances of the existing project, I need to handle certain calls manually - such as on initial page load of login page, check whether user is already authenticated and redirect to the main page.

I am trying to figure out how to use server.proxy.configure to handle these requests. I am managing fine with the GET requests, but I cannot seem to receive the POST request's body data.

Here is what I have at the moment:

  server: {
    proxy: {
      "/api": {
        target: "https://my.local.environment/",
        changeOrigin: true,
        configure: (proxy: HttpProxy.Server, options: ProxyOptions) => {
          proxy.on("proxyReq", (proxyReq, req, res, options) => {
            if (req.method === "GET") {
              //handle simple get requests. no problems here
              //...
            } else {
              const buffer = [];
              console.log("received post request");
              proxyReq.on("data", (chunk) => {
                console.log("received chunk");
                buffer.push(chunk);
              });
              proxyReq.on("end", () => {
                console.log("post request completed");
                const body = Buffer.concat(buffer).toString();
                
                const forwardReq = http.request(
                  {
                    host: "https://my.local.environment",
                    port: 443,
                    method: "POST",
                    path: req.url,
                    headers: {
                      "Content-Type": "application/json",
                      "Content-Length": data.length,
                    },
                  },
                  (result) => {
                    result.on("data", (d) => {
                      res.write(d);
                      res.end();
                    });
                  }
                );

                forwardReq.on("error", (error) => {
                  console.log(error);
                });

                forwardReq.write(data);
                forwardReq.end();
              });
            }
          });
        },
        secure: false,
      },
    }
  }

The problem is that neither proxyReq.on("data", (chunk) => { nor proxyReq.on("end", (chunk) => { ever actually trigger.

Additionally, req.body is undefined.

I have absolutely no idea where I am supposed to be getting the POST request's body.

Answer 1

I ended up finding a different question about the bypass option and this gave me the solution I was looking for. Ended up only handling the specific GET requests that I need to handle locally instead of forwarding to my deployed environment, and everything else gets handled automatically by vite.

"/api": {
  target: "https://my.local.environment/",
  changeOrigin: true,
  agent: new https.Agent({
    keepAlive: true,
  }),
  bypass(req, res, proxyOptions) {
    if (req.method === "GET") {
      //... here I get what I need and write to the res object
      // and of course call res.end()
    }
    //all other calls are handled automatically
  },
  secure: false,
},