fastapi 构建一个html 登录页面和登录后的主页,登陆页面录入账户,密码后点击提交按钮提交账户密码数据。构建一个数据模型,包括用户ID,用户名字,用户密码,角色创建sqlite数据库。前端接收到页面返回的账户密码查询数据库中是否存在,存在则跳转登录后的主页并记录登陆状态。
时间: 2024-09-09 10:06:24 浏览: 22
FastAPI 是一个现代、快速(高性能)的 Web 框架,用于构建 API。它使用 Python 3.6+ 类型提示,具有自动的交互式 API 文档。接下来,我将简要介绍如何使用 FastAPI 构建一个 HTML 登录页面、登录后的主页,并创建一个简单的 SQLite 数据库来处理用户登录逻辑。
首先,你需要安装 FastAPI 和一个前端模板引擎,比如 Starlette 的 Jinja2 模板引擎。可以通过以下命令安装所需库:
```bash
pip install fastapi uvicorn jinja2
```
接下来是构建基本的 FastAPI 应用程序的步骤:
1. 创建用户数据模型:
```python
from pydantic import BaseModel
from sqlalchemy import create_engine, Column, Integer, String
from sqlalchemy.ext.declarative import declarative_base
from sqlalchemy.orm import sessionmaker
Base = declarative_base()
class User(BaseModel):
user_id: int
username: str
user_password: str
role: str
# 创建 SQLite 数据库引擎
engine = create_engine('sqlite:///./test.db')
Base.metadata.create_all(bind=engine)
SessionLocal = sessionmaker(autocommit=False, autoflush=False, bind=engine)
```
2. 创建登录表单页面(login.html):
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Login</title>
</head>
<body>
<form action="/login" method="post">
<label for="username">Username:</label>
<input type="text" id="username" name="username" required>
<label for="password">Password:</label>
<input type="password" id="password" name="password" required>
<button type="submit">Login</button>
</form>
</body>
</html>
```
3. 创建登录后的主页(home.html):
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Home</title>
</head>
<body>
<h1>Welcome to your dashboard</h1>
<!-- 显示登录后的信息 -->
</body>
</html>
```
4. 创建 FastAPI 应用程序:
```python
from fastapi import FastAPI, Request, status
from fastapi.templating import Jinja2Templates
from fastapi.responses import RedirectResponse
app = FastAPI()
templates = Jinja2Templates(directory=".")
@app.get('/', response_class=HTMLResponse)
async def read_index(request: Request):
return templates.TemplateResponse("login.html", {"request": request})
@app.post('/login')
async def login(username: str, password: str):
# 这里应该添加查询数据库的逻辑,验证用户名和密码
# 假设我们查询数据库后返回以下用户实例
user = User(user_id=1, username=username, user_password=password, role='admin')
# 为了简单起见,这里直接返回用户信息
return {"username": username, "role": user.role}
@app.get('/home', response_class=HTMLResponse)
async def read_home(request: Request):
return templates.TemplateResponse("home.html", {"request": request})
```
5. 运行 FastAPI 应用程序:
```bash
uvicorn main:app --reload
```
这个例子提供了登录页面、主页的创建和一个简单的用户模型。但是,它没有包含验证逻辑,也没有实现真正的用户认证和授权。在真实的应用程序中,你需要在用户输入用户名和密码后,查询数据库验证这些凭据的有效性。这通常涉及到密码的加密存储和比对,以及根据角色确定用户对不同页面的访问权限。同时,还应该在安全的环境中使用 HTTPS 和 CSRF 令牌保护用户的数据。