使用Servlet和JSP开发Java应用程序 ---- 简单模拟天猫购物页面

1. 加载 jar 包
2. 使用URL重写参数
3. 编写 ProductServlet
4. 在 productInfo 页面显示信息
5. 编写 CartServlet

1. 加载 jar 包

在 WEB-INF 文件夹下新建 lib 文件夹，并添加 jar 包

一定要不要忘记添加 jar 包，忘记会出大问题！！！血的教训！！！

2. 使用URL重写参数

<a href="ps?pid=P001" class="img-rounded img-thumbnail">
<a href="ps?pid=P002" class="img-rounded img-thumbnail">
<a href="ps?pid=P003" class="img-rounded img-thumbnail">
<a href="ps?pid=P004" class="img-rounded img-thumbnail">

index.html 代码

<!DOCTYPE html>
<html><head><title>天猫首页</title><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link href="images/shortcut.png" rel="shortcut icon" type="image/x-icon"/><link rel="stylesheet" href="css/bootstrap.min.css"/><link rel="stylesheet" href="css/style.css"/></head> <body><div class="container"><div class="top"><div class="top_left"><img src="data:images/tmall.png" alt="天猫logo"></div><div class="top_right"><h1>欢迎来到天猫，理想生活上天猫......</h1></div></div><hr><p class="text-success">* 程序使用四种会话技术实现简单购物车功能，将购物车列表存储在了会话中。程序需要使用数据库中的Product表，具体内容请参考各个Servlet或页面的代码和注释</p><hr><h3>最新促销</h3><ul class="proList"><li><!--使用URL重写参数--><a href="ps?pid=P001" class="img-rounded img-thumbnail"><img src="data:images/P001.jpg" alt="卫龙辣条"/><hr>卫龙辣条，你值得拥有</a></li><li><a href="ps?pid=P002" class="img-rounded img-thumbnail"><img src="data:images/P002.jpg" alt="卫龙辣条"/><hr>青岛大虾，不一样的大虾</a></li><li><a href="ps?pid=P003" class="img-rounded img-thumbnail"><img src="data:images/P003.jpg" alt="卫龙辣条"/><hr>四级真题，600包过</a></li><li><a href="ps?pid=P004" class="img-rounded img-thumbnail"><img src="data:images/P004.jpg" alt="卫龙辣条"/><hr>快乐肥宅水，你今天快乐了吗？</a></li></ul><br><a href="cart.jsp" class="cartImg">查看购物车<img src="data:images/cart.png" alt="购物车"/></a><br><br></div></body>
</html>

3. 编写 ProductServlet

获取请求参数

String pid = req.getParameter("pid");

处理请求

根据产品编号查询产品的详细信息，返回的是一个Product对象，包含这个产品的详细信息

Product p = productDao.findProductById(pid);

生成动态响应

Servlet和JSP的最佳使用方式：请求交给Servlet处理，产生的数据交给JSP页面显示
如果一个数据需要在整个会话期间使用，可以将数据作为属性添加到会话对象中
如果一个数据不需要在整个会话期间使用，只想传递给下一个组件(servlet或jsp)，可以将数据作为属性添加到请求对象传递给下一个页面然后转发请求

req.setAttribute("product", p);

转发请求需要使用请求派发器

RequestDispatcher rd = req.getRequestDispatcher("/productInfo.jsp");

将当前请求对象和当前响应对象转发给目标文件组件，这里是productInfo.jsp
转发请求的结果是ProductServlet和productInfo.jsp页面处理的是同一个请求
所以将ProductServlet添加点的属性，可以被productInfo.jsp页面捕获到

rd.forward(req, resp);

ProductServlet 完整代码

package com.tianmao.servlet;import com.tianmao.dao.ProductDao;
import com.tianmao.model.Product;
import java.io.IOException;
import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;/*** 该Servlet处理根据产品编号查询产品的请求,然后将查询出来的产品信息交给productInfo.jsp显示** @author Anna */
@WebServlet("/ps")
public class ProductServlet extends HttpServlet {private ProductDao productDao = new ProductDao();@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {//1. 获取请求参数String pid = req.getParameter("pid");//2. 处理请求//根据产品编号查询产品的详细信息，返回的是一个Product对象，包含这个产品的详细信息Product p = productDao.findProductById(pid);//3. 生成动态响应//Servlet和JSP的最佳使用方式：请求交给Servlet处理，产生的数据交给JSP页面显示//如果一个数据需要在整个会话期间使用，可以将数据作为属性添加到会话对象中//如果一个数据不需要在整个会话期间使用，只想传递给下一个组件(servlet或jsp)，可以将数据作为属性添加到请求对象传递给下一个页面//然后转发请求req.setAttribute("product", p);//转发请求需要使用请求派发器RequestDispatcher rd = req.getRequestDispatcher("/productInfo.jsp"); //productInfo.jsp 就是转发对象//将当前请求对象和当前响应对象转发给目标文件组件，这里是productInfo.jsp//转发请求的结果是ProductServlet和productInfo.jsp页面处理的是同一个请求//所以将ProductServlet添加点的属性，可以被productInfo.jsp页面捕获到rd.forward(req, resp);}
}

4. 在 productInfo 页面显示信息

在 jsp 页面中使用 EL 表达式处理信息

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><link href="images/shortcut.png" rel="shortcut icon" type="image/x-icon"/><title>产品信息</title><link rel="stylesheet" href="css/bootstrap.min.css"/><link rel="stylesheet" href="css/style.css"/></head> <body><h1 class="text-center text-primary">产品信息</h1><hr><br><!--在此div中显示从数据库查询到的一个产品的所有信息--><div class="content"><br><!--显示产品图片，图片在images文件夹中给出了，以产品的编号命名的图片--><!--这里使用EL表达式显示获取的产品对象的各个信息--><img src="data:images/${product.productImg}" class="pic">  <!--在EL表达式中，获取会话对象中的属性，使用sessionScope--><!--获取请求对象中的属性，使用requestScope--><h3>产品名称： ${requestScope.product.productName} </h3><p>产品单价： ${requestScope.product.productPrice}   </p><p>包装单位： ${requestScope.product.productUnit}   </p><p>剩余库存： ${requestScope.product.productQty}   </p><!--提交表单，请求发送给cs，将产品添加到购物车--><form action="cs" class="form-inline"><b>购买数量：</b><input type="hidden" name="proId" value="${product.productId}"><input type="hidden" name="proName" value="${product.productName}"><input type="hidden" name="proPrice" value="${product.productPrice}"><input type="hidden" name="proUnit" value="${product.productUnit}"><input type="hidden" name="proImg" value="${product.productImg}"><input type="number" min="1" name="qty" value="1" class="form-control"><br><br><button class="btn btn-sm btn-danger">加入购物车</button>&nbsp;<button class="btn btn-sm btn-warning">立刻购买</button></form></div><br><a href="cart.jsp" class="cartImg">查看购物车<img src="data:images/cart.png" alt="购物车"/></a></body>
</html>

5. 编写 CartServlet

获取请求参数

        String proId = req.getParameter("proId");String proName = req.getParameter("proName");float proPrice = Float.parseFloat(req.getParameter("proPrice"));String proUnit = req.getParameter("proUnit");int qty = Integer.parseInt(req.getParameter("qty"));String proImg = req.getParameter("proImg");

处理动态响应

        //为了方便操作购物车中的每个产品，将产品的6项信息封装到一个产品对象中Product p = new Product(proId, proName, proPrice, proUnit, qty, proImg);//为了模拟购物车，可以使用一个列表来表示购物车List<Product> cart = null;HttpSession session = req.getSession();//如果会话中诶呦属性cartList，说明是第一次添加购物车if(null == session.getAttribute("cartList")){//如果是第一次添加购物车cart = new ArrayList<>();//创建购物车
//            cart.add(p);//添加第一个产品到购物车//为了后续可以随时获取购物车，查看购物车列表或添加新的产品session.setAttribute("cartList", cart);}else{//如果不是第一次添加购物车，从会话获取已有的购物车，继续添加产品cart = (List<Product>)session.getAttribute("cartList");
//            cart.add(p);//添加本地产品到购物车}cart.add(p);

转发请求

            session.setAttribute("cartList", cart);resp.sendRedirect("cart.jsp");

CartServlet 完整代码

package com.tianmao.servlet;import com.tianmao.model.Product;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;/*** 点击“加入购物车”按钮，添加产品到购物车，该Servlet负责处理添加到购物车的请求** @author Anna */
@WebServlet("/cs")  //购物车 shopping cart
public class CartServlet extends HttpServlet {@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {//1. 获取请求参数String proId = req.getParameter("proId");String proName = req.getParameter("proName");float proPrice = Float.parseFloat(req.getParameter("proPrice"));String proUnit = req.getParameter("proUnit");int qty = Integer.parseInt(req.getParameter("qty"));String proImg = req.getParameter("proImg");//为了方便操作购物车中的每个产品，将产品的6项信息封装到一个产品对象中Product p = new Product(proId, proName, proPrice, proUnit, qty, proImg);//为了模拟购物车，可以使用一个列表来表示购物车List<Product> cart = null;HttpSession session = req.getSession();//如果会话中诶呦属性cartList，说明是第一次添加购物车if(null == session.getAttribute("cartList")){//如果是第一次添加购物车cart = new ArrayList<>();//创建购物车
//            cart.add(p);//添加第一个产品到购物车//为了后续可以随时获取购物车，查看购物车列表或添加新的产品session.setAttribute("cartList", cart);}else{//如果不是第一次添加购物车，从会话获取已有的购物车，继续添加产品cart = (List<Product>)session.getAttribute("cartList");
//            cart.add(p);//添加本地产品到购物车}cart.add(p);//购物车列表是放入了会话对象，而不是请求对象，所以不需要转发请求，直接重定向跳转页面即可//跳转到cart.jsp页面显示购物车列表resp.sendRedirect("cart.jsp");}
}