python篇-Flask 跨域问题解决方案

跨域是指

例如:当前页面的地址:http://localhost:8080/ ,点击按钮请求url为:http://localhost:5000/student时,此场景为跨越访问。

浏览器的同源策略限制,跨域请求默认是被禁止的(浏览器禁止处理此请求的返回结果)。

详细说明

在使用Flask提供web接口服务时,前端页面经常会遇到跨域请求的问题。

跨域请求是指:在浏览器发起的请求,其目标接口地址(Flask提供的http服务):http://localhost:5000/student
与当前页面的地址:http://localhost:8080/ 不在同一个域下

由于浏览器的同源策略限制,跨域请求默认是被禁止的(浏览器禁止处理此请求的返回)。

然而,在某些情况下,我们可能需要允许跨域请求,例如通过 JavaScript 发起的 AJAX 请求或在前端应用程序中调用后端 API。

补充:

1、什么是跨域问题

跨域是因为出于浏览器的同源策略限制。同源策略(Sameoriginpolicy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互。

        所谓同源(即指在同一个域)就是两个页面具有相同的协议(protocol),主机(host)和端口号(port)。

        跨域问题就是当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同时出现的问题。

### 解决 Flask 应用中的问题Flask 中处理 CORS(源资源共享)可以通过 `flask-cors` 扩展来实现。以下是几种常见的方法: #### 方法一:全局配置 CORS 如果希望为整个 Flask 应用启用 CORS 支持,可以使用 `CORS` 类进行全局设置[^2]。 ```python from flask import Flask from flask_cors import CORS app = Flask(__name__) CORS(app, resources=r'/*') # 配置允许所有路由的请求 @app.route('/api/data') def get_data(): return {'data': 'Hello, CORS with global settings!'} if __name__ == '__main__': app.run(debug=True) ``` 上述代码通过 `resources=r'/*'` 参数指定了所有路由都支持访问。 --- #### 方法二:局部配置 CORS 对于某些特定的视图函数,可以选择性地启用 CORS 支持。这种方式更加灵活,适用于仅部分接口需要的情况[^1]。 ```python from flask import Flask, jsonify from flask_cors import cross_origin app = Flask(__name__) @app.route('/api/specific-data', methods=['GET']) @cross_origin() # 局部开启 CORS 支持 def specific_data(): return jsonify({'data': 'This is a specific route with CORS enabled.'}) if __name__ == '__main__': app.run(debug=True) ``` 在这里,装饰器 `@cross_origin()` 只作用于 `/api/specific-data` 这一路由。 --- #### 方法三:增强安全性并支持凭证传输 当应用程序涉及 Cookie 或身份验证时,可能需要传递用户凭据。此时应显式指定参数以支持凭据共享[^3]。 ```python from flask import Flask from flask_cors import CORS app = Flask(__name__) CORS(app, supports_credentials=True) # 启用对带凭据请求的支持 @app.route("/") def hello_world(): return "Hello, cross-origin-world!" if __name__ == '__main__': app.run(debug=True) ``` 此配置允许浏览器发送带有认证信息(如 Cookies 和 HTTP 认证头)的请求。 --- #### 安装依赖库 为了使用 `flask-cors` 功能,需先安装该扩展包。执行以下命令完成安装: ```bash pip install -U flask-cors ``` --- ### 总结 以上三种方式分别针对不同的需求场景提供了解决方案- **全局配置**适合所有 API 接口都需要支持; - **局部配置**则用于限定范围内的接口; - **增强安全性和支持凭证**适配更复杂的业务逻辑。 确保根据实际项目需求选择合适的方案,并合理调整相关参数。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值