淘淘商城系列（二）—— 商品列表查询（十）

我不是女神ヾ 2022-04-04 13:16 288阅读 0赞

现在万事俱备，东风也不欠了，所有的准备工作都已经继续，目前我们把商品列表查询出来。

商品列表长这个样子

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70][]

首先，我们先把静态页面添加到taotao-manager-web工程中的WEB-INF下

![20181217161711285.png][]

静态页面下载地址：[淘淘商城后台管理系统静态页面][Link 1]

**为什么要把这些文件放到WEB-INF目录下面呢？**

WEB-INF 是受保护目录，WEB-INF里面的文件只可以由servlet去访问，不能通过url地址栏去请求访问，所以放在该目录下面，能有效提高这些文件的安全性。

由于在web.xml中定义的url拦截形式为“/”表示拦截所有的url请求，包括静态资源例如css、js等。所以需要在springmvc.xml中添加资源映射标签：

<mvc:resources location="/WEB-INF/js/" mapping="/js/**"/>
    <mvc:resources location="/WEB-INF/css/" mapping="/css/**"/>

当然你也可以使用这个

<mvc:default-servlet-handler/>

都是可以的。

接下来我们要显示静态的页面，找到首页index.jsp

![20181217164948684.png][]

分析:

**首页的请求地址：/**

**请求参数**：无

**返回值**：index.jsp （首页）

创建PageController类

/**
     * 显示页面
     * @author Administrator
     *
     */
    
    @Controller
    public class PageController {
    
    	@RequestMapping("/")
    	public String showIndex(){
    		return "index";
    	}
    	
    }

如果webapp下的目录有index.jsp，就删掉，没有就忽略。

重启我们的taotao-manager-web项目，然后访问[http://localhost:8081/][http_localhost_8081]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 1][]

成功显示该页面，后台管理系统就是这样子了

还有点小问题，当我们切换页面的时候，在浏览器里面F12查看一下

![20181217170037374.png][]

点击两个分类之后，显示404

![20181217170102450.png][]

再去看看我们的index.jsp页面

我们现在能显示首页，但是菜单页显示404，各个超链接之间是不是有规律的呢？请求的是什么，返回的就是什么，这样我们是不是要修改一下我们的PageController，增加一个方法，修改如下

/**
     * 显示页面
     * @author Administrator
     *
     */
    
    @Controller
    public class PageController {
    
    	@RequestMapping("/")
    	public String showIndex(){
    		return "index";
    	}
    	
    	/**
    	 * 展示菜单页面
    	 * url：item-list
    	 * @param page
    	 * @return
    	 */
    	@RequestMapping("/{page}")
    	public String showItemList(@PathVariable String page){
    		return page;
    	}
    	
    }

再次访问我们的后台管理系统，进入查询商品页面

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 2][]

**对应的jsp****为**：item-list.jsp

**请求的url****：**/item/list

**请求的参数：**page=1&rows=30

**响应的json****数据格式：**

Easyui中datagrid控件要求的数据格式为： \{total:”2”,rows:\[\{“id”:”1”,”name”:”张三”\},\{“id”:”2”,”name”:”李四”\}\]\}

![20181217170650785.png][]

响应的json数据格式，我们抽离出了一个类EasyUIDataGridResult，加入它。

创建此类放入taotao-common中，包名com.taotao.common.pojo

package com.taotao.common.pojo;
    
    import java.util.List;
    
    /**
     * 商品列表查询的返回的数据类
     * 
     * @author Administrator
     *
     */
    public class EasyUIDataGridResult {
    	private Integer total;
    	private List rows;
    
    	public Integer getTotal() {
    		return total;
    	}
    
    	public void setTotal(Integer total) {
    		this.total = total;
    	}
    
    	public List getRows() {
    		return rows;
    	}
    
    	public void setRows(List rows) {
    		this.rows = rows;
    	}
    
    }

这么多条数据，肯定是要进行分页处理的，但是逆向工程生成的代码是不支持分页处理的，如果想进行分页需要自己编写mapper，这样就失去逆向工程的意义了。为了提高开发效率可以使用mybatis的分页插件PageHelper。

如果你也在用Mybatis，建议尝试该分页插件，这个一定是最方便使用的分页插件。该插件目前支持Oracle,Mysql,MariaDB,SQLite,Hsqldb,PostgreSQL六种数据库分页。

第一步：把PageHelper依赖的jar包添加到工程中。官方提供的代码对逆向工程支持的不好，使用参考资料中的pagehelper-fix。

下载地址：[pagehelper-fix/pagehelper 淘淘商城MyBatis分页插件][pagehelper-fix_pagehelper _MyBatis]

import的时候记得选择这个

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 3][]

导入好之后

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 4][]

使用参考资料中的工程 ，将其导入到eclipse 使用maven 安装到本地仓库。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 5][]

第二步：在Mybatis的全局文件中配置SqlMapConfig.xml中配置拦截器插件:

第三步：在代码中使用

1、设置分页信息：

//获取第1页，10条内容，默认查询总数count
    PageHelper.startPage(1, 10);
    
    //紧跟着的第一个select方法会被分页
    List<Country> list = countryMapper.selectIf(1);

2、取分页信息第一种方法

//分页后，实际返回的结果list类型是Page<E>，如果想取出分页信息，需要强制转换为Page<E>，
    Page<Country> listCountry = (Page<Country>)list;
    listCountry.getTotal();

3、取分页信息的第二种方法，推荐使用第二种

//获取第1页，10条内容，默认查询总数count
    
    PageHelper.startPage(1, 10);
    
    List<Country> list = countryMapper.selectAll();
    
    //用PageInfo对结果进行包装
    
    PageInfo page = new PageInfo(list);
    
    //测试PageInfo全部属性
    
    //PageInfo包含了非常全面的分页属性
    
    assertEquals(1, page.getPageNum());
    
    assertEquals(10, page.getPageSize());
    
    assertEquals(1, page.getStartRow());
    
    assertEquals(10, page.getEndRow());
    
    assertEquals(183, page.getTotal());
    
    assertEquals(19, page.getPages());
    
    assertEquals(1, page.getFirstPage());
    
    assertEquals(8, page.getLastPage());
    
    assertEquals(true, page.isFirstPage());
    
    assertEquals(false, page.isLastPage());
    
    assertEquals(false, page.isHasPreviousPage());
    
    assertEquals(true, page.isHasNextPage());

之后我们来测试一下，在taotao-manager-service的测试目录下，创建测试用例

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 6][]

代码如下

public class TestPageHelper {
    
    	@Test
    	public void testHelper() {
    		ApplicationContext applicationContext = new ClassPathXmlApplicationContext(
    				"classpath:spring/applicationContext-*.xml");
    		// 获得Mapper的代理对象
    		TbItemMapper itemMapper = applicationContext.getBean(TbItemMapper.class);
    		// 设置分页信息
    		PageHelper.startPage(1, 30);
    		// 执行查询
    		TbItemExample example = new TbItemExample();
    		List<TbItem> list = itemMapper.selectByExample(example);
    		// 取分页信息
    		PageInfo<TbItem> pageInfo = new PageInfo<>(list);
    		System.out.println(pageInfo.getTotal());
    		System.out.println(pageInfo.getPages());
    		System.out.println(pageInfo.getPageNum());
    		System.out.println(pageInfo.getPageSize());
    	}
    
    }

启动它，注意：启动的时候，记得把其他项目都停止。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 7][]

打印结果，成功分页了。

### 接下来开发Service层 ###

参数：int page ，int rows

业务逻辑：查询所有商品列表，要进行分页处理。

返回值：EasyUIDataGridResult

现在taotao-manager项目中添加依赖：

<dependencies>
    	
    	<dependency>
    		<groupId>com.taotao</groupId>
    		<artifactId>taotao-common</artifactId>
    		<version>0.0.1-SNAPSHOT</version>
    	</dependency>
    
    </dependencies>

**在taotao-manager-interface项目创建接口**

public interface ItemService {
    	//查询商品列表
    	public EasyUIDatagridResult getItemList(int page,int rows);
    }

**在taotao-manager-service项目创建实现类**

@Service
    public class ItemServiceImpl implements ItemService {
    
    	@Autowired
    	private TbItemMapper itemMapper; 
    	
    	@Override
    	public EasyUIDataGridResult getItemList(int page, int rows) {
    		//1.设置分页的信息 使用pagehelper
    		if(page == null) page = 1;
    		if(rows == null) rows = 30;
    		PageHelper.startPage(page, rows);
    		//2.注入mapper
    		//3.创建example 对象 不需要设置查询条件
    		TbItemExample example = new TbItemExample();
    		//4.根据mapper调用查询所有数据的方法
    		List<TbItem> list = mapper.selectByExample(example);
    		//5.获取分页的信息
    		PageInfo<TbItem> info = new PageInfo<>(list);
    		//6.封装到EasyUIDataGridResult
    		EasyUIDataGridResult result = new EasyUIDataGridResult();
    		result.setTotal((int)info.getTotal());
    		result.setRows(info.getList());
    		//7.返回
    		return result;
    
    	}
    
    }

**发布服务**

在taotao-manager-service中的applicationContext-service.xml中发布服务：

注意address的值：使用自己的zookeeper所在的系统的ip地址和端口

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 8][]

**开发表现层**

在taotao-manager-web工程中的springmvc.xml中引入服务：

注意address的值：使用自己的zookeeper所在的系统的ip地址和端口

![20181217181952907.png][]

**在taotao-manager-web项目中创建**

1、初始化表格请求的url：/item/list

2、Datagrid默认请求参数：

1.  page：当前的页码，从1开始。
2.  rows：每页显示的记录数。
3.  响应的数据：json数据。EasyUIDataGridResult

@Controller
    public class ItemController {
    
    	@Autowired
    	private ItemService itemService;
    	
    	@RequestMapping("/item/list")
    	@ResponseBody
    	public EasyUIDataGridResult getItemList(Integer page, Integer rows) {
    		EasyUIDataGridResult result = itemService.getItemList(page, rows);
    		return result;
    	}
    	
    }

可以设置服务超时时间：

服务调用超时时间默认1秒，如下：在服务层和表现层都可以设置超时时间。

![20181217182326188.png][]

** 都创建好之后，进行测试**

需要先启动zookeeper,再启动服务层，再启动表现层。

如果先启动表现层，后启动服务层，会报错，但是不影响使用。

为了更方便的进行测试，表现层工程和服务层工程属于不同的工程，要debug的时候需要设置源码，如下：

Debug设置源代码，涉及到工程都要添加，为了方便，可以添加所有的工程。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 9][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 10][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 11][]

分别对taotao-common项目、taotao-manager和表现层安装，然后运行

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 12][]

对这个类增加序列化，然后重新安装启动。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 13][]

大功告成！！！

错误：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 14][]

说明：反序列化时，使用Page<E>  ,在表现层没有这个CLASS ，在web层需要加入pagehelper的jar包即可。当然可以不管。

1.maven命令安装jar包时跳过测试：clean install -DskipTests

表示先清理再安装，打包时跳过测试。

2.还可以使用跳过测试的插件:maven-sufire-plugin

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 15][]

<build>
    		<plugins>
    			
    			<plugin>
    				<groupId>org.apache.maven.plugins</groupId>
    				<artifactId>maven-surefire-plugin</artifactId>
    				
    				<configuration>
    					<skipTests>true</skipTests>
    				</configuration>
    			</plugin>
    		</plugins>
    	</build>

### **记录一个错误！！！** ###

点击查询商品功能时，项目中使用mybatis的分页插件pagehelper出现下面的警告

![2018122415581854][]

出现上面的警告，并不影响程序的运行。但是毕竟看着比较闹心。

分析发现：出现上面的警告的原因是因为序列化和反序列化过程没有找到Page这个类。

要想解决上述问题，只需要在对应的业务层的pom.xml配置文件中加入pagehelper的依赖即可。

<dependency>
          <groupId>com.github.pagehelper</groupId>
          <artifactId>pagehelper</artifactId>
    </dependency>

即在taotao-manager-web项目的pom.xml文件中加入该依赖就可以了。

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70]: /images/20220404/af4af77590394840bb957c8edaeaf03f.png
[20181217161711285.png]: /images/20220404/cbd100f20ea848d6b955dc4cd44d7bf0.png
[Link 1]: https://download.csdn.net/download/lkp1603645756/10856083
[20181217164948684.png]: /images/20220404/33a7d9147429484599ab55b70df9e52f.png
[http_localhost_8081]: http://localhost:8081/
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 1]: /images/20220404/5b2e7c1171564b4f94f176c7902d1a9d.png
[20181217170037374.png]: /images/20220404/7c8f95dcabd140e4bcd504df49bc7f71.png
[20181217170102450.png]: /images/20220404/d3c9cb1242694d90934566c3404d2f38.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 2]: /images/20220404/752b5a7d17b840a588a646086bef5394.png
[20181217170650785.png]: /images/20220404/844fdc27212e48099f0ba44bcaa0dd40.png
[pagehelper-fix_pagehelper _MyBatis]: https://download.csdn.net/download/lkp1603645756/10856415
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 3]: /images/20220404/8f6a8d34be8649b9b7173119463907dd.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 4]: /images/20220404/1681f548bc614041ad67e110a25f34cb.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 5]: /images/20220404/429084454af540679b768348b767ee86.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 6]: /images/20220404/58f5fa6918864ae78b1246cb9d3a0dd7.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 7]: /images/20220404/16661df5e32146abb2c04e2347d1804d.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 8]: /images/20220404/60df4bc87ae446fbb5fe839b8fbcfc1a.png
[20181217181952907.png]: /images/20220404/2fc698aa99fb4b66a964769c985307a8.png
[20181217182326188.png]: /images/20220404/0d9ab31fb5b040d094baf5f61b3d4e73.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 9]: /images/20220404/eac6d27c56764a9aad24cae575b9d59b.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 10]: /images/20220404/0d0433125ae14f9f8853b80f1086a933.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 11]: /images/20220404/a5b3e1db655e44c0b6b0e511d8ab0a46.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 12]: /images/20220404/a83f19470db54dbb96a1685d34931617.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 13]: /images/20220404/ed9a45b0bfb34cb5ad527cd1ff204a14.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 14]: /images/20220404/095f5a0f3f644c88af69233f85777c52.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xrcDE2MDM2NDU3NTY_size_16_color_FFFFFF_t_70 15]: /images/20220404/630ca2630627470fb2b89db7630e2c5d.png
[2018122415581854]: /images/20220404/39580e90fa9c42488a08e39b2b0e49ff.png