Merge pull request #3000 from remotion-dev/port-selection

JonnyBurger · web-flow · commit 570cd57e6cb7 · 2023-10-11T15:54:25.000+02:00
diff --git a/packages/cli/src/preview-server/start-server.ts b/packages/cli/src/preview-server/start-server.ts
@@ -109,12 +109,24 @@ export const startServer = async (options: {
 		undefined;
 
 	const maxTries = 5;
+
+	// Default Node.js host, but explicity
+	const host = '0.0.0.0';
+
 	for (let i = 0; i < maxTries; i++) {
 		try {
 			const selectedPort = await new Promise<number>((resolve, reject) => {
-				RenderInternals.getDesiredPort(desiredPort, 3000, 3100)
+				RenderInternals.getDesiredPort({
+					desiredPort,
+					from: 3000,
+					to: 3100,
+					hostsToTry: ['127.0.0.1', '0.0.0.0'],
+				})
 					.then(({port, didUsePort}) => {
-						server.listen(port);
+						server.listen({
+							port,
+							host,
+						});
 						server.on('listening', () => {
 							resolve(port);
 							return didUsePort();
diff --git a/packages/renderer/src/get-port.ts b/packages/renderer/src/get-port.ts
@@ -1,11 +1,18 @@
 import net from 'net';
 import {createLock} from './locks';
 
-const getAvailablePort = (portToTry: number) =>
-	new Promise<'available' | 'unavailable'>((resolve) => {
-		let status: 'available' | 'unavailable' = 'unavailable';
+type PortStatus = 'available' | 'unavailable';
+
+const isPortAvailableOnHost = ({
+	portToTry,
+	host,
+}: {
+	portToTry: number;
+	host: string;
+}): Promise<PortStatus> => {
+	return new Promise<PortStatus>((resolve) => {
+		let status: PortStatus = 'unavailable';
 
-		const host = '127.0.0.1';
 		const socket = new net.Socket();
 
 		socket.on('connect', () => {
@@ -28,12 +35,42 @@ const getAvailablePort = (portToTry: number) =>
 
 		socket.connect(portToTry, host);
 	});
+};
+
+export const testPortAvailableOnMultipleHosts = async ({
+	hosts,
+	port,
+}: {
+	port: number;
+	hosts: string[];
+}): Promise<PortStatus> => {
+	const results = await Promise.all(
+		hosts.map((host) => {
+			return isPortAvailableOnHost({portToTry: port, host});
+		}),
+	);
+
+	return results.every((r) => r === 'available') ? 'available' : 'unavailable';
+};
 
-const getPort = async (from: number, to: number) => {
+const getPort = async ({
+	from,
+	to,
+	hostsToTest,
+}: {
+	from: number;
+	to: number;
+	hostsToTest: string[];
+}) => {
 	const ports = makeRange(from, to);
 
 	for (const port of ports) {
-		if ((await getAvailablePort(port)) === 'available') {
+		if (
+			(await testPortAvailableOnMultipleHosts({
+				port,
+				hosts: hostsToTest,
+			})) === 'available'
+		) {
 			return port;
 		}
 	}
@@ -43,22 +80,31 @@ const getPort = async (from: number, to: number) => {
 
 const portLocks = createLock({timeout: 10000});
 
-export const getDesiredPort = async (
-	desiredPort: number | undefined,
-	from: number,
-	to: number,
-) => {
+export const getDesiredPort = async ({
+	desiredPort,
+	from,
+	hostsToTry,
+	to,
+}: {
+	desiredPort: number | undefined;
+	from: number;
+	to: number;
+	hostsToTry: string[];
+}) => {
 	await portLocks.waitForAllToBeDone();
 	const lockPortSelection = portLocks.lock();
 	const didUsePort = () => portLocks.unlock(lockPortSelection);
 	if (
 		typeof desiredPort !== 'undefined' &&
-		(await getAvailablePort(desiredPort)) === 'available'
+		(await testPortAvailableOnMultipleHosts({
+			port: desiredPort,
+			hosts: ['0.0.0.0', '127.0.0.1'],
+		})) === 'available'
 	) {
 		return {port: desiredPort, didUsePort};
 	}
 
-	const actualPort = await getPort(from, to);
+	const actualPort = await getPort({from, to, hostsToTest: hostsToTry});
 
 	// If did specify a port but did not get that one, fail hard.
 	if (desiredPort && desiredPort !== actualPort) {
diff --git a/packages/renderer/src/serve-static.ts b/packages/renderer/src/serve-static.ts
@@ -70,12 +70,20 @@ export const serveStatic = async (
 	let selectedPort: number | null = null;
 
 	const maxTries = 5;
+
+	// Default Node.js host, but explicity
+	const host = '0.0.0.0';
 	for (let i = 0; i < maxTries; i++) {
 		try {
 			selectedPort = await new Promise<number>((resolve, reject) => {
-				getDesiredPort(options?.port ?? undefined, 3000, 3100)
+				getDesiredPort({
+					desiredPort: options?.port ?? undefined,
+					from: 3000,
+					to: 3100,
+					hostsToTry: ['0.0.0.0', '127.0.0.1'],
+				})
 					.then(({port, didUsePort}) => {
-						server.listen(port);
+						server.listen({port, host});
 						server.on('listening', () => {
 							resolve(port);
 							return didUsePort();
diff --git a/packages/renderer/src/test/port-selection.test.ts b/packages/renderer/src/test/port-selection.test.ts
@@ -4,8 +4,18 @@ import {getDesiredPort} from '../get-port';
 test('Port selection should only be freed once the previous result has been used', async () => {
 	let ports = 0;
 
-	const {port, didUsePort} = await getDesiredPort(undefined, 3100, 3200);
-	const secondPort = getDesiredPort(port, 3100, 3200).then(() => ports++);
+	const {port, didUsePort} = await getDesiredPort({
+		desiredPort: undefined,
+		from: 3100,
+		to: 3200,
+		hostsToTry: ['0.0.0.0', '127.0.0.1'],
+	});
+	const secondPort = getDesiredPort({
+		desiredPort: port,
+		from: 3100,
+		to: 3200,
+		hostsToTry: ['0.0.0.0', '127.0.0.1'],
+	}).then(() => ports++);
 
 	await new Promise<void>((resolve) => {
 		setTimeout(resolve, 2000);
