商城-商品搜索（品牌统计、规格统计、条件筛选、搜索分页排序、高亮显示）

最新推荐文章于 2025-02-16 14:06:31 发布

ZHOU_VIP

最新推荐文章于 2025-02-16 14:06:31 发布

阅读量1.5k

点赞数 1

分类专栏：畅购商城

本文链接：https://blog.youkuaiyun.com/ZHOU_VIP/article/details/118312482

版权

畅购商城专栏收录该内容

41 篇文章

订阅专栏

用户搜索的时候，除了使用分类搜索外，还有可能使用品牌搜索，所以我们还需要显示品牌数据和

规格数据，品牌数据和规格数据的显示比较容易，都可以考虑使用分类统计的方式进行分组实现。

1 品牌统计

看下面的SQL语句，我们在执行搜索的时候，第1条SQL语句是执行搜，第2条语句是根据品牌名字

分组查看有多少品牌，大概执行了2个步骤就可以获取数据结果以及品牌统计，我们可以发现他们

的搜索条件完全一样。

-- 查询所有
SELECT * FROM tb_sku WHERE name LIKE '%手机%';
-- 根据品牌名字分组查询
SELECT brand_name FROM  tb_sku WHERE name LIKE '%手机%' GROUP BY brand_name;

我们每次执行搜索的时候，需要显示商品品牌名称，这里要显示的品牌名称其实就是符合搜素条件

的所有商品的品牌集合，我们可以按照上面的实现思路，使用ES根据分组名称做一次分组查询即

可实现。

修改search微服务的com.changgou.search.service.impl.SkuServiceImpl类，

添加一个品牌分组搜索

添加的代码如下:

//设置分组条件  商品品牌
nativeSearchQueryBuilder.addAggregation(AggregationBuilders.terms("skuBrandgroup").field("brandName").size(50));


//获取分组结果  商品品牌
StringTerms stringTermsBrand = (StringTerms) skuPage.getAggregation("skuBrandgroup");
List<String> brandList = getStringsBrandList(stringTermsBrand);


resultMap.put("brandList", brandList);


/**
 * 获取品牌列表
 *
 * @param stringTermsBrand
 * @return
 */
private List<String> getStringsBrandList(StringTerms stringTermsBrand) {
    List<String> brandList = new ArrayList<>();
    if (stringTermsBrand != null) {
        for (StringTerms.Bucket bucket : stringTermsBrand.getBuckets()) {
            brandList.add(bucket.getKeyAsString());
        }
    }
    return brandList;
}

测试：

http://localhost:18085/search

和下面规格一起测试

---------------------------------------------------------------------------------------------------------------------------------

2 规格统计

用户搜索的时候，除了使用分类、品牌搜索外，还有可能使用规格搜索，所以我们还需要显示规格

数据，规格数据的显示相比上面2种实现略微较难一些，需要对数据进行处理，我们也可以考虑使

用分类统计和品牌统计的方式进行分组实现。

看下面的SQL语句，我们在执行搜索的时候，第1条SQL语句是执行搜，第2条语句是根据规格分组

查看有多少规格，大概执行了2个步骤就可以获取数据结果以及规格统计，我们可以发现他们的搜

索条件完全一样。

-- 查询所有
SELECT * FROM tb_sku WHERE name LIKE '%手机%';
-- 根据规格名字分组查询
SELECT spec FROM  tb_sku WHERE name LIKE '%手机%' GROUP BY spec;

上述SQL语句执行后的结果如下图：

获取到的规格数据我们发现有重复，不过也可以解决，解决思路如下：

1.获取所有规格数据
2.将所有规格数据转换成Map
3.定义一个Map<String,Set>,key是规格名字，防止重复所以用Map，valu是规格值，规格值有多个，所以用集合，为了防止规格重复，用Set去除重复
4.循环规格的Map，将数据填充到定义的Map<String,Set>中

我们每次执行搜索的时候，需要显示商品规格数据，这里要显示的规格数据其实就是符合搜素条件

的所有商品的规格集合，我们可以按照上面的实现思路，使用ES根据分组名称做一次分组查询，

并去除重复数据即可实现。

修改search微服务的com.changgou.search.service.impl.SkuServiceImpl类，添加一个规格分组搜

索：

//设置分组条件  商品的规格
nativeSearchQueryBuilder.addAggregation(AggregationBuilders.terms("skuSpecgroup").field("spec.keyword").size(100));


//获取分组结果  商品规格数据
StringTerms stringTermsSpec = (StringTerms) skuPage.getAggregation("skuSpecgroup");
Map<String, Set<String>> specMap = getStringSetMap(stringTermsSpec);


resultMap.put("specMap", specMap);


/**
     * 获取规格列表数据
     *
     * @param stringTermsSpec
     * @return
     */
private Map<String, Set<String>> getStringSetMap(StringTerms stringTermsSpec) {
    Map<String, Set<String>> specMap = new HashMap<String, Set<String>>();
    Set<String> specList = new HashSet<>();
    if (stringTermsSpec != null) {
        for (StringTerms.Bucket bucket : stringTermsSpec.getBuckets()) {
            specList.add(bucket.getKeyAsString());
        }
    }
    for (String specjson : specList) {
        Map<String, String> map = JSON.parseObject(specjson, Map.class);
        for (Map.Entry<String, String> entry : map.entrySet()) {//
            String key = entry.getKey();        //规格名字
            String value = entry.getValue();    //规格选项值
            //获取当前规格名字对应的规格数据
            Set<String> specValues = specMap.get(key);
            if (specValues == null) {
                specValues = new HashSet<String>();
            }
            //将当前规格加入到集合中
            specValues.add(value);
            //将数据存入到specMap中
            specMap.put(key, specValues);
        }
    }
    return specMap;
}

测试：

http://localhost:18085/search

。。。

---------------------------------------------------------------------------------------------------------------------------------

3 条件筛选

用户有可能会根据分类搜索、品牌搜索，还有可能根据规格搜索，以及价格搜索和排序操作。根据

分类和品牌搜索的时候，可以直接根据指定域搜索，而规格搜索的域数据是不确定的，价格是一个

区间搜索，所以我们可以分为三段时间，先实现分类、品牌搜素，再实现规格搜索，然后实现价格

区间搜索。

3.1 分类、品牌筛选

页面每次向后台传入对应的分类和品牌，后台据分类和品牌进行条件过滤即可。

修改搜索微服务com.changgou.search.service.impl.SkuServiceImpl的search方法，添加分类和品

牌过滤，添加过滤条件如下:

BoolQueryBuilder boolQueryBuilder = QueryBuilders.boolQuery();


if (!StringUtils.isEmpty(searchMap.get("brand"))) {
	boolQueryBuilder.filter(QueryBuilders.termQuery("brandName", searchMap.get("brand")));
}

if (!StringUtils.isEmpty(searchMap.get("category"))) {
	boolQueryBuilder.filter(QueryBuilders.termQuery("categoryName", searchMap.get("category")));
}


//构建过滤查询
nativeSearchQueryBuilder.withFilter(boolQueryBuilder);

测试：

http://localhost:18085/search

。。。

---------------------------------------------------------------------------------------------------------------------------------

3.2 规格过滤

规格这一块，需要向后台发送规格名字以及规格值，我们可以按照一定要求来发送数据，例如规格

名字以特殊前缀提交到后台：spec_网络制式：电信4G、spec_显示屏尺寸：4.0-4.9英寸

后台接到数据后，可以根据前缀spec_来区分是否是规格，如果以spec_xxx开始的数据则为规格数

据，需要根据指定规格找信息。

上图是规格的索引存储格式，真实数据在spechMap.规格名字.keyword中，所以找数据也是按照如

下格式去找：

spechMap.规格名字.keyword

修改com.changgou.search.service.impl.SkuServiceImpl的search方法，增加规格查询操作，代码

如下：

//规格过滤查询
if (searchMap != null) {
    for (String key : searchMap.keySet()) {
        if (key.startsWith("spec_")) {
            boolQueryBuilder.filter(QueryBuilders.termQuery("specMap." + key.substring(5) + ".keyword", searchMap.get(key)));
        }
    }
}

测试：

http://localhost:18085/search

。。。

---------------------------------------------------------------------------------------------------------------------------------

3.3 价格区间查询

价格区间查询，每次需要将价格传入到后台，前端传入后台的价格大概是price=0-500或者

price=500-1000依次类推，最后一个是price=3000,后台可以根据-分割，如果分割得到的结果最多

有2个，第1个表示x<price，第2个表示price<=y。

//价格过滤查询
String price = searchMap.get("price");
if (!StringUtils.isEmpty(price)) {
    String[] split = price.split("-");
    if (!split[1].equalsIgnoreCase("*")) {
        boolQueryBuilder.filter(QueryBuilders.rangeQuery("price").from(split[0], true).to(split[1], true));
    } else {
        boolQueryBuilder.filter(QueryBuilders.rangeQuery("price").gte(split[0]));
    }
}

测试：

http://localhost:18085/search

。。。

---------------------------------------------------------------------------------------------------------------------------------

4 搜索分页

页面需要实现分页搜索，所以我们后台每次查询的时候，需要实现分页。用户页面每次会传入当前

页和每页查询多少条数据，当然如果不传入每页显示多少条数据，默认查询30条即可。

分页使用PageRequest.of( pageNo- 1, pageSize);实现，第1个参数表示第N页，从0开始，第2个

参数表示每页显示多少条，实现代码如下：

//略

//构建过滤查询
nativeSearchQueryBuilder.withFilter(boolQueryBuilder);

//构建分页查询
Integer pageNum = 1;
if (!StringUtils.isEmpty(searchMap.get("pageNum"))) {
	try {
		pageNum = Integer.valueOf(searchMap.get("pageNum"));
	} catch (NumberFormatException e) {
		e.printStackTrace();
		pageNum=1;
	}
}
Integer pageSize = 3;
nativeSearchQueryBuilder.withPageable(PageRequest.of(pageNum - 1, pageSize));

//略


//4.构建查询对象
NativeSearchQuery query = nativeSearchQueryBuilder.build();
//略

测试：

http://localhost:18085/search

。。。

---------------------------------------------------------------------------------------------------------------------------------

5 搜索排序

排序这里总共有根据价格排序、根据评价排序、根据新品排序、根据销量排序，排序要想实现非常

简单，只需要告知排序的域以及排序方式即可实现。

价格排序：只需要根据价格高低排序即可，降序价格高->低，升序价格低->高

评价排序：评价分为好评、中评、差评，可以在数据库中设计3个列，用来记录好评、中评、差评

的量，每次排序的时候，好评的比例来排序，当然还要有条数限制，评价条数需要超过N条。

新品排序：直接根据商品的发布时间或者更新时间排序。

销量排序：销量排序除了销售数量外，还应该要有时间段限制。

这里我们不单独针对某个功能实现排序，我们只需要在后台接收2个参数，分别是排序域名字和排

序方式，代码如下：

解释: 前端页面传递要排序的字段(field)和要排序的类型(ASC,DESC),后台接收.

代码如下：

//构建排序查询
String sortRule = searchMap.get("sortRule");
String sortField = searchMap.get("sortField");
if (!StringUtils.isEmpty(sortRule) && !StringUtils.isEmpty(sortField)) {
    nativeSearchQueryBuilder.withSort(SortBuilders.fieldSort(sortField).order(sortRule.equals("DESC") ? SortOrder.DESC : SortOrder.ASC));
}

测试

根据价格降序：

{"keywords":"手机","pageNum":"1","sortRule":"DESC","sortField":"price"}

根据价格升序：

{"keywords":"手机","pageNum":"1","sortRule":"ASC","sortField":"price"}

---------------------------------------------------------------------------------------------------------------------------------

6 高亮显示

高亮显示是指根据商品关键字搜索商品的时候，显示的页面对关键字给定了特殊样式，让它显示更

加突出，如上图商品搜索中，关键字编程了红色，其实就是给定了红色样式。

实现步骤：

将之前的搜索换掉，换成高亮搜索，我们需要做3个步骤：

1.指定高亮域，也就是设置哪个域需要高亮显示
  设置高亮域的时候，需要指定前缀和后缀，也就是关键词用什么html标签包裹，再给该标签样式
2.高亮搜索实现
3.将非高亮数据替换成高亮数据

第1点，例如在百度中搜索数据的时候，会有2个地方高亮显示，分别是标题和描述，商城搜索的时

候，只是商品名称高亮显示了。而高亮显示其实就是添加了样式，

例如<span style="color:red;">笔记本</span>,而其中span开始标签可以称为前缀，span结束标

签可以称为后缀。

第2点，高亮搜索使用ElasticsearchTemplate实现。

第3点，高亮搜索后，会搜出非高亮数据和高亮数据，高亮数据会加上第1点中的高亮样式，此时我

们需要将非高亮数据换成高亮数据即可。例如非高亮:华为笔记本性能超强悍

高亮数据：华为<span style="color:red;"笔记本</span>性能超强悍,将非高亮的换成高亮的，到

页面就能显示样式了。

修改com.changgou.search.service.impl.SkuServiceImpl的search方法搜索代码，添加高亮显示的

域:

//设置高亮条件
nativeSearchQueryBuilder.withHighlightFields(new HighlightBuilder.Field("name"));
nativeSearchQueryBuilder.withHighlightBuilder(new HighlightBuilder().preTags("<em style=\"color:red\">").postTags("</em>"));

//设置主关键字查询
nativeSearchQueryBuilder.withQuery(QueryBuilders.multiMatchQuery(keywords,"name","brandName","categoryName"));

修改查询的方法，自定义结果映射器：

AggregatedPage<SkuInfo> skuPage = esTemplate.queryForPage(query, SkuInfo.class, new SearchResultMapperImpl());

自定义一个映射结果类实现接口，作用就是：自定义映射结果集，获取高亮的数据展示

public class SearchResultMapperImpl implements SearchResultMapper {
    @Override
    public <T> AggregatedPage<T> mapResults(SearchResponse response, Class<T> clazz, Pageable pageable) {
        List<T> content = new ArrayList<>();
        //如果没有结果返回为空
        if (response.getHits() == null || response.getHits().getTotalHits() <= 0) {
            return new AggregatedPageImpl<T>(content);
        }
        for (SearchHit searchHit : response.getHits()) {
            String sourceAsString = searchHit.getSourceAsString();
            SkuInfo skuInfo = JSON.parseObject(sourceAsString, SkuInfo.class);

            Map<String, HighlightField> highlightFields = searchHit.getHighlightFields();
            HighlightField highlightField = highlightFields.get("name");

            //有高亮则设置高亮的值
            if (highlightField != null) {
                StringBuffer stringBuffer = new StringBuffer();
                for (Text text : highlightField.getFragments()) {
                    stringBuffer.append(text.string());
                }
                skuInfo.setName(stringBuffer.toString());
            }
            content.add((T) skuInfo);
        }


        return new AggregatedPageImpl<T>(content, pageable, response.getHits().getTotalHits(), response.getAggregations(), response.getScrollId());
    }
}

测试：

http://localhost:18085/search

。。。

---------------------------------------------------------------------------------------------------------------------------------