fix(logger-plugin): fix missing target port (#989)

* fix(logger-plugin): fix missing target port
* refactor(logger-plugin): improve req type
* docs(CHANGELOG.md): update changelog

Author: chimurai

CHANGELOG.md

@@ -4,6 +4,7 @@
 
 - fix(type): fix RequestHandler return type
 - refactor(errors): improve pathFilter error message
+- fix(logger-plugin): fix missing target port
 
 ## [v3.0.0](https://github.com/chimurai/http-proxy-middleware/releases/tag/v3.0.0)
 

src/plugins/default/logger-plugin.ts

@@ -1,5 +1,20 @@
+import { URL } from 'url';
 import { Plugin } from '../../types';
 import { getLogger } from '../../logger';
+import type { IncomingMessage } from 'node:http';
+
+type ExpressRequest = {
+  /** Express req.baseUrl */
+  baseUrl?: string;
+};
+
+type BrowserSyncRequest = {
+  /** BrowserSync req.originalUrl */
+  originalUrl?: string;
+};
+
+/** Request Types from different server libs */
+type FrameworkRequest = IncomingMessage & ExpressRequest & BrowserSyncRequest;
 
 export const loggerPlugin: Plugin = (proxyServer, options) => {
   const logger = getLogger(options);
@@ -22,11 +37,17 @@ export const loggerPlugin: Plugin = (proxyServer, options) => {
    * [HPM] GET /users/ -> http://jsonplaceholder.typicode.com/users/ [304]
    * ```
    */
-  proxyServer.on('proxyRes', (proxyRes: any, req: any, res) => {
+  proxyServer.on('proxyRes', (proxyRes: any, req: FrameworkRequest, res) => {
     // BrowserSync uses req.originalUrl
     // Next.js doesn't have req.baseUrl
     const originalUrl = req.originalUrl ?? `${req.baseUrl || ''}${req.url}`;
-    const exchange = `[HPM] ${req.method} ${originalUrl} -> ${proxyRes.req.protocol}//${proxyRes.req.host}${proxyRes.req.path} [${proxyRes.statusCode}]`;
+
+    // construct targetUrl
+    const target = new URL(options.target as URL);
+    target.pathname = proxyRes.req.path;
+    const targetUrl = target.toString();
+
+    const exchange = `[HPM] ${req.method} ${originalUrl} -> ${targetUrl} [${proxyRes.statusCode}]`;
     logger.info(exchange);
   });
 

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

@@ -459,7 +459,9 @@ describe('E2E http-proxy-middleware', () => {
 
         expect(logMessages).not.toBeUndefined();
         expect(logMessages.length).toBe(1);
-        expect(logMessages[0]).toBe('[HPM] GET /api/foo/bar -> http://localhost/api/foo/bar [200]');
+        expect(logMessages.at(0)).toBe(
+          `[HPM] GET /api/foo/bar -> http://localhost:${mockTargetServer.port}/api/foo/bar [200]`,
+        );
       });
     });
   });