原文:
https://www.cnblogs.com/wang-meng/p/5854773.html
今天来写一下关于购物车的东西, 这里首先抛出四个问题:
1)用户没登陆用户名和密码,添加商品, 关闭浏览器再打开后 不登录用户名和密码
问:购物车商品还在吗?
2)用户登陆了用户名密码,添加商品,关闭浏览器再打开后 不登录用户名和密码
问:购物车商品还在吗?
3)用户登陆了用户名密码,添加商品, 关闭浏览器,然后再打开,登陆用户名和密码
问:购物车商品还在吗?
4)用户登陆了用户名密码,添加商品, 关闭浏览器 外地老家打开浏览器 登陆用户名和密码
问:购物车商品还在吗?
上面四个问题都是以京东为模板, 那么大家猜猜结果是什么呢?
1)在
2)不在了
3)在
4)在
如果你能够猜到答案, 那么说明你真的很棒, 那么关于这四点是怎么实现的呢? (如果有不认可的小伙伴可以用京东实验一下)
下面我们就来讲解下购物车的原理,最后再来说下具体的code实现.
1)用户没有登录, 添加商品, 此时的商品是被添加到了浏览器的Cookie中, 所以当再次访问时(不登录),商品仍然在Cookie中, 所以购物车中的商品还是存在的.
2)用户登录了,添加商品, 此时会将Cookie中和用户选择的商品都添加到购物车中, 然后删除Cookie中的商品. 所以当用户再次访问(不登录),此时Cookie中的购物车商品已经被删除了, 所以此时购物车中的商品不在了.
3)用户登录, 添加商品,此时商品被添加到数据库做了持久化存储, 再次打开登录用户名和密码, 该用户选择的商品肯定还是存在的, 所以购物车中的商品还是存在的.
4)理由3)
这里再说下 没登录 保存商品到Cookie的优点以及保存到Session和数据库的对比:
1:Cookie: 优点: 保存用户浏览器(不用浪费我们公司的服务器) 缺点:Cookie禁用,不提供保存
2:Session:(Redis : 浪费大量服务器内存:实现、禁用Cookie) 速度很快
3:数据库(Mysql、Redis、SOlr) 能持久化的就数据库 速度太慢
那么我今天要讲的就是:
- 用户没登陆:购物车添加到Cookie中
- 用户登陆: 保存购物车到Redis中 (不用数据库)
整体的思路图解:
![8c173679e8c5468939a114906b22ccef.png](https://i-blog.csdnimg.cn/blog_migrate/1d6942609349b76b132420c4c33ff477.jpeg)
接下来就是代码实例来实现 购物车的功能了:
首先我们看下购物车和购物项两个JavaBean的设计:
购物车: buyerCart.java
![3113841f95c871719d1c202b685cb093.png](https://i-blog.csdnimg.cn/blog_migrate/3a8e4a202def6a4ad818b002ae74cc48.jpeg)
![75db3241eba63c01e582b233058f66aa.png](https://i-blog.csdnimg.cn/blog_migrate/ecccce739c078fcfe393c51a266a55c7.jpeg)
![bd337c2c28cc183b3168989d52b3a7cf.png](https://i-blog.csdnimg.cn/blog_migrate/1adfffc3ad5673f3874238c0074c564e.jpeg)
这里使用了@JsonIgonre注解是因为下面需要将BuyerCart 转换成Json格式, 而这几个字段只有get 方法, 所以不能转换, 需要使用忽略Json.
下面是购物项: buyerItem.java
![0b068bdbce1ba628127535149520f388.png](https://i-blog.csdnimg.cn/blog_migrate/869e96fccfea5397c0784ef40b68d5f6.jpeg)
![b6ee8fb3b7e15c1d9dca01ad0cb5a7a8.png](https://i-blog.csdnimg.cn/blog_migrate/74a25662d9b4c5511ba3ea027ba86309.jpeg)
1、将商品加入购物车中
![3d3a381dbf8fe63c39b156f90dae9410.png](https://i-blog.csdnimg.cn/blog_migrate/dfb9d3e117a42b6c6809febef8c57548.jpeg)
![4b431d61d146790d20eb22e186f1dd6d.png](https://i-blog.csdnimg.cn/blog_migrate/0a64667de73a8469a8855cfbbf16b511.jpeg)
这里传入的参数是skuId(库存表的主键, 库存表保存的商品id,颜色,尺码,库存等信息), 购买数量amount.
接着我们来看Controller是如何来处理的:
![188415135ca7083786e2f0f541b49fcb.png](https://i-blog.csdnimg.cn/blog_migrate/a1ee0a763f567f73b8c265ef16cde09c.jpeg)
![c0664b635ff4bb4365eac564a1f3f520.png](https://i-blog.csdnimg.cn/blog_migrate/45c6b4f4f2bc68fed606caaa3e4bb754.jpeg)
![8607fc346fe53d1ab112708e3c03aeee.png](https://i-blog.csdnimg.cn/blog_migrate/f7fb64f293abcb3b13012277ab62cb5c.jpeg)
这里设计一个知识点: 将对象转换成json字符串/json字符串转成对象
我们在这里先写一个小的Demo来演示json和对象之间的互转, 这里使用到了springmvc中的ObjectMapper类.
![61e0ad1e99df0ef6ae9e1ca502195cc4.png](https://i-blog.csdnimg.cn/blog_migrate/88653ed39490338fb17febacaaebff52.jpeg)
执行结果:
![8cb2429e09f05a43961697afa5c9ea88.png](https://i-blog.csdnimg.cn/blog_migrate/5b55effdddbd720c0bfbe473f5bee618.jpeg)
这里我们使用了Include.NON_NULL, 如果TestTb 中属性为null 的就不给转换成Json, 从对象-->Json字符串 用的是 objectMapper.writeValue(). 从Json字符串-->对象使用的是objectMapper.readValue().
回归上面我们项目中的代码, 只有未登录 添加商品时才会将此商品添加到Cookie中.
![a0bde55a9c630eb2806c08aa0d06f009.png](https://i-blog.csdnimg.cn/blog_migrate/ccccab7b4719f5db3f503f2a3feae43e.jpeg)
我们debug 可以看到:
![4a81a1ab81976bc6d8b980ca9aac0880.png](https://i-blog.csdnimg.cn/blog_migrate/7e85887b2ecd065ed26d2b015ab568ff.jpeg)
这里已经将对象购物车对象buyerCart转换成了Json格式.
将商品添加到购物车, 不管是登录还是未登录, 都要先取出Cookie中的购物车, 然后将当前选择的商品追加到购物车中.
然后登录的话 就把Cookie中的购物车清空, 并将购物车的内容添加到Redis中做持久化保存.
如果未登录, 将选择的商品追加到Cookie中.
将购物车追加到Redis中的代码:insertBuyerCartToRedis(这里面包含了判断添加的是否是同款)
![126851d8e40d0732dff1a9a5a73e0a79.png](https://i-blog.csdnimg.cn/blog_migrate/5710f5c052295b2189feb3678b90a3f0.jpeg)
判断用户是否登录: String username =
sessionProviderService.getAttributterForUsername(RequestUtils.getCSessionId(request, response));
![ef795a1ed71371f242a481a38a9f5498.png](https://i-blog.csdnimg.cn/blog_migrate/e277092c0b8637324a1cd704a6ab9939.jpeg)
![317240cf45300cbb96bde4d32c10a784.png](https://i-blog.csdnimg.cn/blog_migrate/4092f8079654a3ce00def4f6060c171a.jpeg)
2、购物车展示页面
最后 重定向到购物车展示页: return "redirect:/shopping/toCart"; 这里进入结算页有两种方式:
1) 在商品详情页 点击加入购物车.
2) 直接点击购物车按钮 进入购物车结算页.
下面来看下结算页的代码:
![439f75913ce94a3e99e85edbf141c205.png](https://i-blog.csdnimg.cn/blog_migrate/000558379cda5abea39ee49ff275648c.jpeg)
![0094dd93e21434500d9ad74c8d2fb7a1.png](https://i-blog.csdnimg.cn/blog_migrate/c64d281d7ccea5ec260ebab8c7c20494.jpeg)
这里 就是 购物车详情展示页面, 这里需要注意, 如果是同一件商品连续添加, 是需要合并的.
购物车详情展示页面就包括两大块, 1) 商品详情 2)总计(商品总额,运费)
其中1)商品详情又包括 商品尺码,商品颜色, 商品购买数量, 是否有货.
![a2bc8970821c3b02e8f96663b57c9d50.png](https://i-blog.csdnimg.cn/blog_migrate/0bab16dab09a3b29ea85863b22769d6b.jpeg)
取出Redis中的购物车: buyerCart = cartService.selectBuyerCartFromRedis(username);
![1e6fe88787d061daef3cf0d8ec76c5a6.png](https://i-blog.csdnimg.cn/blog_migrate/566b20c15c58d6e3970c4362dd74c158.jpeg)
将购物车装满, 前面只是将skuId装进购物车, 这里还需要查出sku详情: List items = buyerCart.getItems();
buyerItem.setSku(cartService.selectSkuById(buyerItem.getSku().getId()));
![9b1906ba69ca1f3b1c8cb08e66555643.png](https://i-blog.csdnimg.cn/blog_migrate/a9c8c41de5440f432a6d45a5f3031d16.jpeg)
接着就返回"cart.jsp