Question

我已经这样设置了flask个rest API：

from flask import Flask
from flask import jsonify
from flask_cors import CORS, cross_origin

app = Flask(__name__)
CORS(app)

@app.route('/', methods=['GET'])
def hello_world():
   return "Hello World"

if __name__ == '__main__':
   app.run()

现在，我还设置了一个React前端。我要做的就是向我的GET rest API发出flask请求，并console.log生成字符串Hello World". I had some CORS issues so I added the line CORS（app）`，我仍然遇到一些麻烦。

我的提取请求看起来如此...

componentDidMount() {

    fetch('http://localhost:5000/', {
      method: 'GET',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
      }
    })
      .then(result=>result)
      .then(item=>console.log(item))
      .catch(e=>{
        console.log(e);
        return e;
      })
}

我得到的结果如下...

Response { type: "cors", url: "http://localhost:5000/", redirected: false, status: 200, ok: true, statusText: "OK", headers: Headers, bodyUsed: false } App.js:24

我的Hello World字符串没有任何符号。我还注意到我的服务器正在发出OPTIONS请求...

127.0.0.1 - - [26/Jul/2018 14:13:54] "OPTIONS / HTTP/1.1" 200 -
127.0.0.1 - - [26/Jul/2018 14:13:54] "GET / HTTP/1.1" 200 -

我认为这可能与标题中的application/json有关。所以我删除了...

fetch('http://localhost:5000/', {
  method: 'GET',
})
  .then(result=>result)
  .then(item=>console.log(item))
  .catch(e=>{
    console.log(e);
    return e;
  })

OPTIONS请求消失了，但是我的回答还是一样。

我似乎无法将字符串传送到前端。我不知道我的问题可能会变成什么。

Answer 1

您可以使用jsonify返回Response对象，而不是从Flask路由中返回字符串：

return jsonify({"data": "Hello World"})

然后在React中，您可以在响应中调用json方法来获取包含数据的JavaScript对象：

.then(result=>result.json())  // instead of .then(result=>result)

然后您应该看到以下记录到控制台：

{data: "Hello World"}

Hello World示例与烧瓶和反应

1 个答案: