15、构建全栈应用：从前端搭建到认证授权实现

构建全栈应用：从前端搭建到认证授权实现

1. 前端应用搭建回顾

之前创建的应用虽然外观欠佳，但借助 Tailwind 勉强维持了基本样式。该应用允许本地用户插入待售新车、删除车辆以及更新车辆价格，这是一个基础的 CRUD 应用，它让我们初步了解了连接 MongoDB、FastAPI 和 React 的机制。

在这个过程中，我们完成了以下工作：
- 定义了 Pydantic 模型和数据验证规则，确保了数据的完整性和有效性。
- 免费创建了 MongoDB Atlas 在线数据库，并使用异步 Python 驱动（Motor）将其高效连接到 FastAPI 后端。
- 为应用创建了多个端点，实现了对实体（如汽车）的创建、读取、列表、更新和删除操作，且这种方法可广泛应用于各种适合存储在 MongoDB 中的数据。
- 使用 CRA 工具创建了 React 应用，并利用 React Router 6 和 Hooks 等最新特性搭建组件和页面，确保 FastAPI 数据能按预期流动。

不过，这个应用还远未达到生产就绪的标准，它的 API 没有任何保护措施，任何人只要知道端点 URL 就可以随意发起请求，插入虚假数据或编辑、删除现有数据。因此，我们需要引入用户认证和授权机制，让应用更加安全和实用。

2. 认证与授权概述

认证（证明用户身份）和授权（确保认证用户能否执行特定操作）是非常复杂的概念。接下来，我们将从实际应用和 FARM 栈的角度出发，探讨相关话题。

我们将基于 JWT（JSON Web Token）为 FastAPI 后端构建一个简单、健壮且可扩展的认证系统，然后将其集成到 Re