0

I have three components in my docker-compose, mysql db, flask server and react webapp.

When I do request to the server in the chrome, it gives me:

OPTIONS http://server:5000/getTables net::ERR_CONNECTION_TIMED_OUT

But if I get into react container using docker exec -it and then curl -X POST server:5000/getTables, it works fine.

This is how I set up the cors in the flask app:

@app.route('/getTables', methods=['GET', 'POST', 'OPTIONS'])
@cross_origin(origin='*')

This is my docker-compose.yaml:

version: '3'

services:
  db:
    image: mysql:5.7
    restart: always
    environment:
      MYSQL_DATABASE: 'TEST'
      MYSQL_USER: 'xxx'
      MYSQL_PASSWORD: 'xxx'
      MYSQL_ROOT_PASSWORD: 'xxx'
    ports:
      - '3306:3306'
    expose:
      - '3306'
    volumes:
      - my-db:/var/lib/mysql
  server:
    build: ./flask
    restart: on-failure
    ports:
      - '5000:5000'
    expose:
      - '5000'
    volumes:
      - ./flask:/server
  web:
    build: ./react
    ports:
      - 80:3000
volumes:
  my-db:

This is the flask-server log:

server_1  |  * Serving Flask app "app" (lazy loading)
server_1  |  * Environment: production
server_1  |    WARNING: This is a development server. Do not use it in a production deployment.
server_1  |    Use a production WSGI server instead.
server_1  |  * Debug mode: off
server_1  |  * Running on http://0.0.0.0:5000/ (Press CTRL+C to quit)

Is there anything wrong with my docker-compose file? Thank you in advance for the help!

EDIT It seems like an issue related to my react webapp container network setup. When I run the react app locally it works fine, but it will not connect to external API if I put it inside docker.

J.Z
  • 411
  • 3
  • 14
  • do you get any additional info in your logs once you put your flask app in debug mode? – ckaserer Jan 07 '20 at 06:26
  • @ckaserer my post controller will log the request info if I curl it. However if I do it in browser it just seems like the controller is not executed. – J.Z Jan 07 '20 at 17:44

1 Answers1

0

If you can send request to localhost:5000 from your host machine then your docker-compose is fine. You just need to add 

    127.0.0.1       server

to you hosts file.

Sy Tran
  • 378
  • 1
  • 2
  • 13
  • Yes, I can do `curl localhost:5000` from host machine. Which hosts file do you mean? – J.Z Jan 07 '20 at 05:08
  • /etc/hosts if you are on linux. You can google for other platform. I assume you are browsing react app on your host machine. So it cannot know the exact IP of `server` unless you tell it. – Sy Tran Jan 07 '20 at 05:14
  • my react webapp is in the docker container, and I tried to get into the container, the URL `server:5000` is accessible through the `curl` command. I also tried to change the connection URL in the react app to `localhost:5000` and the browser gives me `net::ERR_CONNECTION_REFUSED` – J.Z Jan 07 '20 at 05:17
  • Does your react have server side rendering? If so can you curl your server from react web instance? – Sy Tran Jan 07 '20 at 05:25
  • no I am not using the server-side rendering. My flask server is only used to process some post requests. Yes I can curl my server from react web instance. – J.Z Jan 07 '20 at 05:29
  • Sorry I misunderstood your previous comment. – Sy Tran Jan 07 '20 at 05:56
  • https://stackoverflow.com/questions/18642828/origin-origin-is-not-allowed-by-access-control-allow-origin . Please check console log in your browser to see if it logged CORS error. – Sy Tran Jan 07 '20 at 05:58
  • thanks for the link, I did configure the cors to allow `*`, it works well when I first testing it in my local environment, but it got timeout after I put all of the three components inside docker-compose. – J.Z Jan 07 '20 at 06:01
  • I think that's all I can help. Hope someone can give you the answer. – Sy Tran Jan 07 '20 at 06:10