python flask与ajax交互中的跨域问题以及解决方案

最新推荐文章于 2024-05-20 14:17:49 发布

原创最新推荐文章于 2024-05-20 14:17:49 发布 · 3.5k 阅读

9 ·

CC 4.0 BY-SA版权

文章标签：

#python #flask #ajax #跨域

python 专栏收录该内容

2 篇文章

订阅专栏

本文探讨了在Python Flask后端与Ajax进行数据交互时遇到的跨域问题及其解决方案。通过Flask的make_response()函数和jsonify处理响应数据，确保返回JSON格式。解决跨域的关键在于添加响应头，允许特定来源访问。示例代码展示了如何获取POST和GET请求的数据。

和伙伴写了个小程序，我用python做后端，前后端用ajax进行数据交互。但是呢，ajax存在一个跨域问题。为什么会存在这个问题，大家可以自行百度一下，我就不介绍了。下面直接说解决方案。

在flask中有一个方法是make_response(),是返回响应的函数。通过这个函数能返回一个响应，json_data是我前面自己设置的返回数据。

意思是，返回一个字典，“response”的值就是2001，“value”的值就是“success”，jsonify是对我写的字典进行json格式化，这里我说明一下，使用json.dumps()也可以，但是返回去的格式是html/txt格式，而不是applicaton/json格式。因为我们做的小程序前端需要用json格式，所以我只能用jsonify来编码data了。（jsonify好像是第三方库，需要导入）

解决跨域的重点是，

res.headers['Access-Control-Allow-Origin'] = '*'

这行代码，这样，ajax的跨域问题就会被解决了。希望大家能解决自己的问题。

如果还不懂，可以看看下面的代码；

from mysql_connection import conn
from flask import make_response,Flask,jsonify,request
app = Flask("__main__")

@app.route('/login',methods=["GET","POST"])
def login():
    data_request = request.form.get("request")
    if data_request == "1001":
        data_openid = request.form.get("openid")
        return_openid = select_data(data_openid)
        if return_openid is None:
            name = request.form.get("name")
            image = request.form.get("image")
            return_data = insert_data(data_openid,name,image)
            json_data = jsonify(return_data)
            res = make_response(json_data)
            res.headers['Access-Control-Allow-Origin'] = '*'
            return res
        else:
            return_data1 = {"response":2002,"openid":return_openid}
            json_data = jsonify(return_data1)
            res = make_response(json_data)
            res.headers['Access-Control-Allow-Origin'] = '*'
            return res

request.form.get("request") #对于请求，如果是post请求方式，则获取数据的方法是form，如果是get请求方式，获取数据方式是args （“request”）是我在ajax中设置的类似于字典中的键。通过这个方法来获取对应的值，下面的

request.form.get("openid")

也是同样的意思。其他的就都是python的基础知识了。

  return_data = insert_data(data_openid,name,image)

是我在下面定义了一个insert_data()函数，写的是插入数据库的操作，传入的是需要插入的参数，返回的是一个插入成功或者失败的信息。希望这篇文章能对大家有所帮助，文中写错的也希望大家指出来。