From d6bbe273fbffee2427f11493cb21a84db4e183e6 Mon Sep 17 00:00:00 2001 From: Chulki Lee Date: Wed, 23 Dec 2020 12:08:45 +0900 Subject: [PATCH 1/2] Fix hostname message in dev/start --- packages/next/cli/next-dev.ts | 11 ++++------- packages/next/cli/next-start.ts | 9 ++++----- test/integration/cli/test/index.test.js | 6 +++--- 3 files changed, 11 insertions(+), 15 deletions(-) diff --git a/packages/next/cli/next-dev.ts b/packages/next/cli/next-dev.ts index 1190a89f9fa9873..254041a6ca68d34 100755 --- a/packages/next/cli/next-dev.ts +++ b/packages/next/cli/next-dev.ts @@ -43,7 +43,7 @@ const nextDev: cliCommand = (argv) => { Options --port, -p A port number on which to start the application - --hostname, -H Hostname on which to start the application + --hostname, -H Hostname on which to start the application (default: 0.0.0.0) --help, -h Displays this message `) process.exit(0) @@ -106,13 +106,10 @@ const nextDev: cliCommand = (argv) => { } const port = args['--port'] || 3000 - const appUrl = `http://${args['--hostname'] || 'localhost'}:${port}` + const host = args['--hostname'] || '0.0.0.0' + const appUrl = `http://${host}:${port}` - startServer( - { dir, dev: true, isNextDevCommand: true }, - port, - args['--hostname'] - ) + startServer({ dir, dev: true, isNextDevCommand: true }, port, host) .then(async (app) => { startedDevelopmentServer(appUrl) // Start preflight after server is listening and ignore errors: diff --git a/packages/next/cli/next-start.ts b/packages/next/cli/next-start.ts index d84e04ebada2e07..cbcf58f5f151494 100755 --- a/packages/next/cli/next-start.ts +++ b/packages/next/cli/next-start.ts @@ -42,7 +42,7 @@ const nextStart: cliCommand = (argv) => { Options --port, -p A port number on which to start the application - --hostname, -H Hostname on which to start the application + --hostname, -H Hostname on which to start the application (default: 0.0.0.0) --help, -h Displays this message `) process.exit(0) @@ -50,11 +50,10 @@ const nextStart: cliCommand = (argv) => { const dir = resolve(args._[0] || '.') const port = args['--port'] || 3000 - startServer({ dir }, port, args['--hostname']) + const host = args['--hostname'] || '0.0.0.0' + startServer({ dir }, port, host) .then(async (app) => { - Log.ready( - `started server on http://${args['--hostname'] || 'localhost'}:${port}` - ) + Log.ready(`started server on http://${host}:${port}`) await app.prepare() }) .catch((err) => { diff --git a/test/integration/cli/test/index.test.js b/test/integration/cli/test/index.test.js index a916e79f16c7cfe..fee0ea531ef310f 100644 --- a/test/integration/cli/test/index.test.js +++ b/test/integration/cli/test/index.test.js @@ -204,7 +204,7 @@ describe('CLI Usage', () => { test('--port', async () => { const port = await findPort() const output = await runNextCommandDev([dir, '--port', port], true) - expect(output).toMatch(new RegExp(`http://localhost:${port}`)) + expect(output).toMatch(new RegExp(`http://0.0.0.0:${port}`)) }) test("NODE_OPTIONS='--inspect'", async () => { @@ -214,13 +214,13 @@ describe('CLI Usage', () => { const output = await runNextCommandDev([dir, '--port', port], true, { env: { NODE_OPTIONS: '--inspect' }, }) - expect(output).toMatch(new RegExp(`http://localhost:${port}`)) + expect(output).toMatch(new RegExp(`http://0.0.0.0:${port}`)) }) test('-p', async () => { const port = await findPort() const output = await runNextCommandDev([dir, '-p', port], true) - expect(output).toMatch(new RegExp(`http://localhost:${port}`)) + expect(output).toMatch(new RegExp(`http://0.0.0.0:${port}`)) }) test('-p conflict', async () => { From 22c49a7287f46db8541f596292674fd5bc1c1d24 Mon Sep 17 00:00:00 2001 From: Chulki Lee Date: Wed, 20 Jan 2021 09:38:01 +0900 Subject: [PATCH 2/2] Use localhost in CLI output when binding to 0.0.0.0 --- packages/next/build/output/index.ts | 4 ++-- packages/next/build/output/store.ts | 14 +++++++++----- packages/next/cli/next-dev.ts | 4 ++-- packages/next/cli/next-start.ts | 3 ++- test/integration/cli/test/index.test.js | 15 ++++++++++----- 5 files changed, 25 insertions(+), 15 deletions(-) diff --git a/packages/next/build/output/index.ts b/packages/next/build/output/index.ts index 1fabdd57971728b..3a89f3b99fa6586 100644 --- a/packages/next/build/output/index.ts +++ b/packages/next/build/output/index.ts @@ -5,8 +5,8 @@ import createStore from 'next/dist/compiled/unistore' import formatWebpackMessages from '../../client/dev/error-overlay/format-webpack-messages' import { OutputState, store as consoleStore } from './store' -export function startedDevelopmentServer(appUrl: string) { - consoleStore.setState({ appUrl }) +export function startedDevelopmentServer(appUrl: string, bindAddr: string) { + consoleStore.setState({ appUrl, bindAddr }) } let previousClient: import('webpack').Compiler | null = null diff --git a/packages/next/build/output/store.ts b/packages/next/build/output/store.ts index e7bb6734ee503e2..12dbf11647e8f0a 100644 --- a/packages/next/build/output/store.ts +++ b/packages/next/build/output/store.ts @@ -4,8 +4,8 @@ import stripAnsi from 'next/dist/compiled/strip-ansi' import * as Log from './log' export type OutputState = - | { bootstrap: true; appUrl: string | null } - | ({ bootstrap: false; appUrl: string | null } & ( + | { bootstrap: true; appUrl: string | null; bindAddr: string | null } + | ({ bootstrap: false; appUrl: string | null; bindAddr: string | null } & ( | { loading: true } | { loading: false @@ -15,9 +15,13 @@ export type OutputState = } )) -export const store = createStore({ appUrl: null, bootstrap: true }) +export const store = createStore({ + appUrl: null, + bindAddr: null, + bootstrap: true, +}) -let lastStore: OutputState = { appUrl: null, bootstrap: true } +let lastStore: OutputState = { appUrl: null, bindAddr: null, bootstrap: true } function hasStoreChanged(nextStore: OutputState) { if ( ([ @@ -40,7 +44,7 @@ store.subscribe((state) => { if (state.bootstrap) { if (state.appUrl) { - Log.ready(`started server on ${state.appUrl}`) + Log.ready(`started server on ${state.bindAddr}, url: ${state.appUrl}`) } return } diff --git a/packages/next/cli/next-dev.ts b/packages/next/cli/next-dev.ts index 254041a6ca68d34..a4c09d2c69b77d3 100755 --- a/packages/next/cli/next-dev.ts +++ b/packages/next/cli/next-dev.ts @@ -107,11 +107,11 @@ const nextDev: cliCommand = (argv) => { const port = args['--port'] || 3000 const host = args['--hostname'] || '0.0.0.0' - const appUrl = `http://${host}:${port}` + const appUrl = `http://${host === '0.0.0.0' ? 'localhost' : host}:${port}` startServer({ dir, dev: true, isNextDevCommand: true }, port, host) .then(async (app) => { - startedDevelopmentServer(appUrl) + startedDevelopmentServer(appUrl, `${host}:${port}`) // Start preflight after server is listening and ignore errors: preflight().catch(() => {}) // Finalize server bootup: diff --git a/packages/next/cli/next-start.ts b/packages/next/cli/next-start.ts index cbcf58f5f151494..72a5b09d2ab0a3c 100755 --- a/packages/next/cli/next-start.ts +++ b/packages/next/cli/next-start.ts @@ -51,9 +51,10 @@ const nextStart: cliCommand = (argv) => { const dir = resolve(args._[0] || '.') const port = args['--port'] || 3000 const host = args['--hostname'] || '0.0.0.0' + const appUrl = `http://${host === '0.0.0.0' ? 'localhost' : host}:${port}` startServer({ dir }, port, host) .then(async (app) => { - Log.ready(`started server on http://${host}:${port}`) + Log.ready(`started server on ${host}:${port}, url: ${appUrl}`) await app.prepare() }) .catch((err) => { diff --git a/test/integration/cli/test/index.test.js b/test/integration/cli/test/index.test.js index fee0ea531ef310f..79b112712de1adf 100644 --- a/test/integration/cli/test/index.test.js +++ b/test/integration/cli/test/index.test.js @@ -204,7 +204,8 @@ describe('CLI Usage', () => { test('--port', async () => { const port = await findPort() const output = await runNextCommandDev([dir, '--port', port], true) - expect(output).toMatch(new RegExp(`http://0.0.0.0:${port}`)) + expect(output).toMatch(new RegExp(`on 0.0.0.0:${port}`)) + expect(output).toMatch(new RegExp(`http://localhost:${port}`)) }) test("NODE_OPTIONS='--inspect'", async () => { @@ -214,13 +215,15 @@ describe('CLI Usage', () => { const output = await runNextCommandDev([dir, '--port', port], true, { env: { NODE_OPTIONS: '--inspect' }, }) - expect(output).toMatch(new RegExp(`http://0.0.0.0:${port}`)) + expect(output).toMatch(new RegExp(`on 0.0.0.0:${port}`)) + expect(output).toMatch(new RegExp(`http://localhost:${port}`)) }) test('-p', async () => { const port = await findPort() const output = await runNextCommandDev([dir, '-p', port], true) - expect(output).toMatch(new RegExp(`http://0.0.0.0:${port}`)) + expect(output).toMatch(new RegExp(`on 0.0.0.0:${port}`)) + expect(output).toMatch(new RegExp(`http://localhost:${port}`)) }) test('-p conflict', async () => { @@ -262,7 +265,8 @@ describe('CLI Usage', () => { [dir, '--hostname', '0.0.0.0', '--port', port], true ) - expect(output).toMatch(new RegExp(`http://0.0.0.0:${port}`)) + expect(output).toMatch(new RegExp(`on 0.0.0.0:${port}`)) + expect(output).toMatch(new RegExp(`http://localhost:${port}`)) }) test('-H', async () => { @@ -271,7 +275,8 @@ describe('CLI Usage', () => { [dir, '-H', '0.0.0.0', '--port', port], true ) - expect(output).toMatch(new RegExp(`http://0.0.0.0:${port}`)) + expect(output).toMatch(new RegExp(`on 0.0.0.0:${port}`)) + expect(output).toMatch(new RegExp(`http://localhost:${port}`)) }) test('should warn when unknown argument provided', async () => {