diff --git a/desktop/app/src/dispatcher/metroDevice.tsx b/desktop/app/src/dispatcher/metroDevice.tsx index 189da42e3..1cff56c81 100644 --- a/desktop/app/src/dispatcher/metroDevice.tsx +++ b/desktop/app/src/dispatcher/metroDevice.tsx @@ -13,9 +13,10 @@ import MetroDevice from '../devices/MetroDevice'; import http from 'http'; import {addErrorNotification} from '../reducers/notifications'; import {destroyDevice} from '../reducers/connections'; +import {parseEnvironmentVariableAsNumber} from '../utils/environmentVariables'; -const METRO_PORT = 8081; const METRO_HOST = 'localhost'; +const METRO_PORT = parseEnvironmentVariableAsNumber('METRO_SERVER_PORT', 8081); const METRO_URL = `http://${METRO_HOST}:${METRO_PORT}`; const METRO_LOGS_ENDPOINT = `ws://${METRO_HOST}:${METRO_PORT}/events`; const METRO_MESSAGE = ['React Native packager is running', 'Metro is running']; diff --git a/desktop/app/src/utils/adbConfig.tsx b/desktop/app/src/utils/adbConfig.tsx index 7e97bcb79..c0fe072f0 100644 --- a/desktop/app/src/utils/adbConfig.tsx +++ b/desktop/app/src/utils/adbConfig.tsx @@ -7,13 +7,13 @@ * @format */ +import {parseEnvironmentVariableAsNumber} from './environmentVariables'; + export default () => { - const serverPortString = process.env.ANDROID_ADB_SERVER_PORT; - let port = 5037; - if (serverPortString) { - const parsedInt = parseInt(serverPortString, 10); - port = isNaN(parsedInt) ? port : parsedInt; - } + let port = parseEnvironmentVariableAsNumber( + 'ANDROID_ADB_SERVER_PORT', + 5037, + ) as number; let host = 'localhost'; diff --git a/desktop/app/src/utils/environmentVariables.tsx b/desktop/app/src/utils/environmentVariables.tsx index 640413c7c..a77591ee8 100644 --- a/desktop/app/src/utils/environmentVariables.tsx +++ b/desktop/app/src/utils/environmentVariables.tsx @@ -25,3 +25,15 @@ export function parseFlipperPorts( }; } } + +export function parseEnvironmentVariableAsNumber( + envVarName: string, + defaultValue?: number, +): number | undefined { + const envVarAsString = process.env[envVarName]; + if (envVarAsString) { + const parsedInt = parseInt(envVarAsString, 10); + return isNaN(parsedInt) ? defaultValue : parsedInt; + } + return defaultValue; +} diff --git a/desktop/plugins/hermesdebuggerrn/index.tsx b/desktop/plugins/hermesdebuggerrn/index.tsx index 39dd02ba0..3aa954040 100644 --- a/desktop/plugins/hermesdebuggerrn/index.tsx +++ b/desktop/plugins/hermesdebuggerrn/index.tsx @@ -23,7 +23,10 @@ import ErrorScreen from './ErrorScreen'; import ChromeDevTools from './ChromeDevTools'; const POLL_SECS = 5 * 1000; -const METRO_HOST = 'http://localhost:8081'; +const METRO_PORT_ENV_VAR = process.env.METRO_SERVER_PORT || '8081'; +const METRO_PORT = isNaN(+METRO_PORT_ENV_VAR) ? '8081' : METRO_PORT_ENV_VAR; +const METRO_URL = new URL('http://localhost'); +METRO_URL.port = METRO_PORT; export type Target = Readonly<{ id: string; @@ -87,7 +90,7 @@ export default class extends FlipperDevicePlugin { } checkDebugTargets = () => { - fetch(`${METRO_HOST}/json`) + fetch(`${METRO_URL.toString()}json`) .then((res) => res.json()) .then( (result) => { diff --git a/docs/custom-ports.mdx b/docs/custom-ports.mdx index e1a410932..55f2048db 100644 --- a/docs/custom-ports.mdx +++ b/docs/custom-ports.mdx @@ -4,6 +4,8 @@ title: Running Flipper with different ports sidebar_label: Using different ports --- +## FLIPPER ports + By default Flipper runs its servers on ports 8088 and 8089, and the mobile SDKs look for servers on those ports. Each of these can be overridden by setting an environment variable, with the format `${INSECURE_PORT},${SECURE_PORT}`. @@ -21,3 +23,19 @@ adb shell su 0 setprop flipper.ports 1111,2222 ``` To configure the iOS SDK for custom ports, set the FLIPPER_PORTS environment variable in your app launch script. + +## METRO SERVER PORTS + +You can also setup Flipper to use a different Metro Server port (default=8081) using this environement variable: + +``` +METRO_SERVER_PORT=3333 ./flipper +``` + +## ADB REVERSE PROXY PORTS + +And setup a different ADB port used for reverse proxying when plugged through USB (default=5037) using: + +``` +ANDROID_ADB_SERVER_PORT=4444 ./flipper +```