Pranjal
Pranjal

Reputation: 689

Not able to access angular webserver inside linux contianer from windows host

I am deploying an angular app inside an ubuntu container which is hosted on windows 10. Here is my dockerfile:

FROM ubuntu:latest
COPY app /app
RUN apt-get update
RUN apt-get install -y curl software-properties-common python-pip
RUN curl -sL https://deb.nodesource.com/setup_8.x | bash -
RUN apt-get install -y nodejs
RUN npm install -g @angular/cli
RUN pip install -r /app/requirements.txt
WORKDIR /app/ng
RUN npm install
RUN npm rebuild node-sass
EXPOSE 4200
WORKDIR /
RUN touch start.sh
RUN echo "python /app/server.py &" >> start.sh
RUN echo "cd /app/ng" >> start.sh
RUN echo "ng serve" >> start.sh
RUN chmod +x start.sh
ENTRYPOINT ["/bin/bash"]
CMD ["start.sh"]

I run the image using

docker run -p 4200:4200 --name=test app

Now, the problem is, I am running this container on windows 10 with which I am not very familiar from the docker's perspective of networking. If I would have been running Linux, then I could have easily accessed the app through any browser by visiting http://localhost:4200 but this is not the case on windows 10 it seems. When I try to access my app through chrome, I get

This site can’t be reached
localhost refused to connect.
ERR_CONNECTION_REFUSED

I tried to search and found similar issue on docker forums. Taking the suggestions there I tried to access the container through my IPv4 address but failed. I also tried using docker NAT IP 10.0.75.1 but no results. I got hold of the container IP through docker inspect test and used the container IP 172.17.0.2 but that too didn't work.

Output of curl from host:

E:\app>curl localhost:4200
curl: (7) Failed to connect to localhost port 4200: Connection refused

E:\app>curl 0.0.0.0:4200
curl: (7) Failed to connect to 0.0.0.0 port 4200: Address not available

If I curl inside the container, it works as expected

root@97cd2c1e6784:/# curl localhost:4200
<!doctype html>
<html lang="en">
<body>
        <p>Test app</p>
</body>
</html>

How to access my angular app from windows host browser? If you want more information please ask for it in comments.

Upvotes: 1

Views: 802

Answers (2)

R0bertinski
R0bertinski

Reputation: 609

SOLVED: I just needed to restart the machine :). I had a similar issue (but I am not using Docker). When I run the command "ng serve --host 0.0.0.0" I can curl it inside the ubuntu WSL2 instance (screenshot attached) and it works fine!!, but I cannot use the browser (on Windows 10 build 19043) it always returns "ERR_CONNECTION_REFUSED". Any ideas?

enter image description here

enter image description here

Upvotes: 0

Pranjal
Pranjal

Reputation: 689

After searching more, I got an answer here. I just needed to start the angular server using ng serve --host 0.0.0.0 instead of just ng serve so that the application runs on all the network interfaces instead of just the loop interface.

Upvotes: 2

Related Questions