基于React+Flask前后端分离的文件搜索系统
文章目录
- 0 页面概览
- 一、后端Flask介绍
-
- 一、项目功能概述
- 二、依赖模块说明
- 三、创建 Flask 应用与全局状态
- 四、启动搜索的接口 `/search/files`
- 五、获取搜索进度接口 `/search/progress`
- 六、核心搜索逻辑：`search_files_help`
- 七、主入口
- 八、总结
- 二、React前端介绍
-
- 一、📘 文件功能概述
- 二、🧩 依赖模块与组件说明
- 三、📊 组件状态管理
- 四、✨ 关键功能讲解
-
- 1️⃣ **关键字高亮函数**
- 2️⃣ **轮询搜索进度（useEffect）**
- 3️⃣ **启动搜索**
- 五、🖼️ 页面布局与 UI 结构
-
- 🧱 搜索控制区
- 📈 搜索进度卡片
- 📁 搜索结果卡片
- 六、🔗 与后端交互逻辑
- 七、🧠 关键技术点总结
- 八、📘小结
- 前后端源代码
0 页面概览
一、后端Flask介绍
一、项目功能概述
本项目通过 Flask 提供一个 文件搜索 API 服务，可以：
- 在指定磁盘中递归搜索文件；
- 根据文件名关键字和文件类型筛选；
- 返回搜索进度（用于前端显示进度条）；
- 搜索过程在后台独立线程中执行，避免阻塞主线程。
二、依赖模块说明
import os
import threading
from flask import Flask, jsonify, request