您的位置：首页 > 其它

用Cookie和Session简单实现购物车

2016-11-30 08:22 399 查看

作为单身汪的小编,无法体会到被女神逼着清空购物车的那种”快感”!!,罢特!!我可以自己清空呀!! 傲娇脸~~

冰箱, 手机, 电视, 手电筒来一套!!(ps:手电筒是什么鬼!!)

下面我用Cookie和Session来清空购物车里的这4样东东!! 感觉自己有点溜!!

一.Cookie

Cookie分为会话级别和持久化两种,这里将利用的是持久化的Cookie,以遍保存并显示浏览商品记录,和实现商品就算页面

(1)创建商品列表页面

在Web项目根目录建一个product.jsp服务器端页面,如下:

<img src="/day09-cookie/img/1.jpg"><a href="/day09-cookie/product?id=1">手电筒</a>
<img src="/day09-cookie/img/2.jpg"><a href="/day09-cookie/product?id=2">手机</a>
<img src="/day09-cookie/img/3.jpg"><a href="/day09-cookie/product?id=3">电视</a>
<img src="/day09-cookie/img/4.jpg"><a href="/day09-cookie/product?id=4">冰箱</a>

当点击对应的商品时会自动将商品id提交到后台servet中. servet会将id值放入cookie中并回写到浏览器里.

(2)在servlet中完成把浏览记录存到cookie

*这里会预先写一个工具类MyCookieUtil,里面有方法findCookie(),判断浏览器是否存在用于存商品id的Cookie.

代码:

public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
//获取浏览器所有的cookies
Cookie[] cookies = request.getCookies();
//判断是否有名为scan的cookie
Cookie cookie = MyCookieUtil.findCookie(cookies, "scan");
//获取当前点击商品的id
String id = request.getParameter("id");
if (cookie==null) {
//如果没有就创建一个名为scan的cookie,并将商品的id设置到cookie里
Cookie cookie2 = new Cookie("scan"<
4000
/span>, id);
//设置cookie保存时长为30分钟
cookie2.setMaxAge(1800);
//设置项目路径
cookie2.setPath("/day09-cookie");
//回写到浏览器
response.addCookie(cookie2);
}else {
//将当前点击商品的id值添加到上一次回写到浏览器的cookie里
String value = cookie.getValue();
String[] ids = value.split(",");
//判断是否有重复的商品
boolean flag=checkID(ids,id);
if (!flag) {
//没有重复就添加id到cookie里
String newValue=value+","+id;
Cookie cookie2 = new Cookie("scan", newValue);
cookie2.setMaxAge(1800);
cookie2.setPath("/day09-cookie");
response.addCookie(cookie2);
}
}
//回写cookie到浏览器之后再重定向到浏览器
response.sendRedirect("/day09-cookie/product.jsp");
}

//判断id是否重复的方法
private boolean checkID(String[] ids, String id) {
for (String string : ids) {
if (string.equals(id)) {
return true;
}
}
return false;
}

(3)在浏览器显示商品的浏览记录

在product.jsp里嵌入java代码,实现显示浏览记录的逻辑

代码:

<!-- 显示浏览记录的操作 -->
<%
//获取浏览器里面所有的cookie
Cookie[] cookies=request.getCookies();
Cookie cookie=MyCookieUtil.findCookie(cookies,"scan");
if(cookie==null){
%>
<h2>没有任何记录</h2>
<%
}else{
String values=cookie.getValue();
String[] productNames={"手电筒","手机","电视","冰箱"};
String[] ids=values.split(",");
//遍历ids,把所有对应图片的信息显示到页面上
for(String id:ids){
//获得对应的商品名称
String productName=productNames[Integer.parseInt(id)-1];
%>
<img src="/day09-cookie/img/<%= id%>.jpg"/><%=productName %>
<%
}
}

%>

(4)清空保存在浏览器上的商品浏览记录

原理: 销毁持久化的cookie操作. 新建一个servet, ProductClear.java

步骤:

* 1、创建一个和要销毁cookie相同名称的cookie

* 2、设置cookie的有效时长是 0

* 3、设置路径一致的

* 4、把cookie回写到浏览器

代码:

在product.jsp里加一行代码:

<h1><a href="/day09-cookie/clear">清空浏览记录</a></h1>

写在ProductClear.java里的代码:

public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
Cookie cookie = new Cookie("scan", "");
cookie.setMaxAge(0);
cookie.setPath("/day09-cookie");
response.addCookie(cookie);

response.sendRedirect("/day09-cookie/product.jsp");
}

我一运行

选择商品之后:

(点击”清空浏览记录”又会变成上面的页面)

二.Session

增加了一个显示购物车内容的功能

(1)创建商品列表页面 product.jsp

代码:

<body>
<img src="/day09-session/img/1.jpg"/><a href="/day09-session/store?id=1">手电筒</a>
<img src="/day09-session/img/2.jpg"/><a href="/day09-session/store?id=2">手机</a>
<img src="/day09-session/img/3.jpg"/><a href="/day09-session/store?id=3">电视</a>
<img src="/day09-session/img/4.jpg"/><a href="/day09-session/store?id=4">冰箱</a>
</body>

(2)在servlet中完成把浏览记录存到cookie

创建servet,名为StoreInCart

public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String id = request.getParameter("id");
String[] names={"手电筒","手机","电视","冰箱"};
String productName=names[Integer.parseInt(id)-1];
//将产品名和数量放到一个map集合里之后再放入购物车
Map<String,Integer> cart = (Map<String, Integer>) request.getSession().getAttribute("cart");
//判断购物车是否为空. 空的话,就将产品信息和数量放入
if (cart==null) {
cart=new HashMap<String, Integer>();
cart.put(productName, 1);
}else {
//不为空就将不重复的产品存入购物车
if (cart.containsKey(productName)) {
int num=cart.get(productName);
cart.put(productName, num+1);
}else {
cart.put(productName, 1);
}
}
//将map集合设置到购物车cart里面
request.getSession().setAttribute("cart", cart);
response.setContentType("text/html;charset=utf-8");
response.getWriter().write("<a href='/day09-session/product.jsp'>继续购物</a><br/>"+"<a href='/day09-session/cart.jsp'>去结算</a>");
}

(3)创建一个购物车cart.jsp文件,显示选购的商品信息

代码:

<body>
<h1>结算页面</h1>
<h3><a href="/day09-session/clear">清空购物车</a></h3>
<h5>购物车清单:</h5>
<br/>
<%
//获取购物车cart,遍历购物车,打印出商品详情

Map<String,Integer> cart=(Map<String,Integer>) request.getSession().getAttribute("cart");
if(cart==null){
%>
<h2>没有任何购物记录</h2>
<%
}else{
for(String name:cart.keySet()){
int num=cart.get(name);
%>
商品:<%=name %>, 数量:<%=num %>
<br/>
<%
}
}
%>
</body>

(4)终于来到了清空购物车, 泪流满面!!

新建一个servet,名为ClearCart.java, 销毁session,实现清空购物车.

具体代码:

public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
HttpSession session = request.getSession();
//利用session自己的方法结果掉session
session.invalidate();
response.sendRedirect("/day09-session/cart.jsp");
}

我们来看看运行结果:

(1)商品预览页面

(2)跳转页面

StroeInCart.java体现的效果

(3)购物车界面

cart.jsp展现的效果,结算页面

(4)清空购物车之后的界面

ClearCart.java展现的效果

宝宝们,看到了吧! 购物车就这样清空了!!

剁剁剁~~~

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航