Java EE 阶段小项目(小型商城商品展示 + 购物车 + 下单 + 付款) 您所在的位置:网站首页 redis硬件最佳要求 Java EE 阶段小项目(小型商城商品展示 + 购物车 + 下单 + 付款)

Java EE 阶段小项目(小型商城商品展示 + 购物车 + 下单 + 付款)

2023-08-22 04:25| 来源: 网络整理| 查看: 265

基于 Java EE 阶段的小型购物车项目一、项目搭建二、商品界面展示2.1 登录界面2.2 商城主页2.3 购物车页面2.4 确认支付环节2.5 真正的支付环境了三、后端重点3.1 数据库设计3.1.1 用户表 (user)3.1.2 商品表 (product)3.1.3 购物车(Shopcart)3.2 Java Web 后端逻辑难点分析3.2.1 验证码实现3.2.2 分页逻辑实现3.2.3 支付宝沙箱支付环境接入四、总结

麻雀虽小,五脏俱全,UI 写的比较 low,这个就不要太在意了

项目已经放在 Github 仓库中:ShoppingMall

一、项目搭建构建一个 Java Web 项目数据库 mysql 5.7 版本开发工具 idea 2019, sqlyog服务器版本 Tomcat 9.0.34涉及到第三方 JAR 包: mysql 驱动 5.1.44 版本以上Tomcat 的所有 lib 包支持jstl 1.2 标签库支持支付宝 SDK 提供的 jar 包其他: BootStrap 库支持Jquery 库支持 (完成 ajax 操作) 二、商品界面展示 2.1 登录界面

用户需要输入正确的账号密码,以及验证码,经后端校验通过即可通过

验证码由后端生成,验证码点击图片或者 文字 都可以通过 js 进行交换用户名 ajax 校验没有编写注册功能,因为我比较懒 hhhhJava EE 阶段小项目(小型商城商品展示 + 购物车 + 下单 + 付款)_mysql 2.2 商城主页用户登录成功就会进入该界面,用户登录信息经过 session 域进行保存商品界面采用了 分页处理用户可以选择将商品添加至购物车 或者直接查询购物车Java EE 阶段小项目(小型商城商品展示 + 购物车 + 下单 + 付款)_数据库_02Java EE 阶段小项目(小型商城商品展示 + 购物车 + 下单 + 付款)_数据库_03 2.3 购物车页面用户选中项目可以对数量进行 添加 和 修改,修改的数据会通过 ajax 传至后台进行同步修改(这样做并不是合理,所以有点小 bug)商品如果不想要点击删除,会通过 ajax 进行删除,然后页面的 dom 也会删除,但是有个小 个 bug,因为没有对数据进行重新查询,所以,页面会恢复原样,但是数据库的数据是已经删除了该购物车信息了因为数据是动态渲染出来的,所以我使用 Jquery 完成购物车的 js 逻辑时,可能会有些小 bug, 所以我只用了一个产品进行购物Java EE 阶段小项目(小型商城商品展示 + 购物车 + 下单 + 付款)_数据库_04 2.4 确认支付环节支付采用了支付宝的沙箱环境,我们需要配置一些信息到 沙箱页面 和自己的本地环境即可完成沙箱环境接入

这个页面其实可以直接跳过去的,不知道为啥就写进来了

Java EE 阶段小项目(小型商城商品展示 + 购物车 + 下单 + 付款)_数据_05

2.5 真正的支付环境了

这里可以看到前面购物车的账单信息

Java EE 阶段小项目(小型商城商品展示 + 购物车 + 下单 + 付款)_数据_06

这里就和真真的支付没啥关系了,但是千万别傻乎乎的用自己的支付宝付钱,因为支付宝的沙箱环境已经提供了虚拟卖家账号 和 虚拟商家账号了,在这里我们可以快乐的充值,体验一把有钱人的快乐,也可以下载对应的沙箱环境支付宝进行支付

Java EE 阶段小项目(小型商城商品展示 + 购物车 + 下单 + 付款)_数据_07

和真实的支付环境基本有区别

Java EE 阶段小项目(小型商城商品展示 + 购物车 + 下单 + 付款)_mysql_08

三、后端重点 3.1 数据库设计

这个 小小商城 只用到了三张表,总体逻辑也不是很复杂

3.1.1 用户表 (user)

这是单独的一张表

Java EE 阶段小项目(小型商城商品展示 + 购物车 + 下单 + 付款)_支付宝_09

3.1.2 商品表 (product)

用于显示对应的数据

Java EE 阶段小项目(小型商城商品展示 + 购物车 + 下单 + 付款)_数据库_10

3.1.3 购物车(Shopcart)

Java EE 阶段小项目(小型商城商品展示 + 购物车 + 下单 + 付款)_数据库_11

3.2 Java Web 后端逻辑难点分析 3.2.1 验证码实现

使用 java 的 2d 绘图工具,绘制一张 png,我的代码对验证码的绘制做了比较好的封装,所以看起来比较舒服

import javax.imageio.ImageIO;import javax.servlet.ServletException;import javax.servlet.ServletOutputStream;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import java.awt.*;import java.awt.image.BufferedImage;import java.io.IOException;import java.util.Random;/** * 生成一个 6位数的验证码,并存放到 session 域中 valiCode * 并通过 response 返回 * */@WebServlet("/CodeServlet")public class CodeServlet extends HttpServlet { private Random random = new Random(); private int width = 80;//宽度 private int height = 40;//高度 private int fontsize = 20;//字体大小 private String str = "0123456789abcdefghijklmnxnlopiiqusdakljnalwABCDEFGHIJKLMNOPQRSTUVWXYZ"; //----------- 简单版本 ------------- private String randCode() { //生成 4个字符 随机字符串代码 String code = ""; for (int i=0; i


【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有