Question

我在同一台机器上运行了两个服务：

直接由nginx提供的反应前端
在localhost上运行的烧录服务器（在端口5000上）。

正如您所想象的那样，反应应用程序使用fetch来调用flask服务器进行繁重的工作。但是，我似乎无法获取到达终点。

我已经将烧瓶包裹在CORS(app)中，以消除这个问题。我也尝试了多种方式来提供fetch端点（http，https，localhost），但都无济于事。到底他妈发生了什么？就目前而言，我在请求时得到net::ERR_CONNECTION_RESET（但我看不到端点没有被击中）。以下是我的代码的关键部分，现在就是：

烧瓶中：

app = Flask(__name__)
CORS(app)
@app.route('/api/get_dashboard_art', methods=["GET", "POST"])
def hello():
    return jsonify({'data': 'stuff'})

阵营/取：

fetch('http://localhost:5000/api/get_dashboard_art')
    .then(function (response_json) {
        return response_json.json()
    })

另外需要注意的是，我可以做curl localhost:5000/api/*并获得我需要的所有信息。所以我知道服务正在运行。

我看到有类似问题的人有很多喋喋不休，但我真的没有找到任何决心。请帮忙！

Answer 1

在您的反应代码中，

fetch('http://localhost:5000/api/get_dashboard_art')

您正在调用端点（/ api / get_dashboard_art） NOT （/），就像您在烧瓶应用中一样。

@app.route('/', methods=["GET", "POST"])

将端点更改为

@app.route('/api/get_dashboard_art', methods=["GET", "POST"])

它应该有用。

Answer 2

好的... @diypcjourney发布的链接让我想到了一些事情。我最终做的是在我的反应nginx配置中放置一个代理。它接收了来自FE的所有电话并将它们引导到烧瓶应用程序。这是它的样子（再次，这是反应nginx配置，而不是烧瓶配置）

server {
  listen 80;

  server_name localhost;  # or whatever your IP/site is

  root /var/www/reactapp/build/;

  index index.html index.htm;

  location / {
    try_files $uri /index.html;
  }

  location /api/ {
    proxy_pass http://localhost:5000/api/;
  }
}

以下是nginx文档：https://www.nginx.com/resources/admin-guide/reverse-proxy/

我不确定这是否解决了问题所在，但它似乎是一个不错的解决方案。我希望有人能够更好地解释为什么会有效。

难以得到反应和烧瓶相互交谈

2 个答案: