Python后台接口允许跨域请求

在现代的Web开发中，允许跨域请求是非常重要的一项功能。当你的前端应用和后端服务不在同一域名下时，就需要解决跨域资源共享（CORS）的问题。本篇文章将教会你如何在Python后台接口中实现允许跨域请求。

流程概述

以下是实现跨域请求的基本流程：

步骤 描述
1 安装 Flask 和 Flask-CORS
2 创建一个基本的 Flask 应用
3 使用 Flask-CORS 进行跨域配置
4 启动 Flask 应用并测试

各步骤实现

1. 安装 Flask 和 Flask-CORS

首先，我们需要安装 Flask 及其扩展库 Flask-CORS。打开终端并运行以下命令：

pip install Flask Flask-CORS

这条命令会安装 Flask 框架和处理跨域请求的库 Flask-CORS。

2. 创建一个基本的 Flask 应用

接下来，我们需要创建一个简单的 Flask 应用。创建一个名为 app.py 的 Python 文件，并写入以下代码：

from flask import Flask, jsonify

app = Flask(__name__)

@app.route('/api/data', methods=['GET'])
def get_data():
    """返回一些数据，供前端调用"""
    return jsonify({"message": "Hello, World!"})  # 返回一个简单的JSON响应

if __name__ == '__main__':
    app.run(debug=True)  # 以调试模式运行Flask应用

这段代码创建了一个名为 app 的 Flask 应用，并设置了一个简单的 GET 接口 /api/data，返回一条信息。

3. 使用 Flask-CORS 进行跨域配置

现在，我们需要添加 Flask-CORS，以便允许跨域请求。更新 app.py 文件如下：

from flask import Flask, jsonify
from flask_cors import CORS  # 导入 CORS

app = Flask(__name__)
CORS(app)  # 允许所有来源的跨域请求

@app.route('/api/data', methods=['GET'])
def get_data():
    """返回一些数据，供前端调用"""
    return jsonify({"message": "Hello, World!"})  # 返回一个简单的JSON响应

if __name__ == '__main__':
    app.run(debug=True)  # 以调试模式运行Flask应用

添加的 CORS(app) 代码行会使所有接口支持跨域请求。

4. 启动 Flask 应用并测试

现在启动 Flask 应用。在终端中运行以下命令：

python app.py

默认情况下，应用将在 ` 运行。

要进行测试，可以在前端进行简单的 AJAX 请求，如下所示（可在浏览器开发者工具的控制台中执行）：

fetch('  // 用fetch API获取数据
    .then(response => response.json())
    .then(data => console.log(data));

如果你能够看到 {"message": "Hello, World!"} 输出，则表示跨域请求已经成功实现。

序列图

接下来，我们用mermaid语法展示一个跨域请求的序列图：

sequenceDiagram
    participant Frontend
    participant Backend
    Frontend->>Backend: 发送跨域请求
    Backend-->>Frontend: 返回JSON响应

结尾

通过上述步骤，你已经成功地实现了 Python 后台接口的跨域资源共享（CORS）。这对于后端开发人员来说是必备技能，能够有效提高前后端分离架构的灵活性和可用性。希望这篇文章对你有所帮助，祝你在开发的道路上越走越顺！