diff --git a/packages/react-dev-utils/WebpackDevServerUtils.js b/packages/react-dev-utils/WebpackDevServerUtils.js index f83c722a0ffbde098506c4650bb1b029ea5b015e..0a3e233e6419f9503c7a9446aa020b1c55922873 100644 --- a/packages/react-dev-utils/WebpackDevServerUtils.js +++ b/packages/react-dev-utils/WebpackDevServerUtils.js @@ -274,19 +274,15 @@ function prepareProxy(proxy, appPublicFolder) { if (!proxy) { return undefined; } - if (typeof proxy !== 'object' && typeof proxy !== 'string') { + if (typeof proxy !== 'string') { console.log( - chalk.red( - 'When specified, "proxy" in package.json must be a string or an object.' - ) + chalk.red('When specified, "proxy" in package.json must be a string.') ); console.log( chalk.red('Instead, the type of "proxy" was "' + typeof proxy + '".') ); console.log( - chalk.red( - 'Either remove "proxy" from package.json, or make it an object.' - ) + chalk.red('Either remove "proxy" from package.json, or make it a string.') ); process.exit(1); } @@ -297,82 +293,42 @@ function prepareProxy(proxy, appPublicFolder) { return !fs.existsSync(maybePublicPath); } - // Support proxy as a string for those who are using the simple proxy option - if (typeof proxy === 'string') { - if (!/^http(s)?:\/\//.test(proxy)) { - console.log( - chalk.red( - 'When "proxy" is specified in package.json it must start with either http:// or https://' - ) - ); - process.exit(1); - } - - let target; - if (process.platform === 'win32') { - target = resolveLoopback(proxy); - } else { - target = proxy; - } - return [ - { - target, - logLevel: 'silent', - // For single page apps, we generally want to fallback to /index.html. - // However we also want to respect `proxy` for API calls. - // So if `proxy` is specified as a string, we need to decide which fallback to use. - // We use a heuristic: We want to proxy all the requests that are not meant - // for static assets and as all the requests for static assets will be using - // `GET` method, we can proxy all non-`GET` requests. - // For `GET` requests, if request `accept`s text/html, we pick /index.html. - // Modern browsers include text/html into `accept` header when navigating. - // However API calls like `fetch()` won’t generally accept text/html. - // If this heuristic doesn’t work well for you, use a custom `proxy` object. - context: function(pathname, req) { - return ( - req.method !== 'GET' || - (mayProxy(pathname) && - req.headers.accept && - req.headers.accept.indexOf('text/html') === -1) - ); - }, - onProxyReq: proxyReq => { - // Browers may send Origin headers even with same-origin - // requests. To prevent CORS issues, we have to change - // the Origin to match the target URL. - if (proxyReq.getHeader('origin')) { - proxyReq.setHeader('origin', target); - } - }, - onError: onProxyError(target), - secure: false, - changeOrigin: true, - ws: true, - xfwd: true, - }, - ]; + if (!/^http(s)?:\/\//.test(proxy)) { + console.log( + chalk.red( + 'When "proxy" is specified in package.json it must start with either http:// or https://' + ) + ); + process.exit(1); } - // Otherwise, proxy is an object so create an array of proxies to pass to webpackDevServer - return Object.keys(proxy).map(function(context) { - if (!proxy[context].hasOwnProperty('target')) { - console.log( - chalk.red( - 'When `proxy` in package.json is as an object, each `context` object must have a ' + - '`target` property specified as a url string' - ) - ); - process.exit(1); - } - let target; - if (process.platform === 'win32') { - target = resolveLoopback(proxy[context].target); - } else { - target = proxy[context].target; - } - return Object.assign({}, proxy[context], { - context: function(pathname) { - return mayProxy(pathname) && pathname.match(context); + let target; + if (process.platform === 'win32') { + target = resolveLoopback(proxy); + } else { + target = proxy; + } + return [ + { + target, + logLevel: 'silent', + // For single page apps, we generally want to fallback to /index.html. + // However we also want to respect `proxy` for API calls. + // So if `proxy` is specified as a string, we need to decide which fallback to use. + // We use a heuristic: We want to proxy all the requests that are not meant + // for static assets and as all the requests for static assets will be using + // `GET` method, we can proxy all non-`GET` requests. + // For `GET` requests, if request `accept`s text/html, we pick /index.html. + // Modern browsers include text/html into `accept` header when navigating. + // However API calls like `fetch()` won’t generally accept text/html. + // If this heuristic doesn’t work well for you, use a custom `proxy` object. + context: function(pathname, req) { + return ( + req.method !== 'GET' || + (mayProxy(pathname) && + req.headers.accept && + req.headers.accept.indexOf('text/html') === -1) + ); }, onProxyReq: proxyReq => { // Browers may send Origin headers even with same-origin @@ -382,10 +338,13 @@ function prepareProxy(proxy, appPublicFolder) { proxyReq.setHeader('origin', target); } }, - target, onError: onProxyError(target), - }); - }); + secure: false, + changeOrigin: true, + ws: true, + xfwd: true, + }, + ]; } function choosePort(host, defaultPort) {