搜索功能完成说明

功能概述

实现了前端小程序搜索功能与后端数据库的完整连接，支持模糊查询所有书籍，包括：

书籍搜索（按书名、作者、简介、描述进行模糊查询）
热门搜索关键词（从数据库动态获取）
搜索历史（本地存储）
分页加载搜索结果

后端接口

1. 搜索书籍接口

接口地址： GET /api/book/search

请求参数：

keyword (必填): 搜索关键词
page (可选): 页码，默认1
size (可选): 每页数量，默认20

响应示例：

{
  "code": 200,
  "message": "success",
  "data": {
    "list": [
      {
        "id": 1,
        "title": "西游记",
        "author": "吴承恩",
        "cover": "https://example.com/cover.jpg",
        "image": "https://example.com/image.jpg",
        "brief": "简介",
        "desc": "描述",
        "introduction": "详细介绍"
      }
    ],
    "total": 100,
    "page": 1,
    "size": 20,
    "totalPages": 5
  }
}

2. 获取热门搜索关键词接口

接口地址： GET /api/book/popular-keywords

请求参数：

limit (可选): 返回数量，默认10

响应示例：

{
  "code": 200,
  "message": "success",
  "data": [
    "西游记",
    "三体",
    "大侦探",
    "窗边的小豆豆"
  ]
}

数据库查询

模糊查询实现

在 BookMapper.xml 中，使用 LIKE 语句实现模糊查询：

<if test="keyword != null and keyword != ''">
    AND (title LIKE CONCAT('%', #{keyword}, '%')
    OR author LIKE CONCAT('%', #{keyword}, '%')
    OR brief LIKE CONCAT('%', #{keyword}, '%')
    OR `desc` LIKE CONCAT('%', #{keyword}, '%'))
</if>

搜索范围：

书名 (title)
作者 (author)
简介 (brief)
描述 (desc)

查询特点：

支持部分匹配（前后都有通配符）
不区分大小写（MySQL默认）
只查询上架状态的书籍 (status = 1)

前端实现

1. API函数（books/utils/api.js）

新增了两个API函数：

// 搜索书籍
export function searchBooks(keyword, page = 1, size = 20)

// 获取热门搜索关键词
export function getPopularKeywords(limit = 10)

2. 搜索页面（books/pages/search/search.vue）

主要功能：

搜索输入框
搜索历史（本地存储）
热门搜索（从后端获取）
搜索结果展示
分页加载更多
加载状态显示
空结果提示

关键方法：

loadPopularSearches(): 加载热门搜索关键词
searchBooks(keyword, page): 搜索书籍
performSearch(keyword): 执行搜索
loadMore(): 加载更多搜索结果

使用流程

1. 用户搜索

用户在搜索框输入关键词
点击搜索或按回车键
前端调用 searchBooks API
后端执行模糊查询
返回搜索结果

2. 热门搜索

页面加载时调用 getPopularKeywords API
后端从热门书籍中提取书名
返回热门搜索关键词列表
前端展示在"热门搜索"区域

3. 搜索历史

用户搜索后，关键词保存到本地存储
下次打开搜索页面时，自动加载历史记录
点击历史记录可以快速搜索

测试示例

1. 搜索"西游记"

GET /api/book/search?keyword=西游记&page=1&size=20

2. 搜索"吴承恩"（作者）

GET /api/book/search?keyword=吴承恩&page=1&size=20

3. 搜索"神魔"（简介/描述中的关键词）

GET /api/book/search?keyword=神魔&page=1&size=20

性能优化建议

数据库索引：
- 确保 title、author 字段有索引
- 考虑添加全文索引（FULLTEXT INDEX）提高搜索性能
搜索结果缓存：
- 可以缓存热门搜索关键词
- 可以缓存常用搜索的搜索结果
分页优化：
- 默认每页20条，避免一次加载过多数据
- 支持滚动加载更多
搜索建议：
- 可以添加搜索建议功能（输入时实时提示）
- 可以添加搜索高亮显示匹配的关键词

后续优化建议

搜索排序：
- 按相关度排序
- 按热度排序
- 按时间排序
搜索筛选：
- 按分类筛选
- 按价格筛选
- 按VIP/免费筛选
搜索统计：
- 记录搜索关键词
- 统计搜索热度
- 分析用户搜索行为
搜索高亮：
- 在搜索结果中高亮显示匹配的关键词
- 提升用户体验
搜索建议：
- 输入时实时显示搜索建议
- 自动补全功能

文件清单

后端文件

book/src/main/java/com/yu/book/controller/BookController.java - 添加搜索接口
book/src/main/java/com/yu/book/service/BookService.java - 添加搜索方法和热门关键词方法
book/src/main/resources/mapper/BookMapper.xml - 已支持模糊查询（无需修改）

前端文件

books/utils/api.js - 添加搜索API函数
books/pages/search/search.vue - 更新搜索页面，调用真实API

注意事项

搜索关键词验证：
- 前端和后端都验证关键词不能为空
- 后端会自动trim关键词，去除首尾空格
分页处理：
- 前端使用 pageResult.list 获取数据列表
- 使用 pageResult.total 判断是否还有更多数据
- 支持滚动加载更多
错误处理：
- 网络错误时显示友好提示
- 搜索结果为空时显示提示信息
- 加载失败时使用默认热门搜索
数据兼容性：
- 处理 cover 和 image 字段的兼容性
- 处理 desc、brief、introduction 字段的兼容性

测试 checklist

搜索功能正常
热门搜索正常加载
搜索历史正常保存和加载
分页加载正常
空结果提示正常
加载状态显示正常
错误处理正常
图片加载正常
点击搜索结果跳转正常

搜索功能完成说明.md 5.8 KB Lien permanent Historique Raw