docker 个容器之间的 HTTP 请求

Question

我已经创建了两个非常简单的容器来处理容器之间的 understand/test HTTP 请求，但由于某种原因，我无法让我的容器进行通信。我不断收到 GET http://backend:5000/ net::ERR_NAME_NOT_RESOLVED

我的第一个容器，一个没有功能的简单反应应用程序，只是从 process.env.REACT_APP_URL 获取容器名称，并通过 fetch(http://${url}:5000/).

发出获取请求

import { useState } from "react";

const MyComponent = () => {
  const [message, setmessage] = useState("Hello");

  async function buttonClick() {
    let url = process.env.REACT_APP_URL;

    try {
      let response = await fetch(`http://${url}:5000/`);
      console.log("This is response", response);
      setmessage(response.data);
    } catch (error) {
      console.log("error occured:", error);
    }
  }

  return (
    <>
      <p>{message}</p>
      <button onClick={buttonClick}>Click Me!</button>
    </>
  );
};

export default MyComponent;

我的第二个容器，同样非常简单的 Flask 应用程序，在主页路由中提供了 Hello World，没有其他内容。

from flask import Flask, jsonify

app = Flask(__name__)

@app.route("/")
def hello_world():
    return jsonify("Hello World"), 200


if __name__ == '__main__':
    app.run(host="0.0.0.0")

及其对应的docker个文件，

FROM node:17.4.0-alpine

# set working directory
WORKDIR /app

# add `/app/node_modules/.bin` to $PATH
ENV PATH /app/node_modules/.bin:$PATH

# install app dependencies
COPY package.json ./
COPY package-lock.json ./

RUN npm install --silent
RUN npm install react-scripts@3.4.1 -g --silent

# add app
COPY . ./

# start app
CMD ["npm", "start"]

FROM python:3.6.5-alpine

RUN apk update && apk upgrade && apk add gcc musl-dev libc-dev libc6-compat linux-headers build-base git libffi-dev openssl-dev

COPY . .

RUN pip install -r requirements.txt

CMD ["python", "./myfile.py"]

最后，我正在使用 docker-compose 来编排这些容器：

version: "3"

services:
  backend:
    build:
      context: ./server
    container_name: backend
    expose:
      - 5000
    ports:
      - 5000:5000

  frontend:
    build:
      context: ./web
    container_name: frontend
    expose:
      - 3000
    ports:
      - 3000:3000
    environment:
      - REACT_APP_URL=backend
    depends_on:
      - "backend"
    links:
      - "backend:backend"

我的文件系统如下：

/sample-app
    |_ server
    |_ web
    |_ docker-compose.yml

我一直在努力理解我做错了什么，但我就是找不到。我感谢任何帮助。

Answer 1

您的前端使用主机上公开的端口与后端通信（如果后端容器想要连接数据库容器，则不需要 container-container 通信）。因此，主机名应该是 localhost 而不是 backend.

尝试进行以下更改

  frontend:
    ...
    ...
    environment:
      - REACT_APP_URL=localhost
    ...
    ...

您还需要将响应转换为 JSON。

      let response = await fetch(`http://${url}:5000/`);
      response = await response.json();
      console.log("This is response", response);
      setmessage(response.data);

docker 个容器之间的 HTTP 请求

HTTP requests between docker containers

flask

docker

reactjs

docker-compose