使用 AJAX 调用 Flask API答案

【问题标题】：Call Flask API with AJAX使用 AJAX 调用 Flask API
【发布时间】：2017-05-02 16:15:26
【问题描述】：

我正在试验 Flask 和 AJAX，我有一个简单的 API 路由 here ，托管在 OpenShift 上。我想用 Ajax 在 Javascript 文件中调用 API。 OpenShift Python 文件很简单：

from flask import Flask
app = Flask(__name__)

import json

@app.route('/hello/<name>')
def hello_world(name=None):
    str = {'key':'Hello World!', 'q':name}
    #out = {'key':str}
    res = json.dumps(str)
    return res

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

这里是 Ajax 调用：

$.ajax({
    type:"GET",
    dataType: "json",
    data:'Payam',
    url: "http://mypythonapp-spacepirate.rhcloud.com/hello/",
    success: function(data){
        buf1=data;
        console.log(data);
    }
})

但这会调用此 url 导致 404。我该如何解决这个问题？只是提到 CORS 不是问题。

http://mypythonapp-spacepirate.rhcloud.com/hello/?Payam

【问题讨论】：

标签： javascript jquery python ajax openshift

【解决方案1】：

尝试将您的 url 属性更改为

url: "http://mypythonapp-spacepirate.rhcloud.com/hello/world",

然后你会得到一个200响应状态，而不是404。原因是你创建的flask路由在hello/后面有一个必填参数。

编辑：关于使用数据变量的问题的后续行动

方法1：只需在url中添加编码参数

url: "http://mypythonapp-spacepirate.rhcloud.com/hello/" + encodeURIComponent(xyz)
method2：使用data 参数来调用ajax，就像你已经开始做的那样。我认为 jquery 会将其转换为get 的URL 查询字符串，就像这样。注意? 分隔查询字符串的开头：

http://mypythonapp-spacepirate.rhcloud.com/hello/?xyz

您可以通过检查浏览器开发工具并查看 ajax 调用实际请求的 URL 来验证这一点。另请注意，在烧瓶处理程序中，您需要检查 request.query_string 以获取数据，因为<name> 参数将为空。

【讨论】：

酷！请将我的答案标记为已接受，或为我的答案投票，因为这是对 SO 说“谢谢”的最佳方式。
只是好奇，无论如何也可以通过传递数据来实现这一点，而不是直接修改url？

【解决方案2】：

使用Alex G Rice 提供的指南和Python Flask how to get parameters from a URL? 此处的答案，我发现了如何直接传递数据，如下所示：

Ajax 调用：

$.ajax({
    type:"GET",
    dataType: "json",
    data:{'name':'Payam'},
    url: "http://mypythonapp-spacepirate.rhcloud.com/hello/",
    success: function(data){
        buf1=data;
        console.log(data);
    }
})

python 文件：

@app.route('/hello/', methods=['GET','POST'])
def hello_world(name=None):
    buf1 = request.args.get('name')
    str = {'key':'Hello World!', 'q':buf1}
    #out = {'key':str}
    res = json.dumps(str)
    return res

【讨论】：