@sap-ux/ui5-proxy-middleware 1.5.12 → 1.6.1

package/README.md

@@ -3,14 +3,17 @@
 The `@sap-ux/ui5-proxy-middleware` is a [Custom UI5 Server Middleware](https://sap.github.io/ui5-tooling/pages/extensibility/CustomServerMiddleware) for loading the UI5 sources in your application. It can be used either with the `ui5 serve` or the `fiori run` commands.
 
 ## Configuration Options
-| Option       | Default Value | Description |
-| ------------ | ------------- | ----------- |
-| `ui5`        | `object`      | List of mount paths and target urls that should be handled by the proxy. If not provided then `/resources` and `/test-resources` are proxied to `https://ui5.sap.com` |
-| `version`    | `undefined`   | The UI5 version. If this property is not defined, then the `minUI5Version` from the `manifest.json` will be used |
-| `secure`     | true          | Defines if SSL certs should be verified |
-| `debug`      | false         | Enables debug output |
-| `proxy`      | `undefined`   | Use for adding corporate proxy configuration |
-| `directLoad` | false         | Defines whether the UI5 sources should be loaded directly from UI5 CDN |
+| Option       | Value Type    | Requirement Type | Default Value | Description |
+| ------------ | ------------- |------------- | ----------- |----------- |
+| `ui5`        | object  | optional | ---       | Configuration object for the UI5 proxy middleware |
+| `ui5.path`   |  string | optional | `/resources`, `/test-resources`       | Path that is to be proxied |
+| `ui5.url`     | string  | optional |`https://ui5.sap.com`      | URL pointing to the resources |
+| `ui5.pathReplace`| string  | optional | `undefined` | If provided then the path will be replaced with this value before forwarding |
+| `ui5.version`    | string  | optional |`undefined` | The UI5 version. If this property is not defined, then the `minUI5Version` from the `manifest.json` will be used |
+| `secure`     | boolean  | optional | true      | Defines if SSL certs should be verified |
+| `debug`      | boolean  | optional | false         | Enables debug output |
+| `proxy`      |  string | optional | `undefined`   | Use for adding corporate proxy configuration |
+| `directLoad` |  boolean | optional | false         | Defines whether the UI5 sources should be loaded directly from UI5 CDN |
 
 ## Usage
 In order to use the middleware this is the minimal configuration that you need to provide in the `ui5.yaml` of your application. All requests to `/resources` and `/test-resources` will be proxied to the latest UI5 version at https://ui5.sap.com.
@@ -40,7 +43,7 @@ server:
         url: https://ui5.sap.com
 ```
 
-Alternatively you can use the following syntax if all paths should be proxied to the same url.
+Alternatively you can use the following syntax if all paths should be proxied to the same URL.
 
 ```Yaml
 server:
@@ -54,10 +57,11 @@ server:
         - /test-resources
         url: https://ui5.sap.com
 ```
-**NOTE: You can't mix both syntaxes!**
+
+**NOTE: You can't mix the syntaxes!**
 
 ### Loading a specific UI5 version
-To load a specific a UI5 version in your application you can use the `version` parameter, e.g.
+To load a specific UI5 version in your application you can use the `version` parameter, e.g.
 
 ```Yaml
 server:
@@ -92,6 +96,23 @@ server:
       directLoad: true
 ```
 
+### Loading UI5 sources from a different Host
+If you want to load UI5 sources from a different host, then you can set the property `pathReplace` to point to the desired resources. If provided then the `path` will be replaced with this value before forwarding.
+
+**NOTE: using `pathReplace` will not consider a specified UI5 version. If a specific UI5 version is needed, then it needs to be part of the `pathReplace`.**
+
+```Yaml
+server:
+  customMiddleware:
+  - name: ui5-proxy-middleware
+    afterMiddleware: compression
+    configuration:
+      ui5:
+      - path: /resources          
+        url: https://my.backend.example:1234
+        pathReplace: /sap/public/ui5/resources    
+```
+
 ### Adding corporate proxy configuration
 By default the `ui5-proxy-middleware` will read the proxy configuration from the OS environment variables `HTTP_PROXY`, `HTTPS_PROXY` and `NO_PROXY` or from the Node.js environment variables `proxy`, `https-proxy`, and `noproxy`. If those variables are not set, then you can also provide the proxy configuration in the `ui5.yaml` file.
 

package/dist/base/proxy.d.ts

@@ -1,12 +1,15 @@
 import type { Filter, Options } from 'http-proxy-middleware';
+import type { IncomingMessage, ServerResponse } from 'http';
 import type { ProxyConfig } from './types';
+import { ToolsLogger } from '@sap-ux/logger';
 /**
  * Function for proxying UI5 sources.
  *
  * @param config - proxy configuration
  * @param options - additional configuration options
  * @param filter - custom filter function which will be applied to all requests
+ * @param logger - optional logger instance
  * @returns Proxy function to use
  */
-export declare const ui5Proxy: (config: ProxyConfig, options?: Options, filter?: Filter) => import("http-proxy-middleware").RequestHandler;
+export declare const ui5Proxy: (config: ProxyConfig, options?: Options, filter?: Filter, logger?: ToolsLogger) => import("http-proxy-middleware").RequestHandler<IncomingMessage, ServerResponse<IncomingMessage>, (err?: any) => void>;
 //# sourceMappingURL=proxy.d.ts.map

package/dist/base/proxy.js

@@ -12,28 +12,36 @@ const https_proxy_agent_1 = require("https-proxy-agent");
  * @param config - proxy configuration
  * @param options - additional configuration options
  * @param filter - custom filter function which will be applied to all requests
+ * @param logger - optional logger instance
  * @returns Proxy function to use
  */
-const ui5Proxy = (config, options, filter) => {
-    const logger = new logger_1.ToolsLogger({
-        transports: [new logger_1.UI5ToolingTransport({ moduleName: 'ui5-proxy-middleware' })]
-    });
+const ui5Proxy = (config, options, filter, logger = new logger_1.ToolsLogger({
+    transports: [new logger_1.UI5ToolingTransport({ moduleName: 'ui5-proxy-middleware' })]
+})) => {
     const today = new Date();
     const etag = `W/"${config.version || 'ui5-latest-' + today.getDate() + today.getMonth() + today.getFullYear()}"`;
     const ui5Ver = config.version ? `/${config.version}` : '';
+    let proxyFilter = utils_1.filterCompressedHtmlFiles;
+    if (filter) {
+        proxyFilter = filter;
+    }
     const proxyConfig = {
+        on: {
+            proxyReq: (proxyReq, _req, res) => {
+                (0, utils_1.proxyRequestHandler)(proxyReq, res, etag);
+            },
+            proxyRes: (proxyRes) => {
+                (0, utils_1.proxyResponseHandler)(proxyRes, etag);
+            },
+            error: (err, req, res, target) => {
+                (0, utils_1.proxyErrorHandler)(err, req, logger, res, target);
+            }
+        },
         target: config.url,
         changeOrigin: true,
-        onProxyReq: (proxyReq, _req, res) => {
-            (0, utils_1.proxyRequestHandler)(proxyReq, res, etag, logger);
-        },
-        pathRewrite: { [config.path]: ui5Ver + config.path },
-        onProxyRes: (proxyRes) => {
-            (0, utils_1.proxyResponseHandler)(proxyRes, etag);
-        },
-        onError: (err, req, res, target) => {
-            (0, utils_1.proxyErrorHandler)(err, req, logger, res, target);
-        }
+        pathRewrite: (0, utils_1.getPathRewrite)(config, ui5Ver),
+        pathFilter: proxyFilter,
+        ...options
     };
     // update proxy config with values coming from args or ui5.yaml
     (0, utils_1.updateProxyEnv)(config.proxy);
@@ -41,12 +49,7 @@ const ui5Proxy = (config, options, filter) => {
     if (corporateProxy) {
         proxyConfig.agent = new https_proxy_agent_1.HttpsProxyAgent(corporateProxy);
     }
-    Object.assign(proxyConfig, options);
-    let proxyFilter = utils_1.filterCompressedHtmlFiles;
-    if (filter) {
-        proxyFilter = filter;
-    }
-    return (0, http_proxy_middleware_1.createProxyMiddleware)(proxyFilter, proxyConfig);
+    return (0, http_proxy_middleware_1.createProxyMiddleware)(proxyConfig);
 };
 exports.ui5Proxy = ui5Proxy;
 //# sourceMappingURL=proxy.js.map

package/dist/base/types.d.ts

@@ -1,9 +1,25 @@
 import type { NextFunction } from 'express';
 import type { IncomingMessage } from 'http';
 export interface ProxyConfig {
+    /**
+     * Path that is to be proxied.
+     */
     path: string;
+    /**
+     * If provided then the path will be replaced with this value before forwarding.
+     */
+    pathReplace?: string;
+    /**
+     * The target URL to proxy the request to.
+     */
     url: string;
+    /**
+     * If provided then the proxy will try to load the specified version of UI5 resources.
+     */
     version?: string;
+    /**
+     * If set then it will override the proxy settings from node.
+     */
     proxy?: string;
 }
 export interface UI5ProxyRequest {

package/dist/base/utils.d.ts

@@ -1,4 +1,5 @@
 import type { ClientRequest, IncomingMessage, ServerResponse } from 'http';
+import type { Options } from 'http-proxy-middleware';
 import type { ToolsLogger } from '@sap-ux/logger';
 import { type Manifest } from '@sap-ux/project-access';
 import type { RequestHandler, NextFunction, Request, Response } from 'express';
@@ -6,6 +7,7 @@ import type http from 'http';
 import type { ProxyConfig } from './types';
 import type { Url } from 'url';
 import type { ReaderCollection } from '@ui5/fs';
+import type { Socket } from 'node:net';
 /**
  * Handler for the proxy response event.
  * Sets an Etag which will be used for re-validation of the cached UI5 sources.
@@ -22,9 +24,8 @@ export declare const proxyResponseHandler: (proxyRes: IncomingMessage, etag: str
  * @param proxyReq - proxy request object
  * @param res - server response object
  * @param etag - Etag of the cached UI5 sources, normally the UI5 version
- * @param logger - Logger for loging the requests
  */
-export declare const proxyRequestHandler: (proxyReq: ClientRequest, res: ServerResponse, etag: string, logger: ToolsLogger) => void;
+export declare const proxyRequestHandler: (proxyReq: ClientRequest, res: ServerResponse, etag: string) => void;
 /**
  * Get user's proxy configuration.
  *
@@ -94,8 +95,9 @@ export declare function injectUI5Url(originalHtml: string, ui5Configs: ProxyConf
  * @param next - the next function, used to forward the request to the next available handler
  * @param ui5Configs - the UI5 configuration of the ui5-proxy-middleware
  * @param rootProject - the root project
+ * @param logger - logger to be used
  */
-export declare const injectScripts: (req: Request, res: Response, next: NextFunction, ui5Configs: ProxyConfig[], rootProject: ReaderCollection) => Promise<void>;
+export declare const injectScripts: (req: Request, res: Response, next: NextFunction, ui5Configs: ProxyConfig[], rootProject: ReaderCollection, logger?: ToolsLogger) => Promise<void>;
 /**
  * Filters comressed html files from UI5 CDN.
  * Avoid ERR_CONTENT_DECODING_FAILED on http request for gzip'd html files.
@@ -120,7 +122,7 @@ export declare function proxyErrorHandler(err: Error & {
 }, req: IncomingMessage & {
     next?: Function;
     originalUrl?: string;
-}, logger: ToolsLogger, _res?: ServerResponse, _target?: string | Partial<Url>): void;
+}, logger: ToolsLogger, _res?: ServerResponse | Socket, _target?: string | Partial<Url>): void;
 /**
  * Adjust UI5 bootstrap URLs to load directly from UI5 CDN.
  *
@@ -130,4 +132,12 @@ export declare function proxyErrorHandler(err: Error & {
  * @returns RequestHandler to adjust bootstraps
  */
 export declare function directLoadProxy(ui5Configs: ProxyConfig[], rootProject: ReaderCollection, logger: ToolsLogger): RequestHandler;
+/**
+ * Create a rewrite based on the provided configuration.
+ *
+ * @param config proxy configuration
+ * @param ui5Ver UI5 version string
+ * @returns a path rewrite
+ */
+export declare function getPathRewrite(config: ProxyConfig, ui5Ver: string): Options['pathRewrite'];
 //# sourceMappingURL=utils.d.ts.map

package/dist/base/utils.js

@@ -6,6 +6,7 @@ exports.resolveUI5Version = resolveUI5Version;
 exports.injectUI5Url = injectUI5Url;
 exports.proxyErrorHandler = proxyErrorHandler;
 exports.directLoadProxy = directLoadProxy;
+exports.getPathRewrite = getPathRewrite;
 const project_access_1 = require("@sap-ux/project-access");
 const constants_1 = require("./constants");
 const i18n_1 = require("../i18n");
@@ -29,10 +30,8 @@ exports.proxyResponseHandler = proxyResponseHandler;
  * @param proxyReq - proxy request object
  * @param res - server response object
  * @param etag - Etag of the cached UI5 sources, normally the UI5 version
- * @param logger - Logger for loging the requests
  */
-const proxyRequestHandler = (proxyReq, res, etag, logger) => {
-    logger.debug(proxyReq.path);
+const proxyRequestHandler = (proxyReq, res, etag) => {
     if (proxyReq.getHeader('if-none-match') === etag) {
         res.statusCode = 304;
         res.end();
@@ -232,12 +231,14 @@ function injectUI5Url(originalHtml, ui5Configs) {
  * @param next - the next function, used to forward the request to the next available handler
  * @param ui5Configs - the UI5 configuration of the ui5-proxy-middleware
  * @param rootProject - the root project
+ * @param logger - logger to be used
  */
-const injectScripts = async (req, res, next, ui5Configs, rootProject) => {
+const injectScripts = async (req, res, next, ui5Configs, rootProject, logger) => {
     try {
         const htmlFileName = (0, exports.getHtmlFile)(req.url);
         const files = await rootProject.byGlob(`**/${htmlFileName}`);
         if (files.length === 0) {
+            logger?.warn('No HTML file found for direct load injection.');
             next();
         }
         else {
@@ -302,7 +303,7 @@ function proxyErrorHandler(err, req, logger, _res, _target) {
 function directLoadProxy(ui5Configs, rootProject, logger) {
     return async (req, res, next) => {
         try {
-            await (0, exports.injectScripts)(req, res, next, ui5Configs, rootProject);
+            await (0, exports.injectScripts)(req, res, next, ui5Configs, rootProject, logger);
         }
         catch (error) {
             logger.error(error);
@@ -310,4 +311,19 @@ function directLoadProxy(ui5Configs, rootProject, logger) {
         }
     };
 }
+/**
+ * Create a rewrite based on the provided configuration.
+ *
+ * @param config proxy configuration
+ * @param ui5Ver UI5 version string
+ * @returns a path rewrite
+ */
+function getPathRewrite(config, ui5Ver) {
+    if (config.pathReplace) {
+        // Remove trailing slash from pathReplace if present
+        const sanitizedPathReplace = config.pathReplace?.replace(/\/$/, '');
+        return (path) => path.replace(config.path, sanitizedPathReplace);
+    }
+    return (path) => (path.startsWith(config.path) ? ui5Ver + path : ui5Ver + config.path + path);
+}
 //# sourceMappingURL=utils.js.map

package/dist/ui5/middleware.js

@@ -17,8 +17,7 @@ const dotenv_1 = __importDefault(require("dotenv"));
 function createProxyOptions(logger, config) {
     return {
         secure: config.secure !== undefined ? !!config.secure : true,
-        logLevel: config.debug ? 'debug' : 'info',
-        logProvider: () => logger
+        logger: config.debug ? logger : undefined
     };
 }
 /**
@@ -51,6 +50,7 @@ async function loadManifest(rootProject) {
 }
 module.exports = async ({ resources, options }) => {
     const logger = new logger_1.ToolsLogger({
+        logLevel: options.configuration?.debug ? logger_1.LogLevel.Debug : logger_1.LogLevel.Info,
         transports: [new logger_1.UI5ToolingTransport({ moduleName: 'ui5-proxy-middleware' })]
     });
     dotenv_1.default.config();
@@ -76,7 +76,7 @@ module.exports = async ({ resources, options }) => {
     // hide user and pass from proxy configuration for displaying it in the terminal
     const proxyInfo = (0, base_1.hideProxyCredentials)(corporateProxyServer);
     const proxyOptions = createProxyOptions(logger, config);
-    logger.info(`Starting ui5-proxy-middleware using following configuration:\nproxy: '${proxyInfo}'\nsecure: '${proxyOptions.secure}'\nlog: '${proxyOptions.logLevel}''\ndirectLoad: '${directLoad}'`);
+    logger.info(`Starting ui5-proxy-middleware using following configuration:\nproxy: '${proxyInfo}'\nsecure: '${proxyOptions.secure}'\nlog: '${config.debug ? 'debug' : 'info'}' \ndirectLoad: '${directLoad}'`);
     const configs = Array.isArray(config.ui5) ? config.ui5 : [config.ui5];
     const ui5Configs = [];
     const routes = [];
@@ -89,7 +89,7 @@ module.exports = async ({ resources, options }) => {
                 version: ui5Version,
                 proxy: config.proxy
             };
-            routes.push({ route: ui5Config.path, handler: (0, base_1.ui5Proxy)(ui5Config, proxyOptions) });
+            routes.push({ route: ui5Config.path, handler: (0, base_1.ui5Proxy)(ui5Config, proxyOptions, undefined, logger) });
             ui5Configs.push(ui5Config);
         }
     }

package/package.json

@@ -9,7 +9,7 @@
   "bugs": {
     "url": "https://github.com/SAP/open-ux-tools/issues?q=is%3Aopen+is%3Aissue+label%3Abug+label%3Aui5-proxy-middleware"
   },
-  "version": "1.5.12",
+  "version": "1.6.1",
   "license": "Apache-2.0",
   "author": "@SAP/ux-tools-team",
   "main": "dist/index.js",
@@ -22,7 +22,7 @@
   ],
   "dependencies": {
     "dotenv": "16.3.1",
-    "http-proxy-middleware": "2.0.9",
+    "http-proxy-middleware": "3.0.5",
     "https-proxy-agent": "5.0.1",
     "i18next": "25.3.0",
     "proxy-from-env": "1.1.0",