Repository navigation
Wrong HOST is shown in the console #9119
Description
Describe the bug
$ cat .env
BROWSER=false
PORT=8080
HOST=0.0.0.0
SKIP_PREFLIGHT_CHECK=true
$ cat package.json | grep react-scripts
"react-scripts": "3.4.1",After start it still shows localhost:
Starting the development server...
Compiled successfully!
You can now view test in the browser.
Local: http://localhost:8080
On Your Network: http://172.30.0.6:8080
Note that the development build is not optimized.
To create a production build, use npm run build.
Did you try recovering your dependencies?
No.
Which terms did you search for in User Guide?
https://github.com/facebook/create-react-app/issues?q=%22On+Your+Network%3A%22+host
Environment
Environment Info:
current version of create-react-app: 3.4.1
running from /home/redacted/.npm/_npx/18523/pnpm-global/4/node_modules/.pnpm/create-react-app@3.4.1/node_modules/create-react-app
System:
OS: Linux 4.15 Ubuntu 18.04.3 LTS (Bionic Beaver)
CPU: (8) x64 Intel(R) Xeon(R) CPU E3-1246 v3 @ 3.50GHz
Binaries:
Node: 12.17.0 - ~/.nvm/versions/node/v12.17.0/bin/node
Yarn: 1.22.4 - ~/.yvm/shim/yarn
npm: 6.14.4 - ~/.nvm/versions/node/v12.17.0/bin/npm
Browsers:
Chrome: 81.0.4044.138
Firefox: Not Found
npmPackages:
react: 16.13.1 => 16.13.1
react-dom: 16.13.1 => 16.13.1
react-scripts: 3.4.1 => 3.4.1
npmGlobalPackages:
create-react-app: Not Found
Steps to reproduce
(Write your steps here:)
Expected behavior
It shows 0.0.0.0:
Starting the development server...
Compiled successfully!
You can now view test in the browser.
Local: http://0.0.0.0:8080
On Your Network: http://172.30.0.6:8080
Note that the development build is not optimized.
To create a production build, use npm run build.
Actual behavior
It shows always localhost.
Reproducible demo
(Paste the link to an example project and exact instructions to reproduce the issue.)
Activity
Bessonov commentedon Jun 6, 2020
Why this is important? We use OAuth2 (callback url) and CORS, which are set to 0.0.0.0:8080. The localhost message is very misleading and if someone try to use localhost, they lose time to debug a non-existing problem.
petetnt commentedon Jun 10, 2020
There's an explicit check for prettifying the value in
https://github.com/facebook/create-react-app/blob/f5c3bdb65480f93b2d4a4c2f3214fc50753de434/packages/react-dev-utils/WebpackDevServerUtils.js#L41-L43
Changing this to
could be a fix
eddiemonge commentedon Jun 12, 2020
This is the correct output.
0.0.0.0is not an actual IP address. It means listen on all hosts that come into this machine, whether that islocalhostfor you or172.30.0.6for people not on your machine. You should not be setting0.0.0.0for OAuth as like I said, it isn't an actual IP address.Look at the output you gave:
Local is for you on your computer. On your network is for everyone else.
geowasim commentedon Aug 22, 2020
I have similar issue ,
data from console before a time
now in the console
I don't know how it change but I noticed it 3 days ago
from my phone on the same network
the old localhost still working http://192.168.0:66:3000
previously I was accessing my projects from other devices (phone) on the same network at http://192.168.0.66:3000 (till now It's still accessable ) but the link that gave me from the console (http://192.168.137.1:3000) is not accessable for other devices anymore only from the same device I work on
if i create any new react app I get the same issue
the host that given from the console is unknow for other devices
I checked the ping from another phone
in short: the localhost that given by create-react-app and should be accessable on the same network is unknow
for other devices