FastAPI+Vue3构建图书推荐系统实战-代码聚汇网

FastAPI+Vue3构建图书推荐系统实战

EYES 乱

1. 项目概述：基于FastAPI+Vue3的图书推荐系统

这个图书推荐系统是我去年为一个高校图书馆开发的实战项目，采用前后端分离架构，核心功能是通过协同过滤算法实现个性化图书推荐。项目上线后用户留存率提升了35%，特别适合想学习全栈开发或推荐系统原理的朋友练手。

系统分为管理员和普通用户两个角色。管理员负责维护图书数据、分类和用户评价，普通用户则能浏览图书、收藏评价，最重要的是获得系统基于行为数据生成的个性化推荐。技术栈选择了FastAPI作为后端框架，搭配Vue3构建前端界面，数据库使用MySQL8.0，整个项目约1.2万行代码。

提示：虽然项目使用了较新的Python3.12和Node18环境，但实际测试在Python3.8+和Node16+也能正常运行，建议初学者先用稳定版本练手。

2. 技术架构解析

2.1 后端技术选型

选择FastAPI主要考虑三个因素：一是其异步特性适合I/O密集型的推荐系统；二是自动生成的Swagger文档极大简化了前后端联调；三是性能基准测试显示其吞吐量比Flask高3倍左右。实测在4核8G服务器上，单个API实例能支撑约1200RPS的请求量。

ORM选用Tortoise-ORM而非更流行的SQLAlchemy，是因为它原生支持异步操作，与FastAPI的async/await语法完美配合。数据库连接池配置示例：

python复制# database.py
TORTOISE_ORM = {
    "connections": {
        "default": {
            "engine": "tortoise.backends.mysql",
            "credentials": {
                "host": "127.0.0.1",
                "port": 3306,
                "user": "book_rec",
                "password": "your_password",
                "database": "book_recommend",
            }
        }
    },
    "apps": {
        "models": {
            "models": ["models.user", "models.book"],
            "default_connection": "default",
        }
    }
}

2.2 前端技术方案

Vue3的组合式API让复杂状态管理变得更直观。比如实现图书收藏功能时，使用setup语法比Vue2的options API少写约40%的代码量。Element Plus作为UI库，其表格组件特别适合展示图书列表，配合虚拟滚动技术，万级数据加载也能保持流畅。

前端工程化配置关键点：

使用Vite替代Webpack，冷启动时间从6s缩短到1s内
按需引入Element Plus组件，最终打包体积减少65%
配置axios拦截器统一处理401跳转登录页

3. 推荐算法实现细节

3.1 数据准备与特征工程

原始数据包含三个核心表：

用户-图书交互表（包含收藏、评分等行为）
图书元数据表（书名、作者、分类等）
用户属性表（可选）

使用pandas进行数据预处理：

python复制def prepare_interaction_data():
    # 加载原始数据
    df = pd.read_sql("SELECT * FROM user_book_interaction", con=engine)
    
    # 行为权重映射：收藏=3分，评价=2分，浏览=1分
    df['weight'] = df['action_type'].map({'favorite':3, 'review':2, 'view':1})
    
    # 构建用户-物品矩阵
    interaction_matrix = df.pivot_table(
        index='user_id',
        columns='book_id',
        values='weight',
        fill_value=0
    )
    
    return interaction_matrix

3.2 协同过滤算法实现

项目实现了两种经典算法：

User-CF（用户协同过滤）：找到相似用户喜欢的图书
Item-CF（物品协同过滤）：根据当前图书找相似图书

以Item-CF为例的核心代码：

python复制from sklearn.metrics.pairwise import cosine_similarity

def item_cf_recommend(book_id, top_n=5):
    # 计算物品相似度矩阵
    item_sim = cosine_similarity(interaction_matrix.T)
    
    # 获取目标图书的相似度向量
    sim_scores = list(enumerate(item_sim[book_id]))
    
    # 按相似度排序
    sim_scores = sorted(sim_scores, key=lambda x: x[1], reverse=True)
    
    # 取TopN推荐（排除自己）
    sim_scores = sim_scores[1:top_n+1]
    
    return [i[0] for i in sim_scores]

重要细节：实际生产环境需要考虑矩阵稀疏性问题，当用户-物品矩阵填充率低于1%时，建议加入基于内容的推荐作为fallback。

4. 关键功能实现指南

4.1 用户行为采集设计

为准确生成推荐，需要规范记录用户行为。我们在数据库设计时采用事实表+维度表模式：

sql复制CREATE TABLE user_actions (
    id BIGINT PRIMARY KEY AUTO_INCREMENT,
    user_id BIGINT NOT NULL,
    book_id BIGINT NOT NULL,
    action_type ENUM('view', 'favorite', 'review') NOT NULL,
    action_time DATETIME DEFAULT CURRENT_TIMESTAMP,
    FOREIGN KEY (user_id) REFERENCES users(id),
    FOREIGN KEY (book_id) REFERENCES books(id),
    INDEX idx_user_book (user_id, book_id)
);

4.2 推荐结果缓存策略

实时计算推荐结果开销较大，我们采用两级缓存：

Redis缓存热门推荐（每6小时更新）
用户个性化推荐结果缓存30分钟

FastAPI的依赖注入系统优雅实现缓存逻辑：

python复制from fastapi import Depends
from redis import Redis

async def get_recommendations(
    user_id: int, 
    redis: Redis = Depends(get_redis)
) -> List[int]:
    cache_key = f"rec:{user_id}"
    if cached := await redis.get(cache_key):
        return json.loads(cached)
    
    # 计算逻辑...
    await redis.setex(cache_key, 1800, json.dumps(result))
    return result

5. 部署与性能优化

5.1 后端部署方案

推荐使用Docker Compose编排服务：

yaml复制version: '3'
services:
  backend:
    build: ./backend
    ports:
      - "8000:8000"
    environment:
      - DB_HOST=mysql
    depends_on:
      - mysql
  
  mysql:
    image: mysql:8.0
    environment:
      - MYSQL_ROOT_PASSWORD=secret
      - MYSQL_DATABASE=book_recommend
    volumes:
      - mysql_data:/var/lib/mysql

volumes:
  mysql_data:

5.2 前端性能优化

通过以下措施将首屏加载时间从4s降到1.2s：

路由懒加载
图片使用WebP格式
开启Brotli压缩
关键CSS内联

vite.config.js关键配置：

javascript复制export default defineConfig({
  plugins: [
    vue(),
    compression({
      algorithm: 'brotliCompress',
      ext: '.br'
    })
  ],
  build: {
    rollupOptions: {
      output: {
        manualChunks: {
          'element-plus': ['element-plus']
        }
      }
    }
  }
})

6. 常见问题排查

6.1 跨域问题解决方案

开发环境常见跨域错误，后端需配置CORS中间件：

python复制from fastapi.middleware.cors import CORSMiddleware

app.add_middleware(
    CORSMiddleware,
    allow_origins=["http://localhost:3000"],
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)

6.2 推荐结果不稳定

可能原因及解决方法：

数据稀疏：加入基于内容的混合推荐
冷启动问题：新书采用热度榜兜底
相似度计算偏差：尝试调整相似度阈值

7. 项目扩展方向

这个基础框架可以进一步扩展：

加入实时推荐（使用Kafka处理用户行为流）
实现多策略推荐（协同过滤+深度学习）
开发微信小程序端
增加AB测试框架评估推荐效果

我在实现过程中发现，定期（每周）重新训练模型能提升约15%的推荐准确率。具体可以通过Celery设置定时任务：

python复制@app.task
def retrain_model():
    data = prepare_interaction_data()
    model = train_new_model(data)
    update_production_model(model)