其实，

IT策士 10余年一线大厂经验。专注 IT 思维、架构、职场进阶。我会在公众号、今日头条持续发布最新文章，助你少走弯路。

上一篇我们让商品详情页的图片展示达到了流畅的电商体验，多图切换、规格联动都已就位。按理说，但一个真正的商城，光有浏览还不够——使用者得能“搜”。今天我们就来实现 商品搜索功能让使用者输入关键词，快速定位心仪的商品。

在实际项目中。很多开发者遇到以下痛点：

• 搜索入口难以统一不同页面需要手动添加表单，维护成本高。
• 查询逻辑冗杂多字段模糊匹配往往写成大量 if 语句，易出错。其实，
• 分页与搜索参数冲突翻页时需要手动拼接 query 参数。容易忘记导致结果丢失，
• 性能考量不足全表扫描导致搜索速度慢，影响使用者体验。
• 前端交互不友好搜索后页面没有保留关键词或提示信息，让使用者感到迷惑。

下面的实现方案将一步步解决这些痛点，让你轻松搭建高效且可维护的电商搜索功能。

一、需求分析

1. 全局搜索入口

2. 搜索结果页

3. 搜索逻辑：

• S KU 名称（name__icontains=keyword)

• S PU 品牌（spu__brand__icontains=keyword)

痛点拆解的观点是。

• • 要支持多字段匹配，一次查询就可以完成，不要分步过滤。使用 Django 的 Q.
• • 搜索与分类筛选可以叠加使用。先把所有过滤条件写成可组合链式调用。这样即使以后再添加标签筛选，也只需在同一链上加条件即可。
• • 保留输入关键词。以便页面返回时能自动回显，并给出“共 X 件商品”的提示；这一步往往被忽略导致 UX 不友好。
• • 分页链接必须携带当前所有过滤参数，否则翻页后会丢失查询条件；这也是常见 bug 的根源之一。• 性能方面用 SQLite 或 MySQL 时最好先确认是否开启了合适的全文索引或分词插件，否则随业务增长会变得不可接受。

二、改造商品列表视图，实现关键词过滤

from django.db.models import Q
def sku_list:
# 基本查询：只取上架商品
skus = SKU.objects.filter\
.select_related\
.prefetch_related
# ---- 搜索过滤 ----
query = request.GET.get.strip
if query:
skus = skus.filter(
Q |
Q |
Q |
Q
)
# ---- 分类过滤----
category_id = request.GET.get
current_category = None
if category_id:
至于try，category = Category.objects.get
category_ids =
children = Category.objects.filter
category_ids.extend)
skus = skus.filter
current_category = category
except Category.DoesNotExist:
skus = skus.none
# ---- 排序 & 分页 ----
skus = skus.order_by
from django.core.paginator import Paginator。EmptyPage,PageNotAnInteger
paginator = Paginator # 每页12条，可自行调整
page_number = request.GET.get
try这方面，page_obj = paginator.page
except PageNotAnInteger:
page_obj = paginator.page
except EmptyPage:
page_obj = paginator.page
top_categories = Category.objects.filter.order_by
context={
'page_obj':page_obj,'current_category':current_category,'top_categories':top_categories,'query':query,}
return render

关键点说明：

- 从 GET 参数读取 q 并 trim 空格；说起来，避免空字符串导致无效查询。 - 用 Q 组合多字段 icontains，实现一次数据库访问而非多次。 - 将 query 返回给模板，用于回显和标题提示。 不过， - 搜索与分类同时生效，例如?q=iPhone&category_id=5 只显示该分类下包含 iPhone 的 SKU。

三、模板改造：加入搜索框与动态标题

编辑文件： {% raw %}apps/products/templates/products/sku_list.html{% endraw %}

{% raw %} {% block content %}

{% if current_category %} {% endif %} 🔍 搜索
{% if query %} 🔎 搜索 “{{ query }}” {% elif current_category %} 📦 {{ current_category.name }} {% else %} 🛍️ 全部商品 {% endif %} {% if page_obj.paginator.count> 0 %} 共 {{ page_obj.paginator.count }} 件商品 {% else %} 共0件 商品 {% endif %}
{{% include 'products/_product_cards.html' %}}

小技巧这方面。在分页循环中可以使用自定义模板标签 `add_query_params` 来自动拼接参数，从而避免手工写多行代码。示例标签见下方代码块：

from django import template
register =
template.Library
@register.simple_tag
def add_query_params:
params={k:v for k,v in context.GET.items}
params.update})
return '&'+'&'.join)
"
>

使用方式这方面，

{% raw %}

四、全局快速搜索入口

如果你想让使用者无论在哪个页面都能发起一次全站检索。可以把小型表单放到主导航栏里例如：
{% raw %}


🔍︎︎︎︎︎︎︎︎︎︎︎︎︎✈️️️️️️️️☀️☁️⚡💨🧭⏰🚀🎯⌚✨⏳❗✂️↔️🛒🏪🏬🛍⚙️✉📬✏📋🗂🖇📁📂📑🍎🍊🍌🍓🥑🥦🥕🍠🌽🌶🌹🌻🌺🎁🎉🎊💸💵💰💳🏧🚚🚛🚜🐶🐱🐭🐰🐻🐼🐨🦁🐯🦄🙈🙉🙊😺😸😹😻😼😽😾😿🙀👻🤖🤩😍😘😂🤣🥲🤤😭😭😭😭😭😭😭😭😭😭😭😭😭】" />
🔍︎〉
我只是做了一个简化版，把它放在顶部导航栏中，即使是在非产品列表页面也能直接提交至 `/products/list/` 并携带 `?q=` 参数，这一步是可选的，如果你更喜欢仅在产品列表页内提供完整交互。就不必添加此段代码，


五、测试流程与验证

基本关键字检索


打开 /products/list/ 

在输入框键入 “iPhone” 并提交 

页面刷新后标题变为 “🔎 搜索 “iPhone””。并列出所有匹配 SKU 

确认分页工作正常 


品牌检索

键入 “Samsung” → 页面应展示该品牌下所有 SKU 

描述词检索

如果某 SPU 描述里含有 “智能手机”，则键入 “智能手机” 一样可以命中 

组合筛选 + 搜索

先点击 “手机” 分类，再输入 “128GB” → URL 应为
/products/list/?q=128GB&category_id=<手机分类ID>
仅显示该分类下符合关键词的 SKU 

无结果情况

键入不存在的关键词如 “Xiaomi” → 页面显示 “共 0 件商品”。并弹出空提示 


六、中文环境下的性能注意事项


SQLite / MySQL 默认支持 LIKE '%...%' 的中文模糊匹配，但其背后仍是全表扫描。

对于数据量较大的项目建议开启全文检索插件，如 PostgreSQL 的 tsvector 或 Elasticsearch 集成。

若继续使用 ORM。可以考虑为经常检索字段创建普通 BTree 索引，但由于 LIKE 开头不匹配，这种方式对全文模糊效果有限。其实，



七、小结与下一篇预告

今天我们完成了：


基于 Django ORM 的 Q和icontains 实现多字段模糊匹配；


将搜索逻辑无缝嵌入原有 sku 列表视图；

在模板中提供了回显关键词、高亮标题还有分页参数保持机制；

给出了可选的全局快速搜索入口和性能提醒。


下一篇将详细讨论如何为大规模数据集调整查询 —— 包括建立全文索引还有如何平衡查询速度与程序资源消耗。我们也会补充一个，让你的电商网站既快又稳。

如果你想进一步提高自己的技术视野。可以关注我的公众号「IT策士」和今日头条账号，同步获取更多实战案例与架构思考。

这篇文章为《Django 从 零 到 建立完整电商网站》系列第 N 篇.