From e644a225abd2084f47dc74f15d027212c4b05b7d Mon Sep 17 00:00:00 2001
From: Steven Chim <655241+chimurai@users.noreply.github.com>
Date: Sat, 20 Apr 2024 14:15:53 +0200
Subject: [PATCH] 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
---
 CHANGELOG.md                           |  1 +
 src/plugins/default/logger-plugin.ts   | 25 +++++++++++++++++++++++--
 test/e2e/http-proxy-middleware.spec.ts |  4 +++-
 3 files changed, 27 insertions(+), 3 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 6d25e2d8..dcc44e7a 100644
--- a/CHANGELOG.md
+++ b/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)
 
diff --git a/src/plugins/default/logger-plugin.ts b/src/plugins/default/logger-plugin.ts
index 00c70bae..5e368030 100644
--- a/src/plugins/default/logger-plugin.ts
+++ b/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);
   });
 
diff --git a/test/e2e/http-proxy-middleware.spec.ts b/test/e2e/http-proxy-middleware.spec.ts
index db6ddb3a..96f2cd80 100644
--- a/test/e2e/http-proxy-middleware.spec.ts
+++ b/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]`,
+        );
       });
     });
   });