如何连接运行react和python的两个Docker容器

我有

docker compose.yml

来调出两个docker容器

1.）前端-

reactjs

-在端口

3000

2.）后端-

python

（

flask

）-在端口

8083上运行

前端通过url
调用
python
服务器以获得
POST
方法http://127.0.0.1:8083/api
使用
axios
，但现在由于它们在两个容器上运行，如何通过该url将前端连接到
python
服务器

这是我的
docker compose.yml

version: "3.2"

services:

  frontend:
    build: ./frontend
    environment:
      CHOKIDAR_USEPOLLING: "true"
    volumes:
      - /app/node_modules
      - ./frontend:/app
    ports:
      - 80:3000
    depends_on: 
      - backend

  backend: 
    build: ./backends/jananath
    volumes:
      - ./backends/jananath:/usr/src/app
    environment:
      FLASK_APP: /usr/src/app/server.py
      FLASK_DEBUG: 1
      FLASK_RUN_EXTRA_FILES: "/usr/src/app/banuka.txt"
    ports: 
      - 5000:8083

这是
server.py
python服务器

from flask import Flask, render_template, request, url_for, redirect
import os
from os import path, walk
from flask_cors import CORS

app = Flask(__name__)
CORS(app)

PORT = 8083

@app.route('/api', methods=['POST', 'GET'])
def upload_file():
    file = request.files['file']
    filename = file.filename

    print(filename)

    filepath = os.path.abspath(filename)
    print(filepath)
    response_ = {}
    response_['filename'] = str(filename)
    response_['filepath'] = str(filepath)
    return response_


if __name__ == '__main__':
    app.run(host='0.0.0.0', port=PORT, extra_files=extra_files)

这是
axios
调用
POST
方法从
前端
到这个
server.py

const onFormSubmit = async (e) => {
    e.preventDefault();

    const formData = new FormData();
    formData.append("file", file);

    try {

      const res = await axios.post("http://127.0.0.1:8083/api", formData, { // this url should change now?
        headers: {
          "Content-Type": "multipart/form-data",
          "Access-Control-Allow-Credentials": "true",
          "crossorigin": "true",
        },
      });

      const {filename, filepath} = res.data;

      setUploadedFile({filename, filepath});
    } catch (error) {
      console.log(error);
    }
  };

我想这里的问题是URL现在已更改，但我不知道如何修复。有人能告诉我如何修复此问题以及我应该点击的正确URL是什么吗？

谢谢！
试试后端：8083在你的react应用程序中，你需要重建你的react映像。
后端是什么意思？后端是你的容器名称，因为你链接它们取决于容器名称是否足够，或者你也可以通过映射到本地主机的端口进行外部通信，即点击您的react应用程序。react应用程序通常在浏览器中运行，因此它不能利用Docker网络。您需要使用运行容器的服务器的主机名；如果您在单个系统上运行这些应用程序，您拥有的
127.0.0.1
实际上可能工作正常。@DavidMaze这是在同一主机上运行的。但是使用
localhost:/api
不起作用。但是在本地运行它时（不使用
docker
），它就起作用了。您还需要
端口的第一个端口号：
（您在docker之外发布的），所以
127.0.0.1:5000
。