Flask框架开发一个简单的Web应用

一、安装 Flask: 如果你还没有安装 Flask,可以通过 pip 安装它:

bash 复制代码
pip install flask

二、编写后端 Python 代码 : 创建一个 Python 文件(例如 app.py),在这个文件中定义你的 Flask 应用。

三、创建路由 : 在 Flask 中,通过装饰器 (@app.route) 来定义处理特定 URL 请求的函数。

四、运行 Flask 应用 : 设置环境变量 FLASK_APP 并启动应用。

五、编写前端 HTML/CSS/JS: 创建静态文件(如 HTML 页面)来呈现内容,并通过 JavaScript 发送 AJAX 请求与后端交互。

下面是一个简单的例子:

步骤 1: 编写后端 Python 代码

假设你的 Python 文件名为 app.py:

python 复制代码
from flask import Flask, render_template, request

app = Flask(__name__)

@app.route('/')
def home():
    return render_template('index.html')

@app.route('/submit', methods=['POST'])
def submit():
    user_name = request.form.get('user_name')
    if user_name:
        return f"Hello, {user_name}!"
    else:
        return "Please provide your name."

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

步骤 2: 创建前端 HTML 文件

在你的项目目录中创建一个名为 templates 的文件夹,并在其中创建一个名为 index.html 的文件:

XML 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask Example</title>
</head>
<body>
    <h1>Welcome to the Flask App!</h1>
    <form action="/submit" method="post">
        <label for="user_name">Your Name:</label>
        <input type="text" id="user_name" name="user_name">
        <button type="submit">Submit</button>
    </form>
</body>
</html>

步骤 3: 运行 Flask 应用

确保你在包含 app.py 的目录中,并且已经设置了 FLASK_APP 环境变量。然后运行 Flask 应用:

bash 复制代码
export FLASK_APP=app.py
flask run

这将在本地服务器上启动 Flask 应用。你可以通过访问 http://127.0.0.1:5000/ 来查看你的网站。

以上就是一个基本的 Flask 应用示例,包括了后端逻辑和简单的前端交互。你可以根据需要添加更多的功能,比如数据库集成、用户认证等。

相关推荐
DARLING Zero two♡5 分钟前
接入 AI Ping 限免接口,让 GLM-4.7 与 MiniMax-M2.1 成为你的免费 C++ 审计专家
开发语言·c++·人工智能
码界奇点7 分钟前
Java外功核心7深入源码拆解Spring Bean作用域生命周期与自动装配
java·开发语言·spring·dba·源代码管理
czlczl200209258 分钟前
Spring Security @PreAuthorize 与自定义 @ss.hasPermission 权限控制
java·后端·spring
不惑_8 分钟前
通俗理解感知机(Perceptron)
人工智能·python
Everybody_up11 分钟前
pycharm中编译环境配置
ide·python·pycharm
零小陈上(shouhou6668889)16 分钟前
YOLOv8+PyQt5输电线路缺陷检测(目前最全面的类别检测,可以从图像、视频和摄像头三种路径检测)
python·qt·yolo
luoluoal16 分钟前
基于python的爬虫的贵州菜价可视化系统(源码+文档)
python·mysql·django·毕业设计·源码
用泥种荷花17 分钟前
【前端学习AI】Python环境搭建
前端
老华带你飞19 分钟前
考试管理系统|基于java+ vue考试管理系统(源码+数据库+文档)
java·开发语言·前端·数据库·vue.js·spring boot·后端
2501_9216494921 分钟前
股票 API 对接,接入美国纳斯达克交易所(Nasdaq)实现缠论回测
开发语言·后端·python·websocket·金融