[Staging API] To Use Staging Server or not to use staging server

config/webpack/webpack.dev.js

@@ -21,6 +21,8 @@ module.exports = (env = {}) => portfinder.getPortPromise({port: BASE_PORT})
             : {
                 proxy: {
                     '/api': 'http://[::1]:9000',
+                    '/staging-api': 'http://[::1]:9000',
+                    '/staging-secure-api': 'http://[::1]:9000',
                     '/chat-attachments': 'http://[::1]:9000',
                 },
             };

src/CONST.js

@@ -1189,6 +1189,10 @@ const CONST = {
         SAMPLE_INPUT: '123456.789',
         EXPECTED_OUTPUT: 'FCFA 123,457',
     },
+    API_MAP: {
+        STAGING: 'staging-',
+        STAGING_SECURE: 'staging-secure-',
+    },
 };
 
 export default CONST;

src/libs/HttpUtils.js

@@ -5,7 +5,6 @@ import CONFIG from '../CONFIG';
 import CONST from '../CONST';
 import ONYXKEYS from '../ONYXKEYS';
 import HttpsError from './Errors/HttpsError';
-import shouldUseStagingServer from './shouldUseStagingServer';
 import getPlatform from './getPlatform';
 
 // Desktop and web use staging config too so we we should default to staging API endpoint if on those platforms
@@ -109,10 +108,14 @@ function xhr(command, data, type = CONST.NETWORK.METHOD.POST, shouldUseSecure =
 
     let apiRoot = shouldUseSecure ? CONFIG.EXPENSIFY.SECURE_EXPENSIFY_URL : CONFIG.EXPENSIFY.URL_API_ROOT;
 
-    if (shouldUseStagingServer(stagingServerToggleState)) {
-        apiRoot = shouldUseSecure ? CONFIG.EXPENSIFY.STAGING_SECURE_EXPENSIFY_URL : CONFIG.EXPENSIFY.STAGING_EXPENSIFY_URL;
+    if (stagingServerToggleState) {
+        // If web proxy is used, URL will always be /
+        if (CONFIG.EXPENSIFY.URL_API_ROOT === '/') {
+            apiRoot += shouldUseSecure ? CONST.API_MAP.STAGING_SECURE : CONST.API_MAP.STAGING;
+        } else {
+            apiRoot = shouldUseSecure ? CONFIG.EXPENSIFY.STAGING_SECURE_EXPENSIFY_URL : CONFIG.EXPENSIFY.STAGING_EXPENSIFY_URL;
+        }
     }
-
     return processHTTPRequest(`${apiRoot}api?command=${command}`, type, formData, data.canCancel);
 }
 

web/proxy.js

@@ -1,21 +1,23 @@
 const http = require('http');
 const https = require('https');
+const lodashGet = require('lodash/get');
 require('dotenv').config();
 
 if (process.env.USE_WEB_PROXY === 'false') {
     process.stdout.write('Skipping proxy as USE_WEB_PROXY was set to false.\n');
     process.exit();
 }
 
-let host = 'www.expensify.com';
-
-// If we are testing against the staging API then we must use the correct host here or nothing with work.
-if (/staging/.test(process.env.EXPENSIFY_URL)) {
-    host = 'staging.expensify.com';
-}
+const host = new URL(lodashGet(process.env.EXPENSIFY_URL, 'EXPENSIFY_URL', 'https://www.expensify.com')).hostname;
+const stagingHost = new URL(lodashGet(process.env.STAGING_EXPENSIFY_URL, 'STAGING_EXPENSIFY_URL', 'https://staging.expensify.com')).hostname;
+const stagingSecureHost = new URL(lodashGet(process.env.STAGING_SECURE_EXPENSIFY_URL, 'STAGING_SECURE_EXPENSIFY_URL', 'https://staging-secure.expensify.com')).hostname;
+const HOST_MAP = {
+    'staging-api': stagingHost,
+    'staging-secure-api': stagingSecureHost,
+};
 
 // eslint-disable-next-line no-console
-console.log(`Creating proxy with host: ${host}`);
+console.log(`Creating proxy with host: ${host} for production API and ${stagingHost} for staging API`);
 
 /**
  * Local proxy server that hits the production endpoint
@@ -24,13 +26,30 @@ console.log(`Creating proxy with host: ${host}`);
  * environment that has no local API.
  */
 const server = http.createServer((request, response) => {
+    let hostname = host;
+    let requestPath = request.url;
+
+    // regex not declared globally to avoid internal regex pointer reset for each request
+    // We only match for staging related root since default host is prod
+    const apiRegex = /\/(staging.*api)/g;
+    const apiRootMatch = apiRegex.exec(request.url);
+
+    // Switch host only if API call, not on chat attachments
+    if (apiRootMatch) {
+        const apiRoot = apiRootMatch[1];
+        hostname = HOST_MAP[apiRoot];
+
+        // replace the mapping url with the actual path
+        requestPath = request.url.replace(apiRoot, 'api');
+    }
     const proxyRequest = https.request({
-        hostname: host,
+        hostname,
         method: 'POST',
-        path: request.url,
+
+        path: requestPath,
         headers: {
             ...request.headers,
-            host,
+            host: hostname,
             'user-agent': request.headers['user-agent'].concat(' Development-NewDot/1.0'),
         },
         port: 443,