reactjs - axios 前端请求总是从 Flask-restful 后端得到错误，即使响应代码是 200

Question

我在 React 应用程序前端有以下axios帖子：

import axios from "axios";
import { backendServer, getAuthHeader, getErrorMessage } from "./constants";

const connectPath = (host, port, database, user, password) => {
  const requestString = backendServer + 'connect/';
  const form = {
    host: host,
    port: port,
    database: database,
    user: user,
    password: password
  }
  
  return axios.post(requestString, form, getAuthHeader())
    .then((Response) => {
      return {
        connection: Response.data,
        message: null
      }
    })
    .catch((Error) => {
      return getErrorMessage(Error);
    })
}

export const paths = {
  connectPath,
}

这个烧瓶休息的后端类：

class Connect(Resource):
    def post(self):
        
        try:
            data = json.loads(request.data)
        except:
            data = request.form
        
        connect(
            data['host'], 
            data['port'], 
            data['database'],
            data['user'],
            data['password']
        )
        
        return {'data': "ok"}

api.add_resource(Connect, '/connect/')

我可以看到后端正确处理了前端请求：

但是，尽管如此，axios post 总是返回到catch((Error)).

当从flask-restful返回 200 时，我不知道如何让axios去做。then(Response)

编辑

这是我在network检查器选项卡中得到的：

标签： reactjsaxiosflask-restful

Answer 1

解决方案是我必须安装和使用flask-cors：

pip install -U flask-cores

import json
from flask import Flask, request
from flask_restful import Resource, Api
from flask_cors import CORS
from query import execute_query, connect

app = Flask(__name__)
CORS(app) # <<------- here
api = Api(app)