淘淘商城——首页跳转到搜索页面

通过上文的学习,我们已经学会如何把商品数据导入到索引库中了,本文我会教大家如何从淘淘商城首页跳转到搜索页面。
我们要访问taotao-portal-web工程就要先启动Redis服务,大家根据自己使用的情况启动,使用的是单机版就启动单机版服务器,使用的是集群就启动集群版服务器。
启动好taotao-portal-web工程之后,我们访问淘淘商城首页,如下图所示。
这里写图片描述
该首页对应的后台代码如下图所示,在index.jsp页面当中是没有搜索相关代码的,那么这部分代码在哪儿呢?其实是在commons目录下的header.jsp页面当中。
这里写图片描述
header.jsp页面的代码如下图所示,可以看到在搜索框中输入搜索关键词之后,回车或者点击”搜索”按钮可触发search方法,但我们发现在整个header.jsp页面当中并没有search方法,那么search方法在哪儿定义的呢?其实是在页面引用的src=”/js/base-v1.js”当中。
这里写图片描述
我们打开base-v1.js文件,可发现在base-v1.js文件中有search这个方法,如下图所示,它指定的访问端口是8082,我们要把它改成8085,,因为8085对应着我们的taotao-search-web工程。
这里写图片描述
接下来我们使用tomcat插件启动的方式启动taotao-search-web工程,方法是在工程上右键→Run As→Maven build…,会看到如下图所示的对话框,在Goals一栏输入”clean tomcat7:run”。然后点击”Apply”,之后点击”Run”启动该工程。
这里写图片描述
我们在淘淘商城首页的搜索框中输入”手机”然后点击搜索按钮,会看到如下图所示界面,可以看到已经正确跳转到搜索系统工程中了,只是我们的搜索功能还没完成因此现在访问是报404错误的。
这里写图片描述
下面我们来分析一下搜索功能的实现,我们首先把下图所示的搜索工程的静态资源放到搜索系统工程当中。
这里写图片描述

这里写图片描述
在淘淘商城这个项目中,我们的商品搜索页面只需进行查询和分页即可,现在也不用像京东做的这么复杂,练习嘛,我们就不使用过滤条件、排序等功能了,我们只实现查询和分页功能,正如下图这样。
这里写图片描述
我们再到搜索系统工程中的search.jsp页面查看一下代码,可以看到搜索页面由总页数totalPages和搜索出来的内容列表itemList组成,而且可能会用到查询总数量,这些我们应该放到一个pojo当中。
这里写图片描述
由于搜索服务和搜索系统这两个工程都需要用到这个pojo,因此我们还是把这个pojo放到taotao-common当中比较合适,如下图所示。
这里写图片描述
注意该类一定要实现序列化接口!!
为方便大家复制,现将该类的代码贴出。

public class SearchResult implements Serializable {
    // 总页数
    private Long totalPage;
    // 总数量
    private Long totalNumber;
    // 查询出的商品列表
    private List<SearchItem> itemList;
    public Long getTotalPage() {
        return totalPage;
    }
    public void setTotalPage(Long totalPage) {
        this.totalPage = totalPage;
    }
    public Long getTotalNumber() {
        return totalNumber;
    }
    public void setTotalNumber(Long totalNumber) {
        this.totalNumber = totalNumber;
    }
    public List<SearchItem> getItemList() {
        return itemList;
    }
    public void setItemList(List<SearchItem> itemList) {
        this.itemList = itemList;
    }
}

猜你喜欢

转载自blog.csdn.net/a_blackmoon/article/details/80480128