淘淘商城系列——添加购物车

上文我们一起改造了下商品详情页面关于购物车那块的部分，本文我们将一起实现添加购物车这个功能。
我们以京东为例，比如我们选了一款手机，然后点击”加入购物车”，注意，此时我们并没有登录。

我们会看到如下图所示界面，可以看到，我们并没有直接进入购物车列表，而是到了一个中间页面，只是提醒我们成功加入了购物车。如果想进购物车列表的话，就点击那个”去购物车结算”按钮。

我们模仿京东的购物车功能，既然要展示成功加入购物车的页面，我们就要先把下图所示的淘淘商城购物车工程静态资源文件添加到taotao-cart-web工程当中。

记得将css、js、images放到webapp目录下，将jsp目录放到WEB-INF目录下，如下图所示。

下面我们再看下我们的商品详情页面以及添加购物车的情况，我们首先要启动所有的服务，然后启动除了taotao-cart-web工程之外的所有工程，商品详情页面如下图所示。

我们点击上图的”加入购物车”，会看到如下图所示界面，可以看到加入购物车的请求当中包含了商品ID以及商品数量。我们可以根据商品ID查询出商品详情。

下面我们来完成添加购物车的功能，由于查询商品详情我们的taotao-manager服务已经实现过了，因此我们只需完成表现层工程即可。首先我们要添加对dubbo服务的引用，即在springmvc.xml配置文件中添加如下配置：

<dubbo:reference interface="com.taotao.service.ItemService" id="itemService" />

接着我们在taotao-cart-web工程中按照如下业务逻辑编写一个Controller——CartController.java：

1. 从cookie中查询商品列表。
2. 判断商品在商品列表中是否存在。
3. 如果存在，商品数量相加。
4. 不存在，根据商品id查询商品信息。当根据商品id查询出商品信息后，取第一张图片保存到image属性中即可。
5. 把商品添加到购物车列表。
6. 把购物车商品列表写入cookie。
   
   • key：TT_CART
   • value：购物车列表转换成json数据，并且需要对数据进行编码
   • cookie的有效期：保存7天

如下图所示，在CartController类中处理逻辑并最终返回逻辑视图。

为了方便大家复制，现将CartController类的代码贴出。

/**
 * 购物车管理Controller
 * <p>Title: CartController</p>
 * <p>Description: </p>
 * <p>Company: www.itcast.cn</p> 
 * @version 1.0
 */
@Controller
public class CartController {
    @Autowired
    private ItemService itemService;
    @Value("${COOKIE_TT_CART}")
    private String COOKIE_TT_CART;
    @Value("${COOKIE_CART_EXPIRE}")
    private Integer COOKIE_CART_EXPIRE;
    @RequestMapping("/cart/add/{itemId}")
    public String addCart(@PathVariable Long itemId, Integer num, 
            HttpServletRequest request, HttpServletResponse response) {
        // 先从Cookie中查询购物车列表
        List<TbItem> cartList = getCartList(request);
        // 判断购物车列表中是否有此商品
        boolean flag = false;
        for (TbItem tbItem : cartList) {
            /*
             * 由于tbItem的ID与参数中的itemId都是包装类型的Long，要比较是否相等不要用==，
             * 因为那样比较的是对象的地址而不是值，为了让它们比较的是值，那么可以使用.longValue来获取值 
             */
            if (tbItem.getId() == itemId.longValue()) {
                // 购物车列表中存在此商品，数量要相加
                // 如果有，则商品数量相加
                tbItem.setNum(tbItem.getNum() + num); // 可以用商品的库存字段来作为购物车商品数量
                flag = true;
                break;
            }
        }
        if (!flag) {
            // 如果没有，则根据商品id查询商品信息，调用商品服务实现
            TbItem tbItem = itemService.getItemById(itemId);
            // 设置商品数量
            tbItem.setNum(num);
            // 取一张图片
            String image = tbItem.getImage();
            if (StringUtils.isNotBlank(image)) {
                tbItem.setImage(image.split(",")[0]);
            }
            // 添加到商品列表
            cartList.add(tbItem);
        }
        // 把这个购物车写入Cookie
        CookieUtils.setCookie(request, response, COOKIE_TT_CART, 
                JsonUtils.objectToJson(cartList), COOKIE_CART_EXPIRE, true);
        // 返回添加成功页面
        return "cartSuccess";
    }

    // 从Cookie中取出购物车列表
    private List<TbItem> getCartList(HttpServletRequest request) {
        // 使用CookieUtils取购物车列表
        String json = CookieUtils.getCookieValue(request, COOKIE_TT_CART, true);
        // 判断Cookie中是否有值
        if (StringUtils.isBlank(json)) {
            // 没有值就返回一个空List
            return new ArrayList();
        }
        // 把json转换成List对象
        List<TbItem> list = JsonUtils.jsonToList(json, TbItem.class);
        return list;
    }
}

CartController类的代码中用到了常量，常量我们都放到了配置文件当中，如下图所示。

下面我们来测试一下，我们启动taotao-cart-web工程，taotao-cart-web工程启动成功后，我们再到商品详情页面点击”加入购物车”，可以看到如下图所示界面，可以看到正常显示了”成功添加商品到购物车”的页面。