前言

根据微服务自治理念，我们可以将项目中需要ES检索的业务统一维护在检索微服务模块中。

一、搭建页面环境

SpringBoot项目默认读取静态界面名称要命名为index.html，不然项目读取不到静态资源。

1.1 静态界面搭建

将检索相关的静态界面拷贝到gulimall-search项目中templates目录下，并且将项目路径href和src都改为/static/search/开头，统一路径。

1.2 Nginx 动静分离

利用Nginx动静分离的特点，我们将静态资源放在服务器中/mydata/nginx/html/static/目录下，当前端发送静态资源请求时，直接到静态资源目录下获取静态资源文件。避免通过gateway进入后端微服务，减轻后端微服务的压力。

1.以后将所有项目的静态资源都应该放在nginx里面
2.规则:/mydata/nginx/html/static/ 目录下所有请求都由nginx直接返回

1.3 Windows 上传文件

递归创建目录，检索服务相关的静态资源放在该目录下

mkdir -p /mydata/nginx/html/static/search/

win + r 输入如下命令，将本地文件上传到 Linux 指定的目录下

scp E:\gulimall\官方资料\代码\html\搜索页\font.zip root@192.168.57.129:/mydata/nginx/html/static/search/

1.4 引入 thymeleaf 依赖

检索页动态资源index.html复制到gulimall-search微服务下的templates目录下。pom.xml引入thymeleaf和devtools 依赖。

<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-devtools</artifactId>
</dependency>

将src=" 和href="的资源引用，全局替换为如下地址：

src="/static/search
href="/static/search

1.5 Nginx 反向代理

1.4 Nginx 配置

将gulimall.com 和*.gulimall.com的域名都转发给Nginx网关

server {listen       80;server_name  gulimall.com *.gulimall.com;#charset koi8-r;#access_log  /var/log/nginx/log/host.access.log  main;location /static/ {root  /usr/share/nginx/html;}location / {proxy_set_header Host $host;proxy_pass http://gulimall;}#error_page  404              /404.html;# redirect server error pages to the static page /50x.htmlerror_page   500 502 503 504  /50x.html;location = /50x.html {root   /usr/share/nginx/html;}
}

1.5 gateway 网关配置

spring:cloud:gateway:routes:- id: gulimall_search_routeuri: lb://gulimall-searchpredicates:- Host=search.gulimall.com

访问search.gulimall.com，能够转发到静态检索页

二、调整页面跳转

2.1 引入依赖

关闭thymeleaf缓存

spring.thymeleaf.cache=false

引入devtools热加载

<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-devtools</artifactId>
</dependency>

点击谷粒商城能够跳转到gulimall.com首页

将地址改为http://gulimall.com

2.2 页面跳转

1. 首页输入检索关键字，能够跳转到检索服务；
2. 通过商品三级分类，能够跳转到检索服务；
   

关键代码

<script type="text/javascript">function search() {var keyword=$("#searchText").val()window.location.href="http://search.gulimall.com/list.html?keyword="+keyword;}
</script>

三、检索查询参数模型分析抽取

3.1 检索业务分析

商品检索三个入口：
1.选择分类进入商品检索

2.输入检索关键字展示检索页

3.选择筛选条件进入

检索条件&排序条件：

• 全文检索：skuTitle
• 排序：saleCount、hotScore、skuPrice
• 过滤：hasStock、skuPrice区间、brandId、catalogId、attrs
• 聚合：attrs

完整的url参数，具体操作可参考京东搜索界面：

• keyword=小米&sort=saleCount_desc/asc&hasStock=0/1&skuPrice=400_1900&brandId=1 &catalogId=1&attrs=1_3G:4G:5G&attrs=2_骁龙845&attrs=4_高清屏

3.2 检索语句构建

@Data
public class SearchParam {/*** 页面传递过来的全文匹配关键字*/private String keyword;/*** 三级分类id*/private Long catalog3Id;/*** 排序条件* sort=saleCount_asc/desc* sort=skuPrice_asc/desc* sort=hotScore_asc/desc*/private String sort;/*** 好多的过滤条件* hasStock（是否有货）、skuPrice区间、brandId、catalog3Id、attrs* hasStock=0/1* skuPrice=1_500/_500/500_* brandId=1* attrs=2_5寸；6寸*//*** 是否只显示有货*/private Integer hasStock;/*** 价格区间查询*/private String skuPrice;/*** 按照品牌进行查询，可以多选*/private List<Long> brandId;/*** 按照属性进行筛选*/private List<String> attrs;/*** 页码*/private Integer pageNum = 1;/*** 原生的所有查询条件*/private String _queryString;
}

四、检索返回结果模型分析抽取

4.1 案例说明

以京东商城为例，当我们输入小米点击搜索时，可以检索出品牌名及图片，分类，商品属性名，属性值以及分页数据等小米的信息。

而这些数据是我们需要从ES中根据前端请求数据查询后返回给前端。

4.2 检索结果模型

@Data
public class SearchResult {/*** 查询到的所有商品信息*/private List<SkuEsModel> products;/*** 以下是分页信息*/private Integer pageNum;//当前页码private Long total;//总记录数private Integer totalPages;//总页码private List<Integer> pageNavs;/*** 当前查询到的结果，所有涉及到的品牌*/private List<BrandVo> brands;/*** 当前查询到的结果，所有涉及到的所有分类*/private List<CatalogVo> catalogs;/*** 当前查询到的结果，所有涉及到的所有属性*/private List<AttrVo> attrs;/*** 面包屑导航数据*/private List<NavVo> navs = new ArrayList<>();private List<Long> attrIds = new ArrayList<>();@Datapublic static class NavVo{private String navName;private String navValue;private String link;}@Datapublic static class BrandVo{private Long brandId;private String brandName;private String brandImg;}@Datapublic static class CatalogVo{private Long catalogId;private String catalogName;}@Datapublic static class AttrVo{private Long attrId;private String attrName;private List<String> attrValue;}
}

五、检索DSL测试

5.1 查询部分

5.2 聚合部分