Flask 解决Flask跨域资源共享问题

在本文中，我们将介绍Flask框架中如何解决跨域资源共享（CORS）问题。跨域资源共享是指在浏览器中使用JavaScript从不同的域加载资源时出现的安全机制。

阅读更多：Flask 教程

什么是跨域资源共享（CORS）？

跨域资源共享（Cross Origin Resource Sharing，CORS）是一种用于在浏览器中处理跨域请求的机制。当浏览器发起一个跨域的AJAX请求时，如果请求的资源的域与当前页面的域不一致，浏览器会阻止该请求，以保护用户的安全。

Flask 中的CORS问题

在使用Flask开发Web应用时，如果前端页面需要通过AJAX请求Flask后端的API接口，可能会遇到跨域资源共享的问题。由于默认情况下Flask不允许跨域请求，因此需要做些额外的配置，才能实现跨域请求。

解决CORS问题的方法

Flask提供了一个扩展——Flask-CORS，用于解决CORS问题。该扩展提供了一个装饰器@cross_origin，可以很方便地添加到Flask视图函数中，用于允许特定的域发送跨域请求。

安装Flask-CORS

首先，我们需要安装Flask-CORS扩展。可以使用pip命令进行安装：

pip install -U Flask-CORS

使用@cross_origin装饰器

在需要允许跨域请求的Flask视图函数上添加@cross_origin装饰器。例如，以下示例代码演示了如何在Flask应用中允许所有域的跨域请求：

from flask import Flask
from flask_cors import cross_origin

app = Flask(__name__)

@app.route('/api/data', methods=['GET'])
@cross_origin()
def get_data():
    # 处理数据请求逻辑
    return "Data"

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

在上述代码中，我们在/api/data这个接口上添加了@cross_origin()装饰器，表示允许所有域的跨域请求。通过这样的配置，我们就可以在前端页面上使用AJAX请求该接口。

支持特定的域

除了允许所有域的跨域请求，我们还可以配置Flask-CORS只允许特定的域发送跨域请求。例如，以下示例代码演示了如何只允许来自localhost:8080域的跨域请求：

from flask import Flask
from flask_cors import cross_origin

app = Flask(__name__)

@app.route('/api/data', methods=['GET'])
@cross_origin(origins='http://localhost:8080')
def get_data():
    # 处理数据请求逻辑
    return "Data"

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

在上述代码中，我们在@cross_origin装饰器的origins参数中指定了允许的域，只有指定的域才能发送跨域请求。这样可以提高安全性，防止恶意的跨域请求。

配置通配符

有时候，我们可能希望允许多个域发送跨域请求，而不是只允许一个或者所有域。可以使用通配符*来配置允许的域。例如，以下示例代码演示了如何允许所有以.example.com为后缀的域发送跨域请求：

from flask import Flask
from flask_cors import cross_origin

app = Flask(__name__)

@app.route('/api/data', methods=['GET'])
@cross_origin(origins='*.example.com')
def get_data():
    # 处理数据请求逻辑
    return "Data"

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

在上述代码中，我们在@cross_origin装饰器的origins参数中使用了通配符*.example.com，表示允许所有以.example.com为后缀的域发送跨域请求。这样，无论是http://www.example.com还是http://api.example.com都可以发送跨域请求。