家居网购项目实现03

8.功能07-后台管理 显示家居

8.1需求分析/图解

1. 给后台管理提供独立登录页面，管理员登录地址不对外公开
2. 管理员登录成功后，显示管理菜单页面
3. 管理员点击家居管理，显示所有家居信息

8.2思路分析

ps：实现管理员登录功能，方案一是将管理员视为member，添加到member表中，为了区别管理员和用户的权限，添加一个字段即可；方案二是重新创建一张admin表，单独存储admin信息。

这里采用方案二。

8.3代码实现

8.3.1admin表和furn表

admin表：

-- 创建admin表
CREATE TABLE `admin`(
`id` INT PRIMARY KEY AUTO_INCREMENT,
`username` VARCHAR(32) NOT NULL UNIQUE,
`password` VARCHAR(32) NOT NULL,
`email` VARCHAR(64) 
)CHARSET utf8 ENGINE INNODB;

-- 插入测试数据
INSERT INTO admin (`username`,`password`,`email`)
VALUES('admin',MD5('admin'),'admin@qq.com');

SELECT * FROM admin;

furn表：

-- 设计家居表furn
-- 根据 需求-文档-界面 设计字段
-- 注意：id int(11), 11为显示的宽度，配合零填充(zerofill)
-- 		int(2), 2表示的也是显示宽度
-- 也就是说, int(11)和int(2)存储的范围是一样的,两者存放的数据范围只和int相关
-- 例如，67890使用int(11)来存储，显示为 00000067890
-- 	    67890使用int(2)来存储，显示为 67890
-- 也就是说，当存储的数据位数不够时，使用0来填充剩下的宽度（零填充）
CREATE TABLE `furn`(
`id` INT UNSIGNED PRIMARY KEY AUTO_INCREMENT, #id-使用无符号
`name` VARCHAR(64) NOT NULL, #家居名
`maker` VARCHAR(64) NOT NULL, #制造商
`price` DECIMAL(11,2) NOT NULL, #价格 建议用DECIMAL定点数
`sales` INT UNSIGNED NOT NULL, #销量
`stock` INT UNSIGNED NOT NULL, #库存
`img_path` VARCHAR(256) NOT NULL #存放图片的路径即可，不建议直接存放图片到数据库中
)CHARSET utf8 ENGINE INNODB;

-- 增加测试数据
INSERT INTO furn(`id`,`name`,`maker`,`price`,`sales`,`stock`,`img_path`) 
VALUES(NULL,'北欧风格小桌子','熊猫家居',180,666,7,'assets/images/product-image/6.jpg');
 
INSERT INTO furn(`id`,`name`,`maker`,`price`,`sales`,`stock`,`img_path`) 
VALUES(NULL,'简约风格小椅子','熊猫家居',180,666,7,'assets/images/product-image/4.jpg');
 
INSERT INTO furn(`id`,`name`,`maker`,`price`,`sales`,`stock`,`img_path`) 
VALUES(NULL,'典雅风格小台灯','蚂蚁家居',180,666,7,'assets/images/product-image/14.jpg');
 
INSERT INTO furn(`id`,`name`,`maker`,`price`,`sales`,`stock`,`img_path`) 
VALUES(NULL,'温馨风格盆景架','蚂蚁家居',180,666,7,'assets/images/product-image/16.jpg');

SELECT * FROM `furn`;

8.3.2管理员登录功能

管理员登录功能实现参考：功能04-会员登录

详细代码请看 https://github.com/liyuelian/furniture_mall.git

1. entity层增加Admin实体，进行admin表映射。

2. dao层增加AdminDAO接口，，由AdminDAOImpl实现该接口方法，同时AdminDAOImpl继承BasicDAO，用于查询数据库中有无对应Admin用户返回对应信息

3. utils包创建AdminDAOImplTest类并测试

4. Service层创建AdminService接口，AdminServiceImpl实现该接口

5. utils包中创建AdminServiceImplTest类并测试

6. web层创建AdminServlet并配置，该Servlet对接前端页面。根据功能06-web层Servlet减肥中的方法，AdminServlet直接继承BasicServlet，只需要在AdminServlet编写业务代码即可，不需要实现doPost方法。doPost由抽象父类BasicServlet使用反射+动态绑定回调

   AdminServlet：

   package com.li.furns.web;
   
   import com.li.furns.entity.Admin;
   import com.li.furns.service.AdminService;
   import com.li.furns.service.impl.AdminServiceImpl;
   
   import javax.servlet.ServletException;
   import javax.servlet.http.HttpServletRequest;
   import javax.servlet.http.HttpServletResponse;
   import java.io.IOException;
   
   /**
    * @author 李
    * @version 1.0
    */
   public class AdminServlet extends BasicServlet {
       private AdminService adminService = new AdminServiceImpl();
   
       public void login(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
           //获取用户输入的账号密码
           String username = request.getParameter("username");
           String password = request.getParameter("password");
           //构建一个Admin对象
           Admin admin = new Admin(null, username, password, null);
           if (adminService.login(admin) == null) {
               //登录失败,返回管理员登录页面并提示错误信息
               request.setAttribute("errInfo", "登录失败，账号信息有误");
               request.getRequestDispatcher("/views/manage/manage_login.jsp")
                       .forward(request, response);
           } else {
               //登录成功，跳转到manage_menu.jsp
               request.getRequestDispatcher("/views/manage/manage_menu.jsp")
                       .forward(request, response);
           }
       }
   }
   

7. 修改前端页面manage_login.jsp（登录表单提交注意添加隐藏域）

8.3.3显示家居功能

详细代码请看 https://github.com/liyuelian/furniture_mall.git

1. entity层增加Furn实体

   这里如果Furn实体的属性名和对应表的字段不一致，可以通过给查询的字段起别名的方法解决

2. dao层增加FurnDAO接口，由FurnDAOImpl实现该接口，同时继承BasicDAO，用于查询数据库furn表中的所有信息

3. utils包创建FurnDAOImplTest类并测试

4. service层添加FurnService接口，由FurnServiceImpl实现该接口

5. utils包创建FurnServiceImplTest类并测试

6. web层创建FurnServlet并配置（配置的url为/manage/furnServlet，目的是为了之后使用过滤器可以更好地限制访问权限），该Servlet对接前端页面。直接继承BasicServlet，只需要在Servlet中编写业务代码即可。

   package com.li.furns.web;
   
   import com.li.furns.entity.Furn;
   import com.li.furns.service.FurnService;
   import com.li.furns.service.impl.FurnServiceImpl;
   
   import javax.servlet.ServletException;
   import javax.servlet.http.HttpServletRequest;
   import javax.servlet.http.HttpServletResponse;
   import java.io.IOException;
   import java.util.List;
   
   public class FurnServlet extends BasicServlet {
   
       private FurnService furnService = new FurnServiceImpl();
       
       protected void list(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
           List<Furn> furns = furnService.queryFurns();
           //将furns集合放入到request域中
           req.setAttribute("furns", furns);
           //请求转发
           req.getRequestDispatcher("/views/manage/furn_manage.jsp")
                   .forward(req, resp);
       }
   }
   

7. 在对接的前端页面furn_manage.jsp，使用jstl将接收到的家居集合显示出来

8.3.4整合管理员登录和显示家居功能

上述两个功能的流程为，管理员登录后由AdminServlet请求转发到manage_menu.jsp页面，点击页面上的“家居管理”，FurnServlet请求转发到furn_manage.jsp页面，该页面显示所有家居信息。

8.4完成测试

9.功能08-后台管理 添加家居

9.1需求分析/图解

1. 管理员进入到家居管理页面
2. 点击添加家居，进入到furn_add.jsp页面，在该页面中可以添加家居

9.2思路分析

9.3代码实现

9.3.1dao层

以下为部分代码，详细请看 https://github.com/liyuelian/furniture_mall.git

FurnDAO

public interface FurnDAO {
    //添加家居信息
    public int addFurn(Furn furn);
}

FurnDAOImpl

/**
 * 往furn表中添加家居信息
 *
 * @param furn 家居对象
 * @return 返回的值是受影响的行数，操作失败则返回-1
 */
@Override
public int addFurn(Furn furn) {
    String sql = "INSERT INTO furn(`id` , `name` , `maker` , `price` , `sales` , `stock` , `img_path`)" +
            "VALUES(NULL , ?, ? , ? , ? , ? , ?);";
    return update(sql, furn.getName(), furn.getMaker(), furn.getPrice(),
            furn.getSales(), furn.getStock(), furn.getImgPath());
}

FurnDAOImplTest：

@Test
public void add() {
    Furn furn = new Furn(null, "北欧风格台灯", "小猫家居", new BigDecimal("200.00"), 333, 17, "assets/images/product-image/3.jpg");
    int add = furnDAO.addFurn(furn);
    if (add == -1) {
        System.out.println("添加数据失败");
    } else {
        System.out.println("添加数据成功");
    }
}

9.3.2service层

部分代码

FurnService接口

/**
 * 添加Furn对象到数据库
 * @param furn furn对象
 * @return 返回修改表的行数，失败则返回-1
 */
public int addFurn(Furn furn);

FurnServiceImpl实现类

@Override
public int addFurn(Furn furn) {
    return furnDAO.add(furn);
}

FurnServiceImplTest测试类

@Test
public void add(){
    int add = furnService.addFurn(new Furn(null, "小台灯", "猫家居",
                            new BigDecimal("99.00"), 55, 24,
                            "assets/images/product-image/3.jpg"));
    if (add == -1) {
        System.out.println("添加失败");
    }else {
        System.out.println("添加成功");
    }
}

9.3.3web层

FurnServlet添加add方法

/**
 * 处理添加家居的请求
 *
 * @param req
 * @param resp
 * @throws ServletException
 * @throws IOException
 */
protected void add(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
    //获取家居信息
    String name = req.getParameter("name");
    String maker = req.getParameter("maker");
    String price = req.getParameter("price");
    String sales = req.getParameter("sales");
    String stock = req.getParameter("stock");
    //图片暂且使用默认值，后面再修改
    String defaultImg = "assets/images/product-image/default.jpg";

    //构建Furn对象
    Furn furn = new Furn(null, name, maker, new BigDecimal(price),
            new Integer(sales), new Integer(stock), defaultImg);
    int addRes = furnService.addFurn(furn);
    if (addRes != -1) {//插入成功,跳转到页面furn_manage.jsp
        //跳转之前，需要重新获取Furn列表，然后将furns集合放入到request域中，再请求转发
        //即需要重新走一下FurnServlet的list方法
        //req.getRequestDispatcher("/manage/furnServlet?action=list")
        // .forward(req, resp);

        //这里如果使用请求转发，当用户刷新页面时，会重新发出一次添加请求，造成数据重复提交
        //因此使用重定向
        //因为重定向实际是让浏览器重新发送请求，所以我们回送完整的url比较保险
        resp.sendRedirect(req.getContextPath() + "/manage/furnServlet?action=list");
    } else {
        resp.getWriter().write("添加失败");
    }
}

为了防止中文乱码，在其父类BasicServlet中设置编码为utf-8

修改前端页面接口

9.4完成测试

浏览器访问http://localhost:8080/furniture_mall/views/manage/furn_add.jsp，填写数据，提交表单

显示如下：

数据库显示

9.5注意事项和细节

9.5.1改进1-中文乱码问题

直接在BasicServlet中设置http请求的字符格式

9.5.2改进2-表单重复提交问题

1. 上诉代码从实现效果上来看是没有问题的

2. 但是如果用户刷新页面，就会发现又重新添加了一次家居

3. 原因是当用户提交完请求时，浏览器会记录下最后一次请求的全部信息，当用户刷新页面，就会发起浏览器的上一次请求

   

4. 解决方案：使用重定向即可，因为重定向的本质是两次请求，而且最后一次就是请求显示家居，而不是添加家居。（修改FurnServlet）

   

9.5.3改进3-后端数据校验

如果用户在添加家居信息时，输入错误的数据类型，比如在价格栏中填入英文，后台在构建Furn对象时就会出错。

解决方案：

1. 在furn_add.jsp页面增加js验证

   

2. 防止用户直接通过浏览器地址栏提交，绕过前端js校验，后端仍要对获取到的数据进行校验。

   • 方案一：使用java的正则表达式验证数据格式，如果没有通过校验，就返回furn_add.jsp，并且在request域中提示错误信息，并在前端jsp页面中展示。

   • 方案二：将获取到的数据直接进行转换，如果出现异常，就不执行添加操作，直接返回furn_add.jsp，同样在request域给出错误提示，在前端jsp页面中展示。

     但是这样做需要一个一个数据去校验，非常麻烦。我们知道，如果获取到的数据格式不对，异常会在构建Furn对象时出现，因此我们可以直接在构建Furn对象的地方捕获异常。这样，无论是哪一个数据格式出现错误都会被捕获异常。

     

     这里跳转会清空用户的表单数据，后面使用ajax来提交

   • 方案三：后面学习SpringMVC时，会有一个专门用户数据校验的规则/框架 -->JSR303 Hibernate Validator拓展注解

9.5.4改进4-使用BeanUtils

在之前的代码中，我们都是先拿到数据，手动构建Javabean对象，那么有没有一种方法可以自动封装Javabean呢？

使用BeanUtils可以完成自动封装JavaBean。

1. BeanUtils工具类可以一次性把所有请求的参数注入到JavaBean中。

2. BeanUtils工具类经常用于把Map中的值注入到JavaBean中，或者是对象属性值的拷贝操作

3. BeanUtils不是jdk的类，需要导入相关jar包才能使用：

   commons-beanutils-1.8.0.jar 和 commons-logging-1.1.1.jar

   

改进后的FurnServlet：

   /**
     * 处理添加家居的请求
     *
     * @param req
     * @param resp
     * @throws ServletException
     * @throws IOException
     */
    protected void add(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

        //底层使用BeanUtils，完成自动封装JavaBean
        Furn furn = DataUtils.copyParamToBean(req.getParameterMap(), new Furn());

        int addRes = furnService.addFurn(furn);
        if (addRes != -1) {//插入成功,跳转到页面furn_manage.jsp
            //使用重定向    
            resp.sendRedirect(req.getContextPath() + "/manage/furnServlet?action=list");
        } else {
            resp.getWriter().write("添加失败");
        }
    }

utils包中增加工具类DataUtils

package com.li.furns.utils;

import org.apache.commons.beanutils.BeanUtils;

import java.lang.reflect.InvocationTargetException;
import java.util.Map;

/**
 * @author 李
 * @version 1.0
 */
public class DataUtils {
    public static <T> T copyParamToBean(Map value, T bean) {
        try {
            //将req.getParameterMap()的数据自动封装到furn对象中
            //底层使用反射将数据封装，前提是，表单提交的数据字段名称必须和Javabean的属性名一致
            BeanUtils.populate(bean, value);
        } catch (Exception e) {
            e.printStackTrace();
        }
        return bean;
    }
}