一、系统分析
二、系统设计
2.1 系统功能设计
2.2 数据库设计
三、系统实现
3.1 注册功能
3.2 登录功能
3.3 分页查询所有商品信息功能
3.4 分页条件（精确、模糊）查询商品信息功能
3.5 购物车功能
3.6 订单管理功能
四、项目总结
一、系统分析
在构建一个高效、稳定且用户友好的外设商城系统时，我们需要充分利用各种技术工具来确保系统的顺利运行。其中，HTML、CSS、JSP、Java和JDBC等技术的结合应用，为我们构建这样的系统提供了坚实的基础。
首先，HTML和CSS是构建前端界面的关键工具。它们共同协作，以呈现一个美观且易于导航的商城界面。HTML负责构建页面的基本结构，包括商品列表、详情页、购物车等关键部分的布局。而CSS则负责为这些页面添加样式，如颜色、字体、图片等，以增强用户的视觉体验。通过这些技术，我们可以为外设产品打造一个丰富多样的展示平台，吸引用户的眼球。
其次，JSP技术在动态页面生成方面发挥着重要作用。当用户点击某个商品或进行搜索时，JSP能够根据用户的请求动态生成相应的页面内容。这使得商品详情页、促销信息页等能够实时更新，展示最新的产品信息。此外，JSP还能够与数据库进行交互，获取商品数据并展示在页面上，为用户提供更加个性化的购物体验。
在后端处理方面，Java作为核心编程语言，承担着处理业务逻辑的重要任务。例如，订单管理、库存更新、用户认证等功能都需要通过Java来实现。Java具有强大的功能性和稳定性，能够确保商城系统的正常运行。同时，Java还拥有丰富的库和框架，可以帮助我们快速开发并优化系统性能。
为了实现与数据库的高效连接，我们采用了JDBC技术。JDBC提供了一种标准的方式，使Java程序能够与各种数据库进行通信。通过JDBC，我们可以方便地存储和管理外设产品数据，如商品信息、库存数量、订单记录等。这确保了商城系统的数据一致性和完整性，为用户提供了可靠的购物保障。
此外，基于MVC分层思想，我们采用了Servlet作为控制器，协调前端和后端的交互。MVC模式将应用程序划分为模型、视图和控制器三个层次，有助于实现代码的分离和复用。Servlet作为控制器，负责接收用户的请求并调用相应的业务逻辑进行处理。然后，Servlet将处理结果传递给视图层进行展示。这种分层设计使得商城系统的结构更加清晰，易于维护和扩展。
综上所述，通过HTML、CSS、JSP、Java和JDBC等技术的综合运用，我们可以构建一个功能强大、性能稳定且用户友好的外设商城系统。该系统能够为用户提供丰富的外设产品展示、便捷的购物流程和良好的购物体验，为外设销售商提供有力的支持。
二、系统设计
本系统具备一套全面而完善的功能体系，旨在为用户提供更加便捷、高效和安全的在线购物体验。这些功能不仅丰富了系统的应用场景，还提升了用户的使用体验。
首先，本系统设置了用户注册与登录功能，以确保用户身份的合法性和安全性。用户可以通过简单的注册流程，创建自己的账号，并设置相应的密码。在登录时，系统会进行身份验证，确保只有合法的用户才能进入系统。这一功能有效地保护了用户的隐私和数据安全，让用户能够放心地使用本系统。
其次，本系统提供了分页查询所有商品信息功能。用户可以轻松浏览系统中的所有商品，通过分页的方式查看商品的详细信息，包括名称、价格、图片等。这一功能为用户提供了一个便捷的浏览平台，帮助他们快速找到自己感兴趣的商品。
除了分页查询，本系统还具备分页条件查询商品信息功能。用户可以根据精确或模糊的条件，如商品名称、价格范围、品牌等，进行商品的查找。这一功能大大提高了用户筛选商品的效率，使他们能够更精确地找到符合自己需求的商品。
购物车功能是本系统的重要组成部分。用户可以将心仪的商品添加到购物车中，方便统一管理。购物车支持修改商品数量、删除商品等操作，为用户提供了极大的便利。同时，购物车还具备自动计算总价的功能，帮助用户清晰地了解购物金额。
最后，本系统还具备订单管理功能，以保障交易流程的顺畅进行。用户可以在系统中查看自己的订单信息，包括订单状态、支付情况、发货情况等。系统还提供订单确认、支付、发货等环节的提示和提醒功能，确保用户能够及时了解订单的进展情况。
功能模块图：
图 2-1 功能图
综上所述，本系统具备完善的功能体系，旨在为用户提供全面、高效和安全的在线购物体验。通过注册与登录、分页查询、条件查询、购物车和订单管理等功能的配合，本系统能够满足用户在不同场景下的需求，提升用户的购物体验。
- address 表：包含地址相关信息，如用户编号（Userld）、街道（Street）、省份（Province）、邮政编码（PostalCode）、电话（Phone）和名称（Name）。
表2.1-1address 表
| 字段名 | 数据类型 | 描述 |
| id | int | 地址记录的编号 |
| Userld | int | 用户编号 |
| Street | varchar | 街道名称 |
| Province | varchar | 省份名称 |
| PostalCode | varchar | 邮政编码 |
| Phone | varchar | 电话号码 |
| Name | varchar | 名称 |
- commoditys 表：有关商品的信息，包括编号（id）、标题（Title）、企业（Enterprise）、出版商编号（Publisherld）、出版日期（PublishDate）、国际标准书号（ISBN）、目录（TOC）、类别编号（Categoryld）等。
表2.1-2commoditys 表
| 字段名 | 数据类型 | 描述 |
| id | int | 商品编号 |
| Title | varchar | 商品标题 |
| Enterprise | varchar | 企业名称 |
| Publisherld | int | 出版商编号 |
| PublishDate | 日期型 | 出版日期 |
| ISBN | varchar | 国际标准书号 |
| TOC | varchar | 目录 |
| Categoryld | int | 商品类别编号 |
| Clicks | 整数型 | 点击量 |
- pics 表：可能与图片相关，有公司编号（firm ld）和名称（Name）。
表2.1-3pics 表
| 字段名 | 数据类型 | 描述 |
| firm ld | int | 公司编号 |
| Name | varchar | 公司名称 |
- manufacturer 表：记录制造商的信息，如编号（ld）和名称（Name）。
表2.1-4manufacturer 表
| 字段名 | 数据类型 | 描述 |
| ld | int | 制造商编号 |
| Name | varchar | 制造商名称 |
- ordercommodity 表：涉及订单商品的详情，包括编号（Id）、订单编号（OrderlD）、商品编号（CommoditylD）、数量（Quantity）、单价（UnitPrice）。
表2.1-5ordercommodity 表
| 字段名 | 数据类型 | 描述 |
| Id | int | 订单商品记录编号 |
| OrderlD | int | 订单编号 |
| CommoditylD | int | 商品编号 |
| Quantity | int | 数量 |
| UnitPrice | float | 单价 |
- orders 表：关于订单的表，包含订单编号（id）、订单日期（OrderDate）、用户编号（Userld）、总价（TotalPrice）。
表2.1-6orders 表
| 字段名 | 数据类型 | 描述 |
| id | int | 订单编号 |
| OrderDate | 日期型 | 订单日期 |
| Userld | int | 用户编号 |
| TotalPrice | float | 订单总价 |
表2.1-7userroles 表
| 字段名 | 数据类型 | 描述 |
| ld | int | 用户角色编号 |
| Name | varchar | 用户角色名称 |
- users 表：用户的详细信息，如编号（id）、登录名（Loginld）、登录密码（LoginPwd）、名称（Name）、地址（Address）、电话（Phone）、邮件（Mail）、用户角色编号（UserRoleld）、用户状态编号（UserStateld）。
表2.1-8users 表
| 字段名 | 数据类型 | 描述 |
| id | int | 用户编号 |
| Loginld | varchar | 登录名 |
| LoginPwd | varchar | 登录密码 |
| Name | varchar | 用户名称 |
| Address | varchar | 地址 |
| Phone | varchar | 电话 |
| | varchar | 邮箱 |
| UserRoleld | int | 用户角色编号 |
| UserStateld | int | 用户状态编号 |
- userstates 表：定义用户状态，有编号（ld）和状态名称（Name）。
表2.1-9userstates 表
| 字段名 | 数据类型 | 描述 |
| ld | int | 用户角色编号 |
| Name | varchar | 状态名称 |
用户通过填写必要信息进行注册，系统进行有效性验证后完成注册流程。
网页截图：
图3-1注册
文字描述：用户输入账号密码进行登录，通过验证后进入系统，并利用 cookie 和 session 保持登录状态，同时通过过滤器进行登录权限验证。
网页截图：
图3-2登录
文字描述：能够分页展示所有商品信息，方便用户逐页查看。
网页截图：
文字描述：用户可根据具体条件进行精确或模糊分页查询商品。
网页截图：
图3-4查询
文字描述：用户可将商品添加到购物车，对购物车中的商品进行管理和操作。
网页截图：
图3-5购物车
文字描述：包括订单生成、跟踪和处理等功能。
网页截图：
图3-6订单
使用本项目的优势在于它为广大用户提供了一个便捷、高效的外设购物平台。通过本项目，用户可以轻松浏览、选择并购买各类外设产品，无需再耗费大量时间和精力在实体店或其他线上平台中进行挑选。此外，本项目还具备一系列较为全面的功能，如智能推荐、实时客服等，旨在提升用户的购物体验。
在功能方面，智能推荐系统能够根据用户的浏览历史和购买记录，为用户推荐符合其需求的外设产品，从而提高了用户的购物效率。同时，实时客服服务能够为用户提供及时、专业的解答，帮助用户解决在购物过程中遇到的问题。
然而，需要指出的是，尽管本项目在提供便捷的外设购物体验方面取得了一定的成绩，但我们也认识到在某些方面仍存在不足。首先，在个性化服务方面，本项目尚未提供针对用户的个性化定制服务，这使得部分追求个性化的用户可能无法完全满足其需求。其次，在某些复杂场景下，如大量用户同时在线购物或处理大量订单时，项目的性能还有待进一步提升。此外，界面设计方面虽然整体简洁明了，但仍有待进一步优化，以提供更美观、易用的购物界面。
针对以上不足，我们将采取一系列措施进行优化和改进。在个性化服务方面，我们将积极探索并引入个性化定制功能，以满足用户对个性化外设的需求。在性能优化方面，我们将加大技术研发投入，提升项目的处理能力和稳定性，确保在高峰时段也能为用户提供流畅、稳定的购物体验。同时，我们还将对界面设计进行持续改进，注重色彩搭配和布局合理性，以提供更加美观、易用的购物界面。
总之，本项目在提供便捷的外设购物体验方面已经取得了显著的成果，但仍需不断优化和改进，以更好地满足用户的需求和期望。我们将继续努力提升项目的功能和性能，并不断完善用户体验，以打造一个更加优秀、专业的外设购物平台。
完整源码：
@WebServlet("/commodityservlet")public class commodityservlet extends HttpServlet {//定义一个commodityService作为属性，以便调用相关方法commodityService commodityService = new commodityServiceImpl();protected void queryByTitle(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {String bname = request.getParameter("value");commodityServiceImpl service = new commodityServiceImpl();List<commoditys> searchBList = new ArrayList<commoditys>();searchBList = service.getcommoditysByTitle(bname);//封装成分页对象PageBean<commoditys> Pager = new PageBean<commoditys>(1, 5, searchBList);request.getSession().setAttribute("searchcommoditys", Pager);response.sendRedirect("search.jsp");}protected void queryByPublish(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {String bname = request.getParameter("value");commodityServiceImpl service = new commodityServiceImpl();List<commoditys> searchBList = new ArrayList<commoditys>();searchBList = service.getcommoditysByPublishName(bname);//封装成分页对象PageBean<commoditys> Pager = new PageBean<commoditys>(1, 5, searchBList);request.getSession().setAttribute("searchcommoditys", Pager);response.sendRedirect("search.jsp");}protected void queryByCategoryName(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {String bname = request.getParameter("value");commodityServiceImpl service = new commodityServiceImpl();List<commoditys> searchBList = new ArrayList<commoditys>();searchBList = service.getcommoditysByCategoryName(bname);//封装成分页对象PageBean<commoditys> Pager = new PageBean<commoditys>(1, 5, searchBList);request.getSession().setAttribute("searchcommoditys", Pager);response.sendRedirect("search.jsp");}}Dao 层代码示例：package dao.impl;import bean.commoditys;import dao.commodityDao;import utils.JDBCUtilsByDruid;import org.apache.commons.dbutils.QueryRunner;import org.apache.commons.dbutils.handlers.BeanListHandler;public class commodityDaoImpl implements commodityDao {private QueryRunner qr = new QueryRunner();@Overridepublic List<commoditys> getcommoditysByTitle(String title) {String sql = "SELECT * FROM commoditys WHERE title LIKE?";try {return qr.query(JDBCUtilsByDruid.getConnection(), sql, new BeanListHandler<commoditys>(commoditys.class), "%" + title + "%");} catch (Exception e) {throw new RuntimeException(e);}}@Overridepublic List<commoditys> getcommoditysByPublishName(String publishName) {String sql = "SELECT * FROM commoditys WHERE publish_name LIKE?";try {return qr.query(JDBCUtilsByDruid.getConnection(), sql, new BeanListHandler<commoditys>(commoditys.class), "%" + publishName + "%");} catch (Exception e) {throw new RuntimeException(e);}}@Overridepublic List<commoditys> getcommoditysByCategoryName(String categoryName) {String sql = "SELECT * FROM commoditys WHERE category_name LIKE?";try {return qr.query(JDBCUtilsByDruid.getConnection(), sql, new BeanListHandler<commoditys>(commoditys.class), "%" + categoryName + "%");} catch (Exception e) {throw new RuntimeException(e);}}}service 层代码示例：package service.impl;import bean.PageBean;import bean.commoditys;import dao.commodityDao;import dao.impl.commodityDaoImpl;import service.commodityService;public class commodityServiceImpl implements commodityService {private commodityDao commodityDao = new commodityDaoImpl();@Overridepublic PageBean<commoditys> getcommoditysByTitle(String title, int pageNo, int pageSize) {//根据商品名获取商品列表List<commoditys> blist = commodityDao.getcommoditysByTitle(title);//计算总记录数int totalRow = blist.size();//计算总页数int pageTotalCount = totalRow / pageSize;if (totalRow % pageSize > 0) {pageTotalCount++;}//根据分页参数获取当前页的商品列表List<commoditys> pageItems = blist.subList((pageNo - 1) * pageSize, Math.min(pageNo * pageSize, totalRow));//创建分页对象PageBean<commoditys> Pager = new PageBean<commoditys>(pageNo, pageSize, totalRow, pageTotalCount, pageItems);return Pager;}@Overridepublic PageBean<commoditys> getcommoditysByPublishName(String publishName, int pageNo, int pageSize) {//根据店铺名称获取商品列表List<commoditys> blist = commodityDao.getcommoditysByPublishName(publishName);//计算总记录数int totalRow = blist.size();//计算总页数int pageTotalCount = totalRow / pageSize;if (totalRow % pageSize > 0) {pageTotalCount++;}//根据分页参数获取当前页的商品列表List<commoditys> pageItems = blist.subList((pageNo - 1) * pageSize, Math.min(pageNo * pageSize, totalRow));//创建分页对象PageBean<commoditys> Pager = new PageBean<commoditys>(pageNo, pageSize, totalRow, pageTotalCount, pageItems);return Pager;}@Overridepublic PageBean<commoditys> getcommoditysByCategoryName(String categoryName, int pageNo, int pageSize) {//根据分类名称获取商品列表List<commoditys> blist = commodityDao.getcommoditysByCategoryName(categoryName);//计算总记录数int totalRow = blist.size();//计算总页数int pageTotalCount = totalRow / pageSize;if (totalRow % pageSize > 0) {pageTotalCount++;}//根据分页参数获取当前页的商品列表List<commoditys> pageItems = blist.subList((pageNo - 1) * pageSize, Math.min(pageNo * pageSize, totalRow));//创建分页对象PageBean<commoditys> Pager = new PageBean<commoditys>(pageNo, pageSize, totalRow, pageTotalCount, pageItems);
serlvet 层代码示例：@WebServlet("/OrderServlet")public class OrderServlet extends HttpServlet {private OrderService orderService = new OrderServiceImpl();protected void saveOrder(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {Cart cart = (Cart) req.getSession().getAttribute("cart");//如果cart为null,说明没有买任何东西，直接转发到首页if (null == cart) {req.getRequestDispatcher("/index.jsp").forward(req, resp);return;}//获取当前登录的memberIdMember member = (Member) req.getSession().getAttribute("member");if (null == member) {//说明用户没有登陆，转发到登陆页面req.getRequestDispatcher("/views/member/login.jsp").forward(req, resp);return;}//生成订单String orderId = orderService.saveOrder(cart, member.getId());req.getSession().setAttribute("orderId", orderId);resp.sendRedirect(req.getContextPath() + "/views/order/checkout.jsp");}}Dao 层代码示例：package dao.impl;import bean.Order;import dao.OrderDAO;import utils.JDBCUtilsByDruid;import org.apache.commons.dbutils.QueryRunner;import org.apache.commons.dbutils.handlers.BeanHandler;import org.apache.commons.dbutils.handlers.ScalarHandler;public class OrderDAOImpl implements OrderDAO {private QueryRunner qr = new QueryRunner();@Overridepublic int saveOrder(Order order) {String sql = "INSERT INTO `order`(member_id, total_price) VALUES(?,?)";Object[] params = {order.getMemberId(), order.getTotalPrice()};return update(sql, params);}}service 层代码示例package service.impl;import bean.Cart;import bean.Member;import bean.Order;import dao.OrderDAO;import dao.impl.OrderDAOImpl;import service.OrderService;public class OrderServiceImpl implements OrderService {private OrderDAO orderDAO = new OrderDAOImpl();@Overridepublic String saveOrder(Cart cart, int memberId) {//创建订单对象Order order = new Order();order.setMemberId(memberId);order.setTotalPrice(cart.getTotPrice());//保存订单到数据库orderDAO.saveOrder(order);//返回订单idreturn order.getId();}} serlvet 层代码示例：@WebServlet("/OrderServlet")public class OrderServlet extends HttpServlet {private OrderService orderService = new OrderServiceImpl();protected void saveOrder(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {Cart cart = (Cart) req.getSession().getAttribute("cart");//如果cart为null,说明没有买任何东西，直接转发到首页if (null == cart) {req.getRequestDispatcher("/index.jsp").forward(req, resp);return;}//获取当前登录的memberIdMember member = (Member) req.getSession().getAttribute("member");if (null == member) {//说明用户没有登陆，转发到登陆页面req.getRequestDispatcher("/views/member/login.jsp").forward(req, resp);return;}//生成订单String orderId = orderService.saveOrder(cart, member.getId());req.getSession().setAttribute("orderId", orderId);resp.sendRedirect(req.getContextPath() + "/views/order/checkout.jsp");}}Dao 层代码示例：package dao.impl;import bean.Order;import dao.OrderDAO;import utils.JDBCUtilsByDruid;import org.apache.commons.dbutils.QueryRunner;import org.apache.commons.dbutils.handlers.BeanHandler;import org.apache.commons.dbutils.handlers.ScalarHandler;public class OrderDAOImpl implements OrderDAO {private QueryRunner qr = new QueryRunner();@Overridepublic int saveOrder(Order order) {String sql = "INSERT INTO `order`(member_id, total_price) VALUES(?,?)";Object[] params = {order.getMemberId(), order.getTotalPrice()};return update(sql, params);}}service 层代码示例package service.impl;import bean.Cart;import bean.Member;import bean.Order;import dao.OrderDAO;import dao.impl.OrderDAOImpl;import service.OrderService;public class OrderServiceImpl implements OrderService {private OrderDAO orderDAO = new OrderDAOImpl();@Overridepublic String saveOrder(Cart cart, int memberId) {//创建订单对象Order order = new Order();order.setMemberId(memberId);order.setTotalPrice(cart.getTotPrice());//保存订单到数据库orderDAO.saveOrder(order);//返回订单idreturn order.getId();}}
![[数据集][目标检测]金属罐缺陷检测数据集VOC+YOLO格式8095张4类别](https://i-blog.csdnimg.cn/direct/9bbf7c52fa9e4e5cb05cf4d76b7ffea1.png)
