2

I have a NodeJS/Vue app that I can run fine until I try to put it in a Docker container. I am using project structure like:

enter image description here

When I do npm run dev I get the output:

[email protected] dev /Users/.../projects/myproject
webpack-dev-server --inline --progress --config build/webpack.dev.conf.js

and then it builds many modules before giving me the message:

 DONE  Compiled successfully in 8119ms                                                                                                                                                                  
 I  Your application is running here: http://localhost:8080                                                                                                                                                       

then I am able to connect via browser at localhost:8080

Here is my Dockerfile:

FROM node:9.11.2-alpine
RUN mkdir -p /app
WORKDIR /app
COPY package.json /app
RUN npm install
COPY . /app
CMD npm run dev
EXPOSE 8080  

I then create a docker image with docker build -t myproject . and see the image listed via docker images

I then run docker run -p 8080:8080 myproject and get a message that my application is running here: localhost:8080

However, when I either use a browser or Postman to GET localhost:8080 there is no response.

Also, when I run the container from the command line, it appears to lock up so I have to close the terminal. Not sure if that is related or not though...

UPDATE: I trying following the Docker logs such as

docker logs --follow

and there is nothing other than the last line that my application is running on localhost:8080

This would seem to indicate that my http requests are never making into my container right?

I also tried the suggestion to

CMD node_modules/.bin/webpack-dev-server --host 0.0.0.0

but that failed to even start.

It occurred to me that perhaps there is a Docker network issue, perhaps resulting in an earlier attempt at kong api learning. So I run docker network ls and see

NETWORK ID          NAME                DRIVER              SCOPE
1f11e97987db        bridge              bridge              local
73e3a7ce36eb        host                host                local
423ab7feaa3c        none                null                local

I have been unable to stop, disconnect or remove any of these networks. I think the 'bridge' might be one Kong created, but it won't let me whack it. There are no other containers running, and I have deleted all images other than the one I am using here.

Answer

It turns out that I had this in my config/index.js:

module.exports = {
  dev: {
    // Various Dev Server settings
    host: 'localhost', 
    port: 8080,

Per Joachim Schirrmacher excellent help, I changed host from localhost to 0.0.0.0 and that allowed the container to receive the requests from the host.

2
  • can you post, what does your npm run dev command do.. Commented Jun 30, 2018 at 14:15
  • try specifying host like node_modules/.bin/webpack-dev-server --host 0.0.0.0 Commented Jun 30, 2018 at 15:31

1 Answer 1

1

With a plain vanilla express.js setup this works as expected. So, it must have something to do with your Vue application.

Try the following steps to find the source of the problem:

  1. Check if the container is started or if it exits immediately (docker ps)
  2. If the container runs, check if the port mapping is set up correctly. It needs to be 0.0.0.0:8080->8080/tcp
  3. Check the logs of the container (docker logs <container_name>)
  4. Connect to the container (docker exec -it <container_name> sh) and check if node_modules exists and contains all

EDIT

Seeing your last change of your question, I recommend starting the container with the -dit options: docker run -dit -p 8080:8080 myproject to make it go to the background, so that you don't need to hard-stop it by closing the terminal.

Make sure that only one container of your image runs by inspecting docker ps.

EDIT2

After discussing the problem in chat, we found that in the Vue.js configuration there was a restriction to 'localhost'. After changing it to '0.0.0.0', connections from the container's host system are accepted as well.

With Docker version 18.03 and above it is also possible to set the host to 'host.docker.internal' to prevent connections other than from the host system.

Sign up to request clarification or add additional context in comments.

8 Comments

Thank you. I did confirm that the container is running and listing to port 8080. The logs show that the application is running here: http://localhost:8080 and then the docker container appears to mirror my dev environment.
I changed my startup per your suggestion and that seems to be a good start. I am now getting a message that "localhost didn't send any data" in my browser and "Could not get any response" in Postman.
Why did you change the exposed port to 8081? Did you change the -p parameter for your docker command as well? Can you please post the output of docker ps?
That was an editing mistake on my part - I have everything as 8080 now. Still not getting a connection.
You can remove unused networks with docker network prune or remove it explicitly with docker network rm 1f11e97987db.
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.