remotion icon indicating copy to clipboard operation
remotion copied to clipboard

Bug: distinction between 0.0.0.0 and localhost is not clear

Open Joshfindit opened this issue 3 years ago • 1 comments

Bug Report 🐛

  1. npm start shows Server running on http://localhost:3000
  2. The documentation has no mention of localhost or 0.0.0.0 (which is a shorthand for "all available IPv4 addresses")
  3. npm start actually binds to 0.0.0.0:3000
    • Pro: This allows us to access the web UI from another machine on the network. Especially necessary as there is no command similar to --bind 0.0.0.0:3000/--host 0.0.0.0.
    • Con: There's no indication that the port is accessible and this might be a security risk or against the local network's policy

While it is somewhat complex to solve the UX, I suggest keeping the current behaviour and changing the "Server running on http://localhost:3000" to iterate through all the IPs it's bound to.

Similar to:

Server running on http://0.0.0.0:3000
Available at
http://localhost:3000
http://192.168.0.52:3000
http://10.2.5.8

Far down the road, remotion could follow other JS projects like React, Vue, Flutter, etc and only bind to localhost (so not accessible externally) and allow the user to use one or more of the following:

  • HOST=0.0.0.0 npm run start # port defaults to value from getDesiredPort()
  • npm start --host 0.0.0.0 --port 3003
  • npm start --bind 0.0.0.0:3003
  • npm start --bind 0.0.0.0 # port defaults to value from getDesiredPort()

Joshfindit avatar Sep 08 '22 19:09 Joshfindit

Thanks for raising this, a good point! Few people ask for changing the network interface behavior so I agree it's better to more precisely output where it's listening.

I suggest keeping the current behaviour and changing the "Server running on http://localhost:3000/" to iterate through all the IPs it's bound to.

Do you have any expertise on how other projects achieve this?

JonnyBurger avatar Sep 10 '22 07:09 JonnyBurger

Fixing it by changing the wording from Server running on http://localhost:3000 to Server ready - Local: http://localhost:3000, Network: http://192.168.1.14:3000.

For me it seems like the right balance of being technically correct and being concise.

JonnyBurger avatar Oct 12 '22 15:10 JonnyBurger