给我搭建一个框架前后端 py

下面为你搭建一个简单的前后端Python框架示例，前端使用Flask作为Web服务器展示页面，后端使用Flask提供API接口。后端代码（`app.py`） ```python from flask import Flask, jsonify, request # 创建Flask应用实例 app = Flask(__name__) # 模拟一些数据 data = [ {"id": 1, "name": "Item 1"}, {"id": 2, "name": "Item 2"} ] # 定义一个API接口，用于获取所有数据 @app.route('/api/data', methods=['GET']) def get_data(): return jsonify(data) # 定义一个API接口，用于添加新数据 @app.route('/api/data', methods=['POST']) def add_data(): new_item = request.get_json() data.append(new_item) return jsonify(new_item), 201 if __name__ == '__main__': # 启动Flask应用，开启调试模式 app.run(debug=True) ``` 前端代码（`index.html`） ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Frontend Example</title> </head> <body> <h1>Data List</h1> <ul id="data-list"></ul> <button onclick="addData()">Add Data</button> <script> // 从后端API获取数据 async function getData() { const response = await fetch('/api/data'); const data = await response.json(); const dataList = document.getElementById('data-list'); dataList.innerHTML = ''; data.forEach(item => { const li = document.createElement('li'); li.textContent = `${item.id}: ${item.name}`; dataList.appendChild(li); }); } // 向后端API添加数据 async function addData() { const newItem = { id: new Date().getTime(), name: 'New Item' }; const response = await fetch('/api/data', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(newItem) }); if (response.ok) { getData(); } } // 页面加载时获取数据 getData(); </script> </body> </html> ``` 运行步骤 1. 将上述后端代码保存为`app.py`，前端代码保存为`index.html`，并且确保它们在同一目录下。 2. 打开终端，进入该目录，运行`python app.py`启动后端服务器。 3. 打开浏览器，访问`http://127.0.0.1:5000/index.html`即可看到前端页面。我在以往的开发过程中，碰到过以下几点需要格外小心处理的地方： 1. 数据验证：在后端接收前端传来的数据时，一定要进行严格的数据验证，防止恶意数据或不符合格式的数据进入系统。 2. 跨域问题：如果前端和后端部署在不同的域名或端口上，会出现跨域问题，需要在后端配置允许跨域访问。 3. 错误处理：在前后端交互过程中，要对可能出现的错误进行妥善处理，比如网络请求失败、服务器内部错误等，给用户友好的提示。 [2025-12-06 21:13:22 | AI写代码神器 | 807点数解答]

服务商

更多选项

快捷项

直通车

给我搭建一个框架 前后端 py

给我搭建一个框架前后端 py