handleSubmit看起来像这样：

Question

我对React和Python还是很陌生，只是尝试从react表单向将与mongoDB接口的Python API做一个简单的文章。我在react中有一个表单在提交时调用handleSubmit函数。我希望handleSubmit函数能够发布到端口5000上运行的Python API。我的react应用程序正在端口8080上运行。

handleSubmit看起来像这样：

handleSubmit(event) {
    const axios = require('axios');
    const baseUrl = 'http://localhost:5000'

    axios.post('http://localhost:5000/api/create', JSON.stringify(params))
        .end((error, response) => {
            if (!error && response) {
                console.log('got a valid response from the server')
            } else {
                console.log(`Error fetching data from the server: `, error)
            }
        });

    event.preventDefault();
}

Python端点代码：

@app.route('/api/create', methods=['POST'])
def create(self):
    if request.method == 'POST':
        print(request.args.get('exp_title'))
        return True
    return False

单击按钮时，我的python API端点未到达，因为react试图发布到端口8080上的路由。我缺少什么？

我尝试使用常规的ajax调用并获得相同的结果。有一次，我做了一些事情，在浏览器中出现了CORS错误，但是我不记得我是怎么做到的。

Answer 1

要启用cors，您需要安装pip install -U flask-cors，这是网站：https://flask-cors.readthedocs.io/en/latest/ 或者您可以在reactjs package.json中的代理中定义cors，如下所示： https://facebook.github.io/create-react-app/docs/proxying-api-requests-in-development

在python应用中安装了cors后，请尝试以下操作： Python应用程序：

#pragma warning disable 252

反应应用程序：

@app.route('/api/', methods=['POST', 'GET'])
def api_post():
    if request.method == 'POST':
        print('post app')
        req = request.json
        print(req)
        return jsonify(name='john')

将表单数据从React句柄提交功能发送到python API？

handleSubmit看起来像这样：

Python端点代码：

1 个答案: