From 4412385d71185b5ec90a6d2660ce08ef2eba61a2 Mon Sep 17 00:00:00 2001
From: Ian Sutherland <ian@iansutherland.ca>
Date: Wed, 17 Jan 2018 16:24:45 -0700
Subject: [PATCH] Replace advanced proxy with user provided proxy.js (#3366)

---
 .../react-dev-utils/WebpackDevServerUtils.js  | 75 +++++++------------
 packages/react-scripts/scripts/start.js       |  2 +-
 2 files changed, 27 insertions(+), 50 deletions(-)

diff --git a/packages/react-dev-utils/WebpackDevServerUtils.js b/packages/react-dev-utils/WebpackDevServerUtils.js
index 1208d7fc776..14dfdf43340 100644
--- a/packages/react-dev-utils/WebpackDevServerUtils.js
+++ b/packages/react-dev-utils/WebpackDevServerUtils.js
@@ -263,36 +263,47 @@ function onProxyError(proxy) {
   };
 }
 
-function prepareProxy(proxy, appPublicFolder) {
-  // `proxy` lets you specify alternate servers for specific requests.
-  // It can either be a string or an object conforming to the Webpack dev server proxy configuration
-  // https://webpack.github.io/docs/webpack-dev-server.html
-  if (!proxy) {
-    return undefined;
-  }
-  if (typeof proxy !== 'object' && typeof proxy !== 'string') {
+function prepareProxy(proxy, paths) {
+  // `proxy` lets you specify an alternate server for non-asset requests.
+  if (typeof proxy !== 'string' && proxy !== undefined) {
     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 + '".')
     );
+    if (typeof proxy === 'object') {
+      console.log(
+        chalk.red('Proxy object is no longer supported. Use proxy.js instead.')
+      );
+    }
     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);
   }
 
   // Otherwise, if proxy is specified, we will let it handle any request except for files in the public folder.
   function mayProxy(pathname) {
-    const maybePublicPath = path.resolve(appPublicFolder, pathname.slice(1));
+    const maybePublicPath = path.resolve(paths.appPublic, pathname.slice(1));
     return !fs.existsSync(maybePublicPath);
   }
 
+  function proxyFileExists() {
+    return fs.existsSync(path.resolve(paths.appPath, 'proxy.js'));
+  }
+
+  if (proxyFileExists()) {
+    if (typeof proxy === 'string') {
+      console.log(
+        chalk.red('proxy.js found, ignoring "proxy" in package.json')
+      );
+    }
+
+    const getProxyConfig = require(path.resolve(paths.appPath, 'proxy.js'));
+    return getProxyConfig(paths, resolveLoopback, mayProxy, onProxyError);
+  }
+
   // Support proxy as a string for those who are using the simple proxy option
   if (typeof proxy === 'string') {
     if (!/^http(s)?:\/\//.test(proxy)) {
@@ -348,40 +359,6 @@ function prepareProxy(proxy, appPublicFolder) {
       },
     ];
   }
-
-  // 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);
-      },
-      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);
-        }
-      },
-      target,
-      onError: onProxyError(target),
-    });
-  });
 }
 
 function choosePort(host, defaultPort) {
diff --git a/packages/react-scripts/scripts/start.js b/packages/react-scripts/scripts/start.js
index 0e9e8b4e118..7a5a8ab40d2 100644
--- a/packages/react-scripts/scripts/start.js
+++ b/packages/react-scripts/scripts/start.js
@@ -94,7 +94,7 @@ checkBrowsers(paths.appPath)
     const compiler = createCompiler(webpack, config, appName, urls, useYarn);
     // Load proxy config
     const proxySetting = require(paths.appPackageJson).proxy;
-    const proxyConfig = prepareProxy(proxySetting, paths.appPublic);
+    const proxyConfig = prepareProxy(proxySetting, paths);
     // Serve webpack assets generated by the compiler over a web sever.
     const serverConfig = createDevServerConfig(
       proxyConfig,