(转) 淘淘商城系列——首页跳转到搜索页面

2021年11月20日 阅读数:4
这篇文章主要向大家介绍(转) 淘淘商城系列——首页跳转到搜索页面,主要内容包括基础应用、实用技巧、原理机制等方面,希望对大家有所帮助。



经过上文的学习,咱们已经学会如何把商品数据导入到索引库中了,本文我会教你们如何从淘淘商城首页跳转到搜索页面。 web

咱们要访问taotao-portal-web工程就要先启动Redis服务,你们根据本身使用的状况启动,使用的是单机版就启动单机版服务器,使用的是集群就启动集群版服务器。 tomcat

启动好taotao-portal-web工程以后,咱们访问淘淘商城首页,以下图所示。 服务器

(转) 淘淘商城系列——首页跳转到搜索页面_web工程

该首页对应的后台代码以下图所示,在index.jsp页面当中是没有搜索相关代码的,那么这部分代码在哪儿呢?实际上是在commons目录下的header.jsp页面当中。 jsp

(转) 淘淘商城系列——首页跳转到搜索页面_web工程_02

header.jsp页面的代码以下图所示,能够看到在搜索框中输入搜索关键词以后,回车或者点击”搜索”按钮可触发search方法,但咱们发如今整个header.jsp页面当中并无search方法,那么search方法在哪儿定义的呢?实际上是在页面引用的src=”/js/base-v1.js”当中。 ide

(转) 淘淘商城系列——首页跳转到搜索页面_tomcat_03

咱们打开base-v1.js文件,可发如今base-v1.js文件中有search这个方法,以下图所示,它指定的访问端口是8082,咱们要把它改为8085,,由于8085对应着咱们的taotao-search-web工程。 学习

(转) 淘淘商城系列——首页跳转到搜索页面_web工程_04

接下来咱们使用tomcat插件启动的方式启动taotao-search-web工程,方法是在工程上右键→Run As→Maven build…,会看到以下图所示的对话框,在Goals一栏输入”clean tomcat7:run”。而后点击”Apply”,以后点击”Run”启动该工程。 ui

(转) 淘淘商城系列——首页跳转到搜索页面_tomcat_05

咱们在淘淘商城首页的搜索框中输入”手机”而后点击搜索按钮,会看到以下图所示界面,能够看到已经正确跳转到搜索系统工程中了,只是咱们的搜索功能还没完成所以如今访问是报404错误的。 this

(转) 淘淘商城系列——首页跳转到搜索页面_tomcat_06

下面咱们来分析一下搜索功能的实现,咱们首先把下图所示的搜索工程的静态资源放到搜索系统工程当中。 spa

(转) 淘淘商城系列——首页跳转到搜索页面_搜索_07

(转) 淘淘商城系列——首页跳转到搜索页面_tomcat_08 

在淘淘商城这个项目中,咱们的商品搜索页面只需进行查询和分页便可,如今也不用像京东作的这么复杂,练习嘛,咱们就不使用过滤条件、排序等功能了,咱们只实现查询和分页功能,正以下图这样。 插件

(转) 淘淘商城系列——首页跳转到搜索页面_jsp页面_09

咱们再到搜索系统工程中的search.jsp页面查看一下代码,能够看到搜索页面由总页数totalPages和搜索出来的内容列表itemList组成,并且可能会用到查询总数量,这些咱们应该放到一个pojo当中。 

(转) 淘淘商城系列——首页跳转到搜索页面_jsp页面_10

因为搜索服务和搜索系统这两个工程都须要用到这个pojo,所以咱们仍是把这个pojo放到taotao-common当中比较合适,以下图所示。 

(转) 淘淘商城系列——首页跳转到搜索页面_tomcat_11

注意该类必定要实现序列化接口!! 

为方便你们复制,现将该类的代码贴出。

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;
}
}