feat: try to keep body even after body-parser middleware

Author: midgleyc

package.json

@@ -55,6 +55,7 @@
     "@types/micromatch": "^4.0.1",
     "@types/node": "^14.11.8",
     "@types/supertest": "^2.0.10",
+    "body-parser": "^1.19.0",
     "browser-sync": "^2.26.12",
     "connect": "^3.7.0",
     "express": "^4.17.1",

src/http-proxy-middleware.ts

@@ -1,6 +1,8 @@
 import * as express from 'express';
+import { ClientRequest } from 'http';
 import * as httpProxy from 'http-proxy';
 import * as _ from 'lodash';
+import * as querystring from 'querystring';
 import { createConfig } from './config-factory';
 import * as contextMatcher from './context-matcher';
 import * as handlers from './handlers';
@@ -33,6 +35,9 @@ export class HttpProxyMiddleware {
     // log errors for debug purpose
     this.proxy.on('error', this.logError);
 
+    // fix proxied body if bodyParser is involved
+    this.proxy.on('proxyReq', this.fixBody);
+
     // https://github.com/chimurai/http-proxy-middleware/issues/19
     // expose function to upgrade externally
     (this.middleware as any).upgrade = (req, socket, head) => {
@@ -174,4 +179,24 @@ export class HttpProxyMiddleware {
 
     this.logger.error(errorMessage, req.url, hostname, target, err.code || err, errReference);
   };
+
+  private fixBody = (proxyReq: ClientRequest, req: Request) => {
+    if (!req.body || !Object.keys(req.body).length) {
+      return;
+    }
+
+    const contentType = proxyReq.getHeader('Content-Type');
+    const writeBody = (bodyData: string) => {
+      proxyReq.setHeader('Content-Length', Buffer.byteLength(bodyData));
+      proxyReq.write(bodyData);
+    };
+
+    if (contentType === 'application/json') {
+      writeBody(JSON.stringify(req.body));
+    }
+
+    if (contentType === 'application/x-www-form-urlencoded') {
+      writeBody(querystring.stringify(req.body));
+    }
+  };
 }

test/e2e/_utils.ts

@@ -2,9 +2,9 @@ import * as express from 'express';
 
 export { createProxyMiddleware } from '../../dist/index';
 
-export function createApp(middleware) {
+export function createApp(...middleware) {
   const app = express();
-  app.use(middleware);
+  app.use(...middleware);
   return app;
 }
 

test/e2e/express-router.spec.ts

@@ -4,8 +4,8 @@ import { createProxyMiddleware } from './_utils';
 import { Options } from '../../src/index';
 
 describe('Usage in Express', () => {
-  let app;
-  let server;
+  let app: express.Express;
+  let server: http.Server;
 
   beforeEach(() => {
     app = express();

test/e2e/http-proxy-middleware.spec.ts

@@ -1,6 +1,7 @@
 import { createProxyMiddleware, createApp, createAppWithPath } from './_utils';
 import * as request from 'supertest';
 import { Mockttp, getLocal, CompletedRequest } from 'mockttp';
+import * as bodyParser from 'body-parser';
 
 describe('E2E http-proxy-middleware', () => {
   describe('http-proxy-middleware creation', () => {
@@ -84,6 +85,41 @@ describe('E2E http-proxy-middleware', () => {
       });
     });
 
+    describe('basic setup with configured body-parser', () => {
+      it('should proxy request body from form', async () => {
+        agent = request(
+          createApp(
+            bodyParser.urlencoded({ extended: false }),
+            createProxyMiddleware('/api', {
+              target: `http://localhost:${mockTargetServer.port}`,
+            })
+          )
+        );
+
+        await mockTargetServer.post('/api').thenCallback((request) => {
+          expect(request.body.text).toBe('foo=bar&bar=baz');
+          return { status: 200 };
+        });
+        await agent.post('/api').send('foo=bar').send('bar=baz').expect(200);
+      });
+      it('should proxy request body from json', async () => {
+        agent = request(
+          createApp(
+            bodyParser.urlencoded({ extended: false }),
+            createProxyMiddleware('/api', {
+              target: `http://localhost:${mockTargetServer.port}`,
+            })
+          )
+        );
+
+        await mockTargetServer.post('/api').thenCallback((request) => {
+          expect(request.body.json).toEqual({ foo: 'bar', bar: 'baz' });
+          return { status: 200 };
+        });
+        await agent.post('/api').send({ foo: 'bar', bar: 'baz' }).expect(200);
+      });
+    });
+
     describe('custom context matcher/filter', () => {
       it('should have response body: "HELLO WEB"', async () => {
         const filter = (path, req) => {

yarn.lock

@@ -1333,7 +1333,7 @@ blob@0.0.5:
   resolved "https://registry.yarnpkg.com/blob/-/blob-0.0.5.tgz#d680eeef25f8cd91ad533f5b01eed48e64caf683"
   integrity sha512-gaqbzQPqOoamawKg0LGVd7SzLgXS+JH61oWprSLH+P+abTczqJbhTR8CmJ2u9/bUYNmHTGJx/UEmn6doAvvuig==
 
-body-parser@1.19.0, body-parser@^1.15.2:
+body-parser@1.19.0, body-parser@^1.15.2, body-parser@^1.19.0:
   version "1.19.0"
   resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.19.0.tgz#96b2709e57c9c4e09a6fd66a8fd979844f69f08a"
   integrity sha512-dhEPs72UPbDnAQJ9ZKMNTP6ptJaionhP5cBb541nXPlW60Jepo9RV/a4fX4XWW9CuFNK22krhrj1+rgzifNCsw==