Angular 2 Reverse Proxy - Different context path

I am using a Weblogic Application Server, where I have deployed my Angular 2application.

lets assume that the internal IP is http://127.0.0.1:7009/myapp, and I have set

But the application is exposed external from a Reverse Proxy at http://my.application.org/myapp2.

So we have 2 different context paths. This causes problems since I cannot find my front-end resources. How do we resolve such a problem?

This is the approach I am using for Legacy Angular projects. I have created a js file that is run after an ng-build.

const fs = require('fs');
const path = require('path');
const cheerio = require('cheerio');

const useProtocol = false;

const isAbsoluteUrl = filePath =>
    filePath.startsWith('/') || filePath.startsWith('http://') || filePath.startsWith('https://');

const performReplacement = (content) => {

    const environmentFilePath = path.join(__dirname, 'src', 'environments', 'environment.ts');

    const $ = cheerio.load(content);

    // Read the environment.ts file to get the APP_CONTEXT_ROOT and API_WEB_SERVER_BASE_PATH values
    const environmentContent = fs.readFileSync(environmentFilePath, 'utf8');
    const appContextRootMatch = environmentContent.match(/APP_CONTEXT_ROOT: ['"](.*?)['"]/);
    const appContextRoot = appContextRootMatch ? appContextRootMatch[1] : '';

    const apiWebServerBasePathMatch = environmentContent.match(/API_WEB_SERVER_BASE_PATH: ['"](.*?)['"]/);
    const apiWebServerBasePath = apiWebServerBasePathMatch ? apiWebServerBasePathMatch[1] : '';

    // Append the API_WEB_SERVER_BASE_PATH to the APP_CONTEXT_ROOT
    const normalizedAppContextRoot = appContextRoot.endsWith('/') ? appContextRoot : `${appContextRoot}/`;
    const absolutePath = useProtocol
        ? `${apiWebServerBasePath}${normalizedAppContextRoot}`
        : normalizedAppContextRoot;

    // Replace the <script> tags with absolute paths
    const scriptTags = $('script[src]');
    scriptTags.each((index, element) => {
        const scriptPath = $(element).attr('src');
        if (!isAbsoluteUrl(scriptPath)) {
            const absoluteScriptPath = `${absolutePath}${scriptPath}`;
            $(element).attr('src', absoluteScriptPath);
        }
    });

    // Replace the <link> tags with absolute paths
    const linkTags = $('link[href]');
    linkTags.each((index, element) => {
        const linkPath = $(element).attr('href');
        if (!isAbsoluteUrl(linkPath)) {
            const absoluteLinkPath = `${absolutePath}${linkPath}`;
            $(element).attr('href', absoluteLinkPath);
        }
    });

    //replace base href with context root
    const baseHref = `<base href="${normalizedAppContextRoot}" />`;
    $('base').replaceWith(baseHref);

    return $.html();
}

// Replace the index.html file
const distIndexPath = path.join(__dirname, 'dist', 'index.html');
const htmlContent = fs.readFileSync(distIndexPath, 'utf8');
const modifiedHtml = performReplacement(htmlContent);
fs.writeFileSync(distIndexPath, modifiedHtml);

//output to console
console.log(`Modified index.html file has been saved in the dist folder.`);
console.log(`Modified content is: `);
console.log(modifiedHtml);