Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

set prettyHost to 0.0.0.0 instead of localhost #2960 #2970

Closed
wants to merge 1 commit into from
Closed

set prettyHost to 0.0.0.0 instead of localhost #2960 #2970

wants to merge 1 commit into from

Conversation

rdela
Copy link
Contributor

@rdela rdela commented Nov 20, 2017

in /packages/gatsby/src/commands/develop.js
L258-259

if (isUnspecifiedHost) {
  prettyHost = `0.0.0.0`

This resolves CORS blocking HMR by printing
Local: http://0.0.0.0:8000/
to the terminal after gatsby develop is run instead of
Local: http://localhost:8000/

This may not be ideal resolution of the issue and may break
something else. Perhaps a different, deeper fix is needed.
See testing comments in #2960.

Also in packages/gatsby-source-filesystem/index.js
L3

var fs = require(`fs-extra`);

got transformed to

const fs = require(`fs-extra`);

I am thinking during yarn bootstrap or gatsby-dev, still have 100%
tests passing as before and it’s late so gonna commit this and revisit
in the morning.

in /packages/gatsby/src/commands/develop.js
L258-259
```
if (isUnspecifiedHost) {
  prettyHost = `0.0.0.0`
```

This resolves CORS blocking HMR by printing
`Local:            http://0.0.0.0:8000/`
to the terminal after `gatsby develop` is run instead of
`Local:            http://localhost:8000/`

This may not be ideal resolution of the issue and may break
something else. Perhaps a different, deeper fix is needed.
See testing comments in #2960.

Also in packages/gatsby-source-filesystem/index.js
L3
```
var fs = require(`fs-extra`);
```
got transformed to
```
const fs = require(`fs-extra`);
```
I am thinking during `yarn bootstrap` or `gatsby-dev`, still have 100%
tests passing as before and it’s late so gonna commit this and revisit
in the morning.
@gatsbybot
Copy link
Collaborator

Deploy preview ready!

Built with commit dbc49d6

https://deploy-preview-2970--gatsbygram.netlify.com

@gatsbybot
Copy link
Collaborator

Deploy preview ready!

Built with commit dbc49d6

https://deploy-preview-2970--using-drupal.netlify.com

@KyleAMathews
Copy link
Contributor

Hey could you try this PR? Just published a new gatsby-cli & gatsby release #2983

@rdela
Copy link
Contributor Author

rdela commented Nov 21, 2017

Yes! Closing this one.

@rdela rdela closed this Nov 21, 2017
@rdela rdela deleted the develop-ip-localhost branch November 21, 2017 17:50
@bernhardw
Copy link

Since switching to 0.0.0.0 in the latest version of Gatsby, Google Chrome (Canary 64.0.3274.0) shows an uncaught DOMException from the service worker because 0.0.0.0 isn't in the list of "secure origins".

Uncaught (in promise) DOMException: Only secure origins are allowed (see: https://goo.gl/Y0ZkNV).

@KyleAMathews
Copy link
Contributor

Curious why you're loading a SW for development? Gatsby doesn't do this out-of-the-box.

@bernhardw
Copy link

Seems to be the SocketIO server for hot-loading. The error console shows the error here:

navigator.serviceWorker.getRegistrations().then(registrations => {

This is the stack trace:

0.0.0.0/:1 Uncaught (in promise) DOMException: Only secure origins are allowed (see: https://goo.gl/Y0ZkNV).
Promise rejected (async)
(anonymous) @ app.js:28
Promise resolved (async)
./.cache/app.js @ app.js:15
webpack_require @ bootstrap aa5d78ed28286e703547:555
fn @ bootstrap aa5d78ed28286e703547:86
0 @ index.js:176
webpack_require @ bootstrap aa5d78ed28286e703547:555
./node_modules/ansi-html/index.js.module.exports @ bootstrap aa5d78ed28286e703547:578
(anonymous) @ bootstrap aa5d78ed28286e703547:578

@sedubois
Copy link
Contributor

I have the same issue as #2970 (comment) since upgrading from [email protected] to [email protected].

@rdela
Copy link
Contributor Author

rdela commented Nov 27, 2017

Hi @sebdubois @bernhardw please see #2960 (comment) (and more recent) / #2983 (comment) (edit: updated link to correct comment) the decision now boils down to should we use localhost or 127.0.0.1 going forward on non-windows for default host to avoid these console errors (which did not break HMR in my Mac testing)

@sedubois
Copy link
Contributor

Yes my workaround is to replace Gatsby develop with Gatsby develop -H localhost, but I guess a proper fix is needed.

@pandorasNox
Copy link

I'm not sure if this is the right place to fit my comment in, but I thought it would fit:

I'm using gatsby-cli in a docker container, and in order to use it as development tool you normally would do something like:

docker run -it --rm -v $(pwd):/temp -p "8978:8000" gatsby develop

(assuming in $(pwd) is an gatsby project created with gatsby new - works btw fine with docker)

but this doesn't work (visiting localhost:8978 gets an ERR_EMPTY_RESPONSE)

In order to make this work you have to add -H 0.0.0.0 (took a while to figure this out, the idea I got from here)

final command looks like:
docker run -it --rm -p "8978:8000" -v $(pwd):/temp gatsby develop -H 0.0.0.0

"dependencies": {
"gatsby": "1.9.127",
"gatsby-link": "1.6.30",
"gatsby-plugin-react-helmet": "2.0.2"
},

You could check out the Dockerfile here

Maybe this is a special use-case and only for me interesting, but I thought I share this so it maybe could considered somehow.

@rdela
Copy link
Contributor Author

rdela commented Dec 8, 2017

@KyleAMathews Let me know if there is something I can do docs-wise to illuminate this and save people trouble, happy to PR

@lasseborly
Copy link

@pandorasNox have you gotten this to work with HMR ? I can't seem to make it work with a docker-compose setup with -H 0.0.0.0 and I can't access the site if I use -H localhost or -H 127.0.0.1

@pandorasNox
Copy link

@lasseborly unfortunately HMR wasn't working with this setup.

It would be awesome if we get this to work with docker.

Maybe this problem is more webpack related.

Could you share the docker-compose file?

@ujovlado
Copy link

@pandorasNox to make this work, do not change the port. HMR doesn't know about the port you chose.

This works for me:

version: "2"

services:

  node:
    build: .
    ports:
      - "8000:8000"
    volumes:
      - ./:/code
    working_dir: /code
    tty: true
    command: bash

Then, in container, run gatsby as you mentioned before:

gatsby develop -H 0.0.0.0

screenshot_2018-02-24_17-57-17

@pandorasNox
Copy link

pandorasNox commented Mar 5, 2018

@ujovlado hey thanks for your input, got HMR working

I used: docker run -it --rm -p 8978:8978 -v $(pwd):/temp gatsby develop -p 8978 -H 0.0.0.0

so the trick is (again thanks to @ujovlado ) to use the same ports in docker and in gatsby
for docker add: -p 8978:8978
for gatsby add: -p 8978

if your port 8000 is free the docker port part -p 8000:8000 is enough

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

8 participants