首页python Flask写一个前后端demo 输出代码

python Flask写一个前后端demo 输出代码

时间: 2024-01-20 07:04:45 浏览: 128

这是个前后端分离的demo项目，前端用vue开发，后端是python+flask

这是个前后端分离的demo项目，前端用vue开发，后端是python+flask。项目的部署会把把前端打包成静态文件，部署在nginx容器里。python的后端程序也会打成容器镜像。此外还需要一个mysql 的容器镜像

好的，以下是一个简单的 Python Flask 前后端 demo：后端部分代码： ``` from flask import Flask, jsonify, request app = Flask(__name__) @app.route('/api', methods=['POST']) def api(): data = request.get_json() name = data['name'] message = 'Hello, {}!'.format(name) return jsonify({'message': message}) if __name__ == '__main__': app.run() ``` 前端部分代码： ``` <html> <head> <title>Flask Demo</title> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> </head> <body> <h1>Flask Demo</h1> <label for="name_input">Name:</label> <input type="text" id="name_input"> <br><br> <button id="submit_button">Submit</button> <br><br> <div id="message_div"></div> <script> $('#submit_button').click(function() { var name = $('#name_input').val(); $.ajax({ url: '/api', type: 'POST', contentType: 'application/json', data: JSON.stringify({'name': name}), success: function(response) { $('#message_div').text(response.message); }, error: function(error) { console.log(error); } }); }); </script> </body> </html> ``` 这段代码实现了一个简单的前端页面，用户可以在文本框中输入名字，然后点击按钮向后端发送请求，后端返回一个包含问候语的 JSON 响应，前端将这个问候语显示在 div 中。这段代码假设您已经安装了 Python Flask 和 jQuery 库。如果您还没有安装它们，请先安装并导入它们。

阅读全文