Server.open can not be opened with default Network url

[thjjames]

Description

server: {
host: '0.0.0.0',
port: 8080,
open: true,
}

when i run-script 'pnpm run dev', get 'http://localhost:8080/' in my default browser but not 'http://10.23.44.14:8080/'

Suggested solution

provide additional Server param to support default network url like 'http://10.23.44.14:8080/' in my browser.

Alternative

No response

Additional context

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that request the same feature to avoid creating a duplicate.

[bluwy]

You can pass a string to server.open to point to the network url.

[thjjames]

You can pass a string to server.open to point to the network url.

how to do that? I could not find any api in 'https://github.com/sindresorhus/open' to satisfy.

[bluwy]

It's in the Vite docs: https://vitejs.dev/config/server-options.html#server-open

server: {
  open: 'http://10.23.44.14:8080/'
}

[bluwy]

I guess thinking about it, you might not want the network url to not be hardcoded. You can try to resolve the 0.0.0.0 in your Vite config, then pass the resolved host to construct the url though.

[thjjames]

It's in the Vite docs: https://vitejs.dev/config/server-options.html#server-open

server: {
  open: 'http://10.23.44.14:8080/'
}

I can't do this cause its a public project and someone else's ip must not be 10.23.44.14.
It's too complicated to resolve the 0.0.0.0 host in my Vite config, so i wanna an additional Server param to solve.

[bluwy]

I'll re-open for now if anyone has ideas to supporting this. We usually avoid adding new options unless if there's a large usecase. I'm thinking maybe we can flip this part

vite/packages/vite/src/node/server/index.ts

Lines 484 to 487 in 2687dbb

	openBrowser() {
	const options = server.config.server
	const url =
	server.resolvedUrls?.local[0] ?? server.resolvedUrls?.network[0]

so that network URLs are checked first before the local URLs, and that might be good enough, but it's a breaking change.

[thjjames]

I'll re-open for now if anyone has ideas to supporting this. We usually avoid adding new options unless if there's a large usecase. I'm thinking maybe we can flip this part

vite/packages/vite/src/node/server/index.ts

Lines 484 to 487 in 2687dbb

	openBrowser() {
	const options = server.config.server
	const url =
	server.resolvedUrls?.local[0] ?? server.resolvedUrls?.network[0]

so that network URLs are checked first before the local URLs, and that might be good enough, but it's a breaking change.

I think its a good idea to raise the network's priority, just like server.resolvedUrls?.network[0] ?? server.resolvedUrls?.local[0]. Because 'localhost' may be set as proxy and local-ip may not. I can understand that its really a breaking change.
In webpack5, '10.23.44.14' is opened in browser if host is set to be 'local-ip'. So should we add the additional value 'local-ip' in Server.host?

[sapphi-red]

http://localhost:5173 is considered secure but http://10.x.x.x:5173 are not (the article only mentions about Firefox, but Chrome work the same). This could be a problem.

BTW why does opening the remote URL with the browser work for you? I guess you are setting host: true so that you can access the server from a different machine (or outside the virtual machine/container). In that case, Vite cannot open the browser in that machine. If you want to open it in the local machine, then why don't opening the local URL work? Is the localhost taken over by a different program?

[thjjames]

http://localhost:5173 is considered secure but http://10.x.x.x:5173 are not (the article only mentions about Firefox, but Chrome work the same). This could be a problem.

BTW why does opening the remote URL with the browser work for you? I guess you are setting host: true so that you can access the server from a different machine (or outside the virtual machine/container). In that case, Vite cannot open the browser in that machine. If you want to open it in the local machine, then why don't opening the local URL work? Is the localhost taken over by a different program?

Cause 'localhost' is set as proxy in all the company's computers for a certain purpose.
In some scenarios, e.g. if someone want use my local env to joint debug, network url in browser is more convenient to copy with.

[hi-ogawa]

It's too complicated to resolve the 0.0.0.0 host in my Vite config, so i wanna an additional Server param to solve.

Based on Vite's resolveServerUrls:

vite/packages/vite/src/node/utils.ts

Lines 998 to 1020 in 5684fcd

	Object.values(os.networkInterfaces())
	.flatMap((nInterface) => nInterface ?? [])
	.filter(
	(detail) =>
	detail &&
	detail.address &&
	(detail.family === 'IPv4' ||
	// @ts-expect-error Node 18.0 - 18.3 returns number
	detail.family === 4),
	)
	.forEach((detail) => {
	let host = detail.address.replace('127.0.0.1', hostname.name)
	// ipv6 host
	if (host.includes(':')) {
	host = `[${host}]`
	}
	const url = `${protocol}://${host}:${port}${base}`
	if (detail.address.includes('127.0.0.1')) {
	local.push(url)
	} else {
	network.push(url)
	}
	})

this seems possible to achieve in one liner though this might be still too ugly to have in vite config...

export default defineConfig({
  server: {
    open: true,
    host: Object.values((await import("os")).networkInterfaces()).flat().filter(e => String(e.family).includes("4") && !e.address.includes("127.0.0.1"))[0].address
  },
})