Webpack 3代理多个域

我正在尝试使用多个域为webpack dev服务器设置代理。我们的系统工作原理如下：

• login.domain.ext
• project.domain.ext

现在，该项目运行在webpack开发服务器上，而登录是一个PHP后端，可以在开发机器上运行

我设法设置了一个代理配置来重定向到SSL登录，并捕获所有返回重定向，以便可以重新添加端口8080

然而，webpack似乎忽略了域，现在的行为就像它将所有内容代理给登录项目一样

将disableHostCheck设置为false会导致登录域nog为有效主机时出错

我在主机名代理上找不到任何内容我看到的所有配置都是关于路径代理的。但我无法想象我是唯一一个有这样设置的人

这是dev服务器配置

import { configPath } from "../vars/paths.config";

const webpackMerge = require('webpack-merge');
const webpack = require('webpack');
import { commonConfig } from './common.config';

const fs = require('fs');

export let developmentConfig;

developmentConfig = {
    devServer: {
        historyApiFallback: true,
        public : 'project.domain.ext.dev1:8080',
        disableHostCheck: true,
        https: {
            key: fs.readFileSync( configPath + '/resources/ssl/san_domain_com.key' ),
            cert: fs.readFileSync( configPath + '/resources/ssl/san_domain_com.crt-extensions' )
        },
        stats: {
            colors: true
        },
        proxy: {
            "https://login.domain.ext.dev1:8080/": {
                target: "https://login.domain.ext.dev01",
                secure: false,
                changeOrigin: true,
                onProxyReq: relayRequestHeaders,
                onProxyRes: relayResponseHeaders
            }
        },
        hot: true,
        open: true,
        progress: true
    },
    plugins : [
        new webpack.HotModuleReplacementPlugin(),
        new webpack.NamedModulesPlugin()
    ]
};
developmentConfig = webpackMerge( commonConfig, developmentConfig );

function relayRequestHeaders(proxyReq, req) {}

function relayResponseHeaders(proxyRes, req, res) {
    if (proxyRes.headers && proxyRes.headers.location) {
        let expression = new RegExp('https://(project\\.(domain\\.ext|alt-domani\\.ext)\\.dev1)/', 'i');
        let match = proxyRes.headers.location.match( expression );
        if (match) {
            proxyRes.headers.location = proxyRes.headers.location.replace(match[1], match[1] + ':8080');
            res.append( 'location', proxyRes.headers.location );
        }
    }
}

---

我想出来了，你可以用

• 路由域路由器
• 用于更改响应重定向头的onProxyRes
• “.htaccess”的旁路部分将所有内容设置为index.html

这是我的最终代理配置

/**
 * Proxy guide at:
 *    https://github.com/chimurai/http-proxy-middleware
 *    https://github.com/chimurai/http-proxy-middleware/tree/master/recipes
 */
const domains = [
    'domain.ext',
    'domain2.ext'
];

const domainPrefixes = [
    'api',
    'admin',
    'login'
];

let routedRoutes = {};
domains.map( function( domain ) {
    domainPrefixes.map( function( prefix ) {
        routedRoutes[ prefix + '.' + domain + ':8080' ] = 'https://' + prefix + '.' + domain + ':443'
    } )
} );

export const devServerProxyConfig = {
    devServer: {
        disableHostCheck: true,
        proxy: {
            "/api/": {
                target: "https://api.domain.ext/",
                secure: false,
                changeOrigin: true,
                pathRewrite: {
                    '/api': ''
                }
            },
            "https://interface.domain.ext:8080": {
                target: "https://interface.domain.ext:8080",
                secure: false,
                changeOrigin: true,
                bypass: bypassFunction,
                onProxyReq: relayRequestHeaders,
                onProxyRes: relayResponseHeaders,
                router: routedRoutes
            },
        }
    }
};

/**
 * Proxy bypass function to bypass request to interface.domain.ext back to /index.html
 *
 * @param req
 * @param res
 * @param proxyOptions
 * @returns {string}
 */
function bypassFunction(req, res, proxyOptions) {
    if (req.headers && req.headers.host) {
        let expression = new RegExp('(my\\.(' + domains.join('|').replace(new RegExp('\\.', 'gi'), '\\.') + '))', 'i');
        let match = req.headers.host.match( expression );
        if (match && match.length > 0) {
            return '/index.html';
        }
    }
}


/**
 * Adjust request headers before send to script
 * @param proxyReq
 * @param req
 */
function relayRequestHeaders(proxyReq, req) {}


/**
 * Adjust response headers before send to browser
 * @param proxyRes
 * @param req
 * @param res
 */
function relayResponseHeaders(proxyRes, req, res) {
    if (proxyRes.headers && proxyRes.headers.location) {
        // my is not in the prefixes
        let expression = new RegExp('https://(((my|' + domainPrefixes.join('|') + ')\\.(' + domains.join('|').replace(new RegExp('\\.', 'gi'), '\\.') + '))(:443)?)/', 'i');
        let match = proxyRes.headers.location.match( expression );
        if (match && match.length > 0) {
            // match[0] is full url
            // match[1] is url including port (if set)
            // match[2] is url excluding port
            // match[3] is domain prefix
            // match[4] is domain
            // match[5] is port if set
            proxyRes.headers.location = proxyRes.headers.location.replace(match[1], match[2] + ':8080');
            res.append( 'location', proxyRes.headers.location );
        }
    }
}