Webpack 3 프록시 다중 도메인

Question

여러 도메인을 사용하여 webpack-dev-server 용 프록시를 설정하려고합니다. 우리의 시스템은 다음과 같이 작동

• login.domain.ext
• 이제 프로젝트는 로그인이 PHP 백엔드이며 그가 작동하는 동안, 웹팩 dev에 서버에서 실행

project.domain.ext dev 컴퓨터.

이 나는 ​​포트에게 8080

을 다시 추가 할 수 있도록 모든 반환 그러나 웹팩 도메인을 무시하는 것 같다 리디렉션 SSL 및 트랩에 로그인하기 위해 리디렉션하기 위해 프록시 설정을 설정 관리, 지금은 단지 역할 로그인 프로젝트에 대한 모든 것을 프록 싱하는 것처럼 말입니다.

disableHostCheck를 false로 설정하면 로그인 도메인 nog가 유효한 호스트로 오류가 발생합니다.

호스트 이름 프록시에서 찾을 수없는 모든 구성은 경로 프록시에 관한 것입니다. 하지만 이런 설정을 한 유일한 존재라고 상상할 수는 없습니다. 여기

내가 그것을 알아 냈

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); 
     } 
    } 
} 

Answer 1

, 당신은 응답 헤더를

을 재 변경하기위한 라우팅 도메인에 대해

onProxyRes을

• 라우터를 사용하여이 작업을 수행 할 수 있습니다 dev에 서버 설정의 '.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); 
     } 
    } 
}