I am having problems accessing a react container run with docker-compose inside docker-machine. I can curl the webpage inside the container, but I cannot access it inside docker-machine (or on the host's browser for that matter). The backend Golang container can be accessed from docker-machine and from the host's browser (as seen in the snippets, it returns a 404 not found).
In the docker-compose logs everything seems to be running smoothly, webpack-dev-server runs as expected, I just can't access it from outside the container.
I am using docker toolbox for windows.
Best to additionally describe the problem with some snippets.
Docker-compose file:
version: '2'
services:
postgres:
image: postgres
environment:
- POSTGRES_PASSWORD=postgres
server:
build: ./server
command: gin
volumes:
- ./server:/go/src/app
ports:
- "8080:3000"
environment:
- POSTGRES_PASSWORD=postgres
client:
build: ./client
command: npm start
volumes:
- ./client:/usr/src/app
# mount node_modules as a workaround for it disappearing
# after adding /client as a mounted folder
- /usr/src/app/node_modules
ports:
- "9000:3000"
Dockerfile for the node container:
FROM node:6.5.0-slim
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app
COPY package.json /usr/src/app/
ENV NODE_ENV development
RUN npm install
Output of the following commands inside docker-machine (default):
docker@default:~$ sudo iptables -t nat -L -n
Chain PREROUTING (policy ACCEPT)
target prot opt source destination
DOCKER all -- 0.0.0.0/0 0.0.0.0/0 ADDRTYPE match dst-type LOCAL
Chain INPUT (policy ACCEPT)
target prot opt source destination
Chain OUTPUT (policy ACCEPT)
target prot opt source destination
DOCKER all -- 0.0.0.0/0 !127.0.0.0/8 ADDRTYPE match dst-type LOCAL
Chain POSTROUTING (policy ACCEPT)
target prot opt source destination
MASQUERADE all -- 172.17.0.0/16 0.0.0.0/0
MASQUERADE all -- 172.19.0.0/16 0.0.0.0/0
MASQUERADE all -- 172.18.0.0/16 0.0.0.0/0
MASQUERADE tcp -- 172.19.0.2 172.19.0.2 tcp dpt:3000
MASQUERADE tcp -- 172.19.0.3 172.19.0.3 tcp dpt:3000
Chain DOCKER (2 references)
target prot opt source destination
RETURN all -- 0.0.0.0/0 0.0.0.0/0
RETURN all -- 0.0.0.0/0 0.0.0.0/0
RETURN all -- 0.0.0.0/0 0.0.0.0/0
DNAT tcp -- 0.0.0.0/0 0.0.0.0/0 tcp dpt:8080 to:172.19.0.2:3000
DNAT tcp -- 0.0.0.0/0 0.0.0.0/0 tcp dpt:9000 to:172.19.0.3:3000
Here comes the main problem:
docker@default:~$ curl 0.0.0.0:9000
curl: (52) Empty reply from server
docker@default:~$ curl 0.0.0.0:8080
404 page not found
docker@default:~$ docker ps
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS
NAMES
f93fd1833de2 goreacttodo_client "npm start" 32 minutes ago Up 5 minutes 0.0.0.0:9000->
3000/tcp goreacttodo_client_1
ff1fa9c33b05 postgres "/docker-entrypoint.s" 3 days ago Up 5 minutes 5432/tcp
goreacttodo_postgres_1
e4581f8e368b goreacttodo_server "gin" 3 days ago Up 5 minutes 0.0.0.0:8080->
3000/tcp goreacttodo_server_1
Output of the following commands inside the node container:
root@f93fd1833de2:/usr/src/app# curl localhost:3000
<!doctype html>
<html>
<head>
</head>
<body lang="en">
<div id="react-app"></div>
<script src="/bundle.js" type="text/javascript"></script>
</body></html>
Any help would be greatly appreaciated.
Webpack development server by default listens on localhost only.
If you want to expose it's port outside of Docker container you need to explicitly specify host to listen to:
webpack-dev-server --host 0.0.0.0 --port 80
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With