【JAVAWEB开发】基于Java+Servlet+Ajax+jsp网上购物系统设计实现

偏执的太偏执、 2024-04-07 11:52 129阅读 0赞

> 哈喽~大家好呀，这篇给的大家带来的是网上购物系统设计。在传统电商时代，用户是先有需求再购买，用户对平台较为依赖，商家对消费者很难有直接的影响力，而如今社交 + 电商解决了产品质量的信息不对称问题，电商已经成为当今经济发展的一个重要领域。而网上购物就是实现之一，现在我们就来看看吧。

一、效果演示

1、首页界面

![93f88cf8f6cb4d24b36cc16ec1daa0f4.png][]

如果没有登录，就只能查看无法购买

2、商品界面

![373577824c264bcdaf9c91df3e1a17ba.png][]

3、商品详情界面

![259071b730db44f3a38932854ece77bd.png][]

4、购物车界面

![a2af76d7ea3a4bbfa817df2308f8c2b7.png][]

5、购物订单界面

![2398d53282cc4a168d85db1b0fa18386.png][]

6、交易成功界面

![3ffa15b3253841e882ce1be176ca574b.png][]

7、个人订单界面

![dce8ea8d700d4e058813bca2e868dd28.png][]

8、个人收藏界面

![cff36a06303147f9bc5a383c2037ce0d.png][]

9、管理员界面

![47526f38979a4f62868681f3e99494dc.png][]

10、全部订单界面

![8f48742cbf2548cb963d6e24e4e04ba8.png][]

11、全部收藏界面

![b6b79dffa3c445d993e93efae774e723.png][]

二、数据库设计

> **数据库定义：**数据库是存放数据的仓库。它的存储空间很大，可以存放百万条、千万条、上亿条数据。但是数据库并不是随意地将数据进行存放，是有一定的规则的，否则查询的效率会很低。当今世界是一个充满着数据的互联网世界，充斥着大量的数据。即这个互联网世界就是数据世界。数据的来源有很多，比如出行记录、消费记录、浏览的网页、发送的消息等等。除了文本类型的数据，图像、音乐、声音都是数据。
> 
> **用户表（user）**：字段（id，用户名，密码，电话，邮箱）
> 
> **购物车表（shopping\_cart）：**字段（id，用户名，商品名，价格，购买数量，总价，图片地址）
> 
> **订单表（order）：**字段（id，商品名，邮箱，用户名，收货地址，收货电话）
> 
> **商品详情表（goods\_parameters）：**字段（id，商品类型，图片地址）
> 
> **商品类型（favorite）：**字段（id，商品类型名）
> 
> **商品表（user）：**字段（id，商品名，商品类型名，价格，图片地址，销量，库存）
> 
> **收藏表（favorite）：**字段（id，用户名，商品名，价格，图片地址）
> 
> **历史记录表（browsinghistory）：**字段（id，记录名，记录价格，记录图片地址）、
> 
> **品牌表（brand）**：字段（id，用户名，品牌类型，品牌名）
> 
> ![5d504fea03aa49b7a407c1555160205b.png][]

三、部分代码展示

登录展示

<div class="registerarea ">
            
            <h4>登录账号
                <div class="login"> 没有账号，去<a href="register.jsp" class="style_red">注册</a>    <a href="retrievePassword.jsp">忘记密码？点击找回</a></div>
            </h4>
            
            <div class="reg_form">
                <form action="/EasybuyProject/loginServlet" class="submit" method="post">
                    <ul class="clearfix:after">
                        <li>
                            <label>账号：</label> <input type="text" class="inp username" name="username">
                            <span class="error">格式错误，应为长度6-20并含有大小写字母数字</span>
                            <font color="red">
                                <%
                                    if(session.getAttribute("messageLogin")!= null){
                                        out.print(session.getAttribute("messageLogin"));
                                        session.invalidate();
                                    }
                                %>
                            </font>
    
    
                        </li>
    
                        <li>
                            <label>密码：</label> <input type="password" class="inp password" name="password">
    <%--                        <span class="error">格式错误，应为长度6-20并含有大小写字母数字</span>--%>
                        </li>
                        <li>
                            <input type="submit" class="inputButton" value="登录">   
                            <input type="reset" value="重置" class="inputButton">
                        </li>
                    </ul>
                </form>
            </div>
        </div>

正则验证

Servlet

@WebServlet("/EasybuyProject/loginServlet")
    public class LoginServlet extends HttpServlet {
    
        @Override
        protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
            doPost(req, resp);
        }
    
        @Override
        protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
    
            req.setCharacterEncoding("utf8");
            resp.setCharacterEncoding("utf8");
            resp.setContentType("text/html;charset=UTF-8");
    
            String username = req.getParameter("username");
            String password = req.getParameter("password");
    
            UserService userService = new UserServiceImpl();
            User user = userService.login(username, password);
    
            HttpSession session = req.getSession();
    
            if (user != null && (!Objects.equals(username, "XzwadminNo1")) && !Objects.equals(password, "XzwadminNo1")) {
                resp.sendRedirect("/FrontPage/index.jsp");
                session.setAttribute("success",username);
            } else if(Objects.equals(username, "XzwadminNo1") && Objects.equals(password, "XzwadminNo1")){
                session.setAttribute("success",username);
                resp.sendRedirect("/FrontPage/indexAdmin.jsp");
            } else {
                session.setAttribute("messageLogin","用户名或者密码错误");
                resp.sendRedirect("/FrontPage/login.jsp");
            }
    
        }
    
    }

实体类

public class User {
    
        private int id;
        private String username;
        private String password;
        private String tel;
        private String email;
    
        public User() {
        }
    
        public User(String tel, String email) {
            this.tel = tel;
            this.email = email;
        }
    
        public User(int id, String username, String password, String tel, String email) {
            this.id = id;
            this.username = username;
            this.password = password;
            this.tel = tel;
            this.email = email;
        }
    
        public int getId() {
            return id;
        }
    
        public void setId(int id) {
            this.id = id;
        }
    
        public String getUsername() {
            return username;
        }
    
        public void setUsername(String username) {
            this.username = username;
        }
    
        public String getPassword() {
            return password;
        }
    
        public void setPassword(String password) {
            this.password = password;
        }
    
        public String getTel() {
            return tel;
        }
    
        public void setTel(String tel) {
            this.tel = tel;
        }
    
        public String getEmail() {
            return email;
        }
    
        public void setEmail(String email) {
            this.email = email;
        }
    
        @Override
        public String toString() {
            return "User{" +
                    "id=" + id +
                    ", username='" + username + '\'' +
                    ", password='" + password + '\'' +
                    ", tel='" + tel + '\'' +
                    ", email='" + email + '\'' +
                    '}';
        }
    }

Dao

public User login(String username, String password) {
            User user = null;
            Connection connection = null;
            PreparedStatement preparedStatement = null;
            ResultSet resultSet = null;
    
            try {
                connection = JdbcUtil.getConnection();
                String sql = "select * from user where username = ? and password= ?";
                preparedStatement = connection.prepareStatement(sql);
                preparedStatement.setString(1, username);
                preparedStatement.setString(2, password);
    
                resultSet = preparedStatement.executeQuery();
                if (resultSet.next()) {
                    user = new User();
                    user.setUsername(resultSet.getString("username"));
                    user.setPassword(resultSet.getString("password"));
                }
            } catch (Exception e) {
                e.printStackTrace();
            } finally {
                JdbcUtil.release(resultSet, preparedStatement, connection);
            }
            return user;
        }

效果展示

![7eaf77e49c33479e9a6179e4a908c4fc.png][]

源码获取见公众号

> **不积跬步无以至千里，趁年轻，使劲拼，给未来的自己一个交代！向着明天更好的自己前进吧！**
> 
> ![02bed6ae9d27419b804c4605db6cee66.gif][]

[93f88cf8f6cb4d24b36cc16ec1daa0f4.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/07/8f1d81a47ed6483e9a159b405de101d2.png
[373577824c264bcdaf9c91df3e1a17ba.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/07/a2c7b59e70ad46d48135226aabe34ce2.png
[259071b730db44f3a38932854ece77bd.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/07/d8a2e449ca294472991735289ccb9355.png
[a2af76d7ea3a4bbfa817df2308f8c2b7.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/07/1b65c05cf0c64223a41d0afd4945cb23.png
[2398d53282cc4a168d85db1b0fa18386.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/07/8c65b242997d4437b4343f891cfc3302.png
[3ffa15b3253841e882ce1be176ca574b.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/07/599ca17767924ac3b4c24da7df58d1e3.png
[dce8ea8d700d4e058813bca2e868dd28.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/07/5bbe17076a0b44bbb14ee2c6338d0a36.png
[cff36a06303147f9bc5a383c2037ce0d.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/07/3607ab309ae54cb9b925d590c2bce6bc.png
[47526f38979a4f62868681f3e99494dc.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/07/07c68a3c9ace44798296ecc8e1c9fce5.png
[8f48742cbf2548cb963d6e24e4e04ba8.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/07/39724d11d6bc4ff1bafe52ae363812da.png
[b6b79dffa3c445d993e93efae774e723.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/07/131e9dcae25e45d38fec4f550c5d0117.png
[5d504fea03aa49b7a407c1555160205b.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/07/429e6141ecde44de919b9c86c1785396.png
[7eaf77e49c33479e9a6179e4a908c4fc.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/07/91946e0b403e4282901dae4c4d50a84b.png
[02bed6ae9d27419b804c4605db6cee66.gif]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/07/226c977b7c3448ceab6130309699c25a.gif