【JavaWeb项目】——外卖订餐系统之登入、登入后显示餐品信息、用户注册、注销部分

news2024/11/15 9:57:07

🎼个人主页:【Y小夜】

😎作者简介:一位双非学校的大二学生,编程爱好者,

专注于基础和实战分享,欢迎私信咨询!

🎆入门专栏:🎇【MySQL,Java基础,Rust】

🎈热门专栏:🎊【Python,Javaweb,Vue框架】

感谢您的点赞、关注、评论、收藏、是对我最大的认可和支持!❤️

🎯Tomcat配置

        不会使用Tomcat的小伙伴可以去看

搭建第一个Web服务器(在eclipse或idea上部署Tomcat服务器)_eclipse创建一个web项目-CSDN博客

😎Server部分

将URL部分配置为:

http://localhost:8080/webdingcan/login.jsp

😎Deployment部分

🎯登入部分

😎前端页面login.jsp部分

🎈代码


<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>登入注册界面</title>
    <%--    引入Bootstrap--%>
    <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="css/login.css">
</head>
<body>
<form action="showFoodServlet" method="post" role="form" class="form-horizontal">
    <div class="first">
        <div class="one">
            优选外卖订餐系统
        </div>
        <div class="form-group">
            <label for="firstname" class="col-sm-2 control-label">账户名:</label>
            <div class="col-sm-8">
                <input id="firstname" type="text" class="form-control" name="name" placeholder="请输入用户名">
            </div>
        </div>
        <div class="form-group">
            <label for="lastname" class="col-sm-2 control-label">密码:</label>
            <div class="col-sm-8">
                <input class="form-control" id="lastname" type="password" name="password" placeholder="请输入密码">
            </div>
        </div>
        <div class="chose">
            <input type="radio" name="identity" value="0" checked>
            <label>用户</label>
            <input type="radio" name="identity" value="1">
            <label>商家</label>
        </div>
        <div class="two">
            <button type="submit" class="btn">登入</button>
        </div>
        <div class="three">
            <a href="u1/signUer.jsp" role="button" class="btn">用户注册</a>
        </div>
        <div class="four">
            <label>${msg}</label>
        </div>
    </div>
</form>
</body>
</html>

🎈解析

        这是一个使用JSP和Bootstrap框架创建的登录注册界面:

  1. 页面头部声明了页面的内容类型为"text/html;charset=UTF-8",表示页面使用的是HTML格式,并且字符编码为UTF-8。同时,使用了Java语言编写JSP代码。

  2. 引入了JSTL标签库,用于在JSP页面中进行条件判断和循环等操作。

  3. 页面主体部分包含了一个表单,表单的action属性设置为"showFoodServlet",表示提交表单后会向该URL发送请求。表单的method属性设置为"post",表示使用POST方法提交表单数据。

  4. 表单内部包含一个div元素,class属性设置为"first",表示这是整个登录注册界面的主体部分。

  5. 在"first" div内部,有一个标题显示为"优选外卖订餐系统"。

  6. 接下来是一个用户名输入框,label标签显示"账户名:",input标签的id属性设置为"firstname",type属性设置为"text",表示这是一个文本输入框。name属性设置为"name",表示提交表单时将该输入框的值作为名为"name"的参数传递。placeholder属性设置为"请输入用户名",表示输入框中的提示信息。

  7. 类似地,还有一个密码输入框,label标签显示"密码:",input标签的id属性设置为"lastname",type属性设置为"password",表示这是一个密码输入框。name属性设置为"password",表示提交表单时将该输入框的值作为名为"password"的参数传递。placeholder属性设置为"请输入密码",表示输入框中的提示信息。

  8. 接下来是一个单选按钮组,用于选择用户或商家身份。两个单选按钮分别设置了value属性为"0"和"1",表示不同的选项值。默认选中第一个单选按钮(用户)。

  9. 在单选按钮下方有一个提交按钮,button标签的type属性设置为"submit",表示点击该按钮会提交表单。按钮上的文字显示为"登入"。

  10. 在提交按钮下方有一个链接,a标签的href属性设置为"u1/signUer.jsp",表示点击该链接会跳转到指定的URL。链接上的文字显示为"用户注册"。

  11. 最后,有一个label标签用于显示错误信息,内容为"${msg}",其中msg是一个变量,可能在后端代码中设置。

        总体来说,这个登录注册界面提供了基本的表单验证功能,用户可以输入用户名和密码,选择身份,然后点击登入按钮进行登录。如果登录失败,页面上会显示错误信息。同时,还提供了一个用户注册的链接。

🎈效果

😎后端处理过滤器部分

🎈代码

package com.dingcan.controller;

import com.dingcan.service.Impl.UserServiceImpl;
import com.dingcan.service.UserService;
import com.dingcan.service.Impl.ShangServiceImpl;
import com.dingcan.service.ShangService;

import javax.servlet.*;
import javax.servlet.annotation.WebFilter;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
@WebFilter(filterName = "FoodFilterServlet",value = "/showFoodServlet")
public class FoodFilterServlet implements Filter {
    public void init(FilterConfig filterConfig) throws ServletException {
        Filter.super.init(filterConfig);
    }

    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
        HttpServletRequest req=(HttpServletRequest) servletRequest;
        HttpServletResponse resp=(HttpServletResponse) servletResponse;
        String name = req.getParameter("name");
        String password = req.getParameter("password");
        String identity = null;
        if (req.getSession().getAttribute("identity")!=null){
            identity=(String) req.getSession().getAttribute("identity");
        }else {
            identity=req.getParameter("identity");
            req.getSession().setAttribute("identity",identity);
        }

        if(identity.equals("0")){
            //判断session中是否为用户
            if ( req.getSession().getAttribute("uid1")!=null) {
                resp.sendRedirect("ushowFoodServlet");
                return;
            }
            //创建用户对象
            UserService userService=new UserServiceImpl();
            int uid=userService.FindUid(name,password);
            if (uid!=0){
                req.getSession().setAttribute("uid1",uid);
                resp.sendRedirect("ushowFoodServlet");
            }
            else {
                req.getSession().setAttribute("uid1", null);
                req.getSession().setAttribute("identity", null);
                //如果登入失败
                String msg = "账户名或密码错误,请重新输入";
                req.setAttribute("msg", msg);
                req.getRequestDispatcher("login.jsp").forward(req, resp);
            }
        }
        else if(identity.equals("1")){
            //创建商家对象
            ShangService shangService=new ShangServiceImpl();
            //判断session中是否为商家
            if ( req.getSession().getAttribute("sid1")!=null) {
                filterChain.doFilter(req, resp);
                return;
            }
            int sid=shangService.FindSid(name,password);
            if(sid!=0){
                // 登录成功,将用户信息存储在session中
                req.getSession().setAttribute("sid1",sid);
                filterChain.doFilter(req, resp);
            }else{
                // 如果登录失败,也将账户信息设置为null
                req.getSession().setAttribute("sid1", null);
                req.getSession().setAttribute("identity", null);
                String msg = "账户名或密码错误,请重新输入";
                req.setAttribute("msg", msg);
                req.getRequestDispatcher("login.jsp").forward(req, resp);
            }
        }

    }

    public void destroy() {
        Filter.super.destroy();
    }
}

🎈解析

        这段代码是一个Java Web应用程序中的过滤器(Filter),用于处理用户登录和商家登录的验证。过滤器的作用是在请求到达目标Servlet之前,对请求进行预处理,例如验证用户身份、过滤敏感词汇等。在这个例子中,过滤器主要用于验证用户和商家的登录信息。

  1. 导入相关类:导入了UserServiceImpl、ShangServiceImpl、UserService、ShangService等服务类,以及javax.servlet包下的Filter、FilterChain、ServletRequest、ServletResponse等接口和类。

  2. 定义FoodFilterServlet类:实现了Filter接口,并使用@WebFilter注解指定了过滤器的名称和要过滤的URL路径(/showFoodServlet)。

  3. init方法:初始化过滤器时调用的方法,这里只是简单地调用了父类的init方法。

  4. doFilter方法:主要的逻辑处理方法,当有请求到达时会被调用。首先获取HttpServletRequest和HttpServletResponse对象,然后从请求中获取用户名、密码和身份信息。接着根据身份信息判断是用户还是商家,并进行相应的处理。

    • 如果身份为"0"(用户):检查session中是否已经有用户信息,如果有则重定向到用户展示食品的页面;如果没有,则创建UserService对象,调用FindUid方法查找用户ID,如果找到则将用户ID存入session并重定向到用户展示食品的页面,否则清空session中的用户信息并将错误信息设置到request域中,最后转发到登录页面。

    • 如果身份为"1"(商家):检查session中是否已经有商家信息,如果有则继续执行后续操作;如果没有,则创建ShangService对象,调用FindSid方法查找商家ID,如果找到则将商家ID存入session并继续执行后续操作,否则清空session中的商家信息并将错误信息设置到request域中,最后转发到登录页面。

  5. destroy方法:销毁过滤器时调用的方法,这里只是简单地调用了父类的destroy方法。

        总结:这个过滤器主要用于处理用户和商家登录的验证,根据登录信息的不同,将用户或商家的信息存储在session中,并根据验证结果进行相应的跳转。

🎯登入后显示餐品信息部分

😎商家登入后显示

🎈后端请求ShowFoodServlet部分

✨代码
package com.dingcan.controller;

import cn.hutool.db.Entity;
import com.dingcan.service.FoodService;
import com.dingcan.service.Impl.FoodServiceImpl;

import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.List;

@WebServlet(name = "ShowFoodServlet", value = "/showFoodServlet")
public class ShowFoodServlet extends HttpServlet {
    FoodService foodService=new FoodServiceImpl();
    protected void service(HttpServletRequest req, HttpServletResponse resp) throws javax.servlet.ServletException, IOException {
        //获取session中的sid
        int sid1=(int)req.getSession().getAttribute("sid1");
        String sql="select * from food,shangjia,dianpu where food.`fdianid`=dianpu.`did` and dianpu.`did`=shangjia.`sdianid` and sid="+sid1;
        List<Entity> list=foodService.findFood(sql);
        //将list放入request域中
        req.setAttribute("list",list);
        req.getRequestDispatcher("/s1/showFood1.jsp").forward(req,resp);
    }

}
✨解析

        这段代码是一个Java Servlet,用于处理HTTP请求并返回HTTP响应。它主要用于展示特定商家的餐品信息。以下是对代码的详细解析:

  1. package com.dingcan.controller;:这是代码所在的包名,表示该类属于com.dingcan.controller包。

  2. import cn.hutool.db.Entity;:导入了cn.hutool.db.Entity类,这是一个用于操作数据库实体的工具类。

  3. import com.dingcan.service.FoodService;:导入了FoodService接口,这是一个用于处理食品相关业务逻辑的服务接口。

  4. import com.dingcan.service.Impl.FoodServiceImpl;:导入了FoodService接口的实现类FoodServiceImpl。

  5. import javax.servlet.annotation.WebServlet;:导入了WebServlet注解,用于声明Servlet的配置信息。

  6. import javax.servlet.http.HttpServlet;:导入了HttpServlet类,这是Servlet的基本类。

  7. import javax.servlet.http.HttpServletRequest;:导入了HttpServletRequest类,用于处理客户端发送的请求。

  8. import javax.servlet.http.HttpServletResponse;:导入了HttpServletResponse类,用于生成服务器端的响应。

  9. import java.io.IOException;:导入了IOException类,用于处理输入输出异常。

  10. @WebServlet(name = "ShowFoodServlet", value = "/showFoodServlet"):使用WebServlet注解声明了一个名为ShowFoodServlet的Servlet,其访问路径为/showFoodServlet。

  11. public class ShowFoodServlet extends HttpServlet {:定义了一个名为ShowFoodServlet的类,继承自HttpServlet。

  12. FoodService foodService=new FoodServiceImpl();:创建了一个FoodServiceImpl实例,并将其赋值给foodService变量。

  13. protected void service(HttpServletRequest req, HttpServletResponse resp) throws javax.servlet.ServletException, IOException {:重写了HttpServlet类的service方法,用于处理客户端的请求。该方法接收两个参数:HttpServletRequest对象(req)和HttpServletResponse对象(resp)。

  14. int sid1=(int)req.getSession().getAttribute("sid1");:从session中获取名为"sid1"的属性值,并将其转换为整数类型。

  15. String sql="select * from food,shangjia,dianpu where food.fdianid=dianpu.did and dianpu.did=shangjia.sdianid and sid="+sid1;:构造一个SQL查询语句,用于从数据库中查询与指定商家相关的食品信息。

  16. List<Entity> list=foodService.findFood(sql);:调用foodService的findFood方法,传入SQL查询语句,执行查询并将结果存储在list变量中。

  17. req.setAttribute("list",list);:将查询到的食品信息列表存入request域中,键名为"list"。

  18. req.getRequestDispatcher("/s1/showFood1.jsp").forward(req,resp);:通过RequestDispatcher将请求转发到/s1/showFood1.jsp页面,并将request和response对象传递给该页面。

        总结:这段代码定义了一个名为ShowFoodServlet的Servlet,用于处理客户端发起的请求,查询特定商家的食品信息,并将查询结果展示在/s1/showFood1.jsp页面上。

🎈前端页面showFood1.jsp部分

✨代码

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>展示商家登入的信息</title>
    <!-- 引入 Bootstrap -->
    <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link href="css/sShow.css" rel="stylesheet">
</head>
<body>
<div class="first">
    <div class="one">
        <div class="two">
            <img src="image/four.jpg" alt="LOGO">
            <label>优质外卖订餐系统</label>
        </div>
        <div class="three">
            <a href="exitServlet" class="btn">注销</a>
        </div>
    </div>
    <div class="btn-group-vertical">
        <a href="showFoodServlet" class="btn" role="button">餐品展示</a>
        <a href="s1/addFood.jsp" class="btn" role="button">添加餐品</a>
        <a href="hotFoodServlet" class="btn" role="button">热门餐品</a>
        <a href="showCarServlet" class="btn" role="button">出售车</a>
    </div>
    <div class="four">
        <table  class="table table-striped table-bordered table-condensed">
            <thead>
            <tr class="danger">
                <td>餐品名称</td>
                <td>购买人数</td>
                <td>价格</td>
                <td>状态</td>
                <td>操作</td>
            </tr>
            </thead>
            <tbody>
            <c:forEach items="${list}" var="food">
                <tr class="success">
                    <td>${food.fname}</td>
                    <td>${food.fcount}</td>
                    <td>${food.fprice}</td>
                    <td>${food.fstate == 1 ? "销售中" : "下架"}</td>
                    <td>
                        <a href="findFoodServlet?fid=${food.fid}" class="btn btn-primary">修改</a>
                    </td>
                </tr>
            </c:forEach>
            </tbody>
        </table>
    </div>
</div>
</body>
</html>
✨解析

        这段代码是一个使用JSP(JavaServer Pages)编写的Web页面,它使用了HTML和Bootstrap框架来构建用户界面,并使用JSTL(JavaServer Pages Standard Tag Library)标签来动态显示数据。下面是对代码的详细解析:

  1. 页面指令:

    • <%@ page contentType="text/html;charset=UTF-8" language="java" %>: 这行代码设置了页面的内容类型为HTML,字符集为UTF-8,并指定脚本语言为Java。
    • <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>: 这行代码引入了JSTL核心标签库,prefix="c"定义了标签前缀,后面使用JSTL标签时会用到。
  2. HTML结构:

    • <html>: 定义了页面的根元素。
    • <head>: 包含了页面的元数据,如标题和样式表链接。
    • <title>: 设置页面标题为“展示商家登入的信息”。
    • <link>: 引入了Bootstrap的CSS文件,用于页面样式,以及自定义的CSS文件sShow.css
  3. 页面内容:

    • <div class="first">: 定义了页面的主要内容区域。
    • <div class="one">: 包含了LOGO和标题。
      • <img src="image/four.jpg" alt="LOGO">: 显示LOGO图片。
      • <label>: 显示文本“优质外卖订餐系统”。
    • <div class="three">: 包含一个注销按钮,链接到exitServlet
    • <div class="btn-group-vertical">: 垂直排列的按钮组,包含餐品展示、添加餐品、热门餐品和出售车的链接。
  4. 导航链接:

    • <a href="..." class="btn" role="button">: 创建Bootstrap样式的按钮,链接到不同的Servlet处理不同的业务逻辑。
  5. 表格展示:

    • <table class="table table-striped table-bordered table-condensed">: 创建一个带有Bootstrap样式的表格,用于展示数据。
    • <thead> 和 <tr class="danger">: 定义表格的头部,包含列标题。
    • <tbody>: 表格的主体部分,用于展示具体的数据。
  6. JSTL标签使用:

    • <c:forEach items="${list}" var="food">: 这是一个JSTL循环标签,用于遍历从后端传递到页面的list集合,每次循环将当前元素赋值给变量food
    • <tr class="success">: 表格的一行,展示了餐品的名称、购买人数、价格、状态和操作按钮。
    • <c:forEach>标签内部的${food.fname}${food.fcount}${food.fprice}, 和${food.fstate}是表达式,用于访问food对象的属性。
  7. 条件表达式:

    • ${food.fstate == 1 ? "销售中" : "下架"}: 这是一个条件表达式,根据food.fstate的值显示“销售中”或“下架”。
  8. 操作链接:

    • <a href="findFoodServlet?fid=${food.fid}" class="btn btn-primary">修改</a>: 创建一个按钮链接,链接到findFoodServlet,传递food.fid作为参数,用于修改餐品信息。
  9. 注销链接:

    • <a href="exitServlet" class="btn">注销</a>: 创建一个按钮链接,用于注销当前用户会话。

        整个页面是一个商家登录后的管理系统界面,可以展示餐品信息,提供餐品管理功能,如查看、添加、修改等。使用JSTL标签可以方便地将Java代码和页面内容分离,提高代码的可维护性。

✨效果

😎用户登入后显示

🎈后端处理 UshowFoodServlet部分

✨代码
package com.dingcan.controller;

import cn.hutool.db.Entity;
import com.dingcan.service.FoodService;
import com.dingcan.service.Impl.FoodServiceImpl;
import com.dingcan.service.Impl.UserServiceImpl;
import com.dingcan.service.UserService;

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 java.io.IOException;
import java.util.List;
@WebServlet(name = "UshowFoodServlet", value = "/ushowFoodServlet")
public class UshowFoodServlet extends HttpServlet {
    FoodService foodService=new FoodServiceImpl();
    UserService userServic=new UserServiceImpl();
    @Override
    protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //得到标志参数(用用于判断执行,哪个sql语句)
        String biaozhi="0";
        biaozhi=req.getParameter("c");
        if (biaozhi==null)
            biaozhi="0";
        String sql=userServic.FindSql(biaozhi);
        List<Entity> list=foodService.findFood(sql);
        req.setAttribute("list",list);
        req.getRequestDispatcher("/u1/showFood2.jsp").forward(req,resp);
    }
}
✨解析

        用于处理HTTP请求并与后端服务进行交互:

  1. 包和导入:

    • package com.dingcan.controller;: 声明了这个类属于com.dingcan.controller包。
    • 导入了一些必要的类,包括cn.hutool.db.Entity用于数据库操作,com.dingcan.service.*相关的服务类。
  2. @WebServlet注解:

    • @WebServlet(name = "UshowFoodServlet", value = "/ushowFoodServlet"): 这个注解用于注册这个Servlet,定义了它的名称和URL映射。当访问/ushowFoodServlet路径时,这个Servlet会被调用。
  3. 类定义:

    • public class UshowFoodServlet extends HttpServlet: 定义了一个名为UshowFoodServlet的类,它继承自HttpServlet
  4. 成员变量:

    • FoodService foodService = new FoodServiceImpl();: 创建了FoodService接口的实现类FoodServiceImpl的实例。
    • UserService userServic = new UserServiceImpl();: 创建了UserService接口的实现类UserServiceImpl的实例。
  5. service方法:

    • @Override: 表示重写了父类的方法。
    • protected void service(HttpServletRequest req, HttpServletResponse resp): 这是Servlet的service方法,用于处理客户端的请求。
    • String biaozhi = "0";: 定义了一个字符串变量biaozhi并初始化为"0",用作标志参数。
    • biaozhi = req.getParameter("c");: 从请求中获取名为c的参数,如果请求中没有这个参数,biaozhi将保持默认值"0"
  6. 获取SQL语句:

    • String sql = userServic.FindSql(biaozhi);: 使用UserServiceFindSql方法,根据biaozhi的值获取相应的SQL语句。
  7. 查询数据:

    • List<Entity> list = foodService.findFood(sql);: 使用FoodServicefindFood方法执行SQL查询,并将结果存储在list中。
  8. 设置请求属性:

    • req.setAttribute("list", list);: 将查询结果list设置为请求属性,这样就可以在JSP页面中通过$ {list}访问这些数据。
  9. 请求转发:

    • req.getRequestDispatcher("/u1/showFood2.jsp").forward(req, resp);: 将请求转发到/u1/showFood2.jsp页面,同时携带了请求属性。
  10. 异常处理:

    • 方法声明中包含了throws ServletException, IOException,表示这个方法可能会抛出ServletExceptionIOException异常,这些异常通常与HTTP请求和响应的处理有关。

        总结来说,这个Servlet的作用是根据请求中的参数获取相应的SQL语句,执行数据库查询,并将查询结果转发到JSP页面进行展示。这种模式是MVC(Model-View-Controller)架构中控制器层的典型应用。

🎈前端展示showFood2.jsp部分

✨代码
<%--
  Created by IntelliJ IDEA.
  User: Lenovo
  Date: 20/6/2024
  Time: 下午3:40
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>展示用户登入的信息</title>
    <!-- 引入 Bootstrap -->
    <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link href="css/uShow.css" rel="stylesheet">
</head>
<body>
<div class="first">
    <div class="one">
        <div class="two">
            <img src="image/four.jpg" alt="LOGO">
            <label>优质外卖订餐系统</label>
        </div>
        <div class="three">
            <a href="exitServlet" class="btn">注销</a>
        </div>
    </div>
    <div class="btn-group-vertical">
        <ul class="menuOne">
            <li>
                <a href="ushowFoodServlet?c=1" class="btn btn" role="button">老王火锅店</a>
                <ul class="menuTwo">
                    <li><a href="ushowFoodServlet?c=2" class="btn" role="button">肉类</a></li>
                    <li><a href="ushowFoodServlet?c=3" class="btn" role="button">菜类</a></li>
                    <li><a href="ushowFoodServlet?c=4" class="btn" role="button">其他</a></li>
                </ul>
            </li>
            <li>
                <a href="ushowFoodServlet?c=5" class="btn" role="button">精品零食店</a>
                <ul class="menuTwo">
                    <li><a href="ushowFoodServlet?c=6" class="btn" role="button">辣食</a></li>
                    <li><a href="ushowFoodServlet?c=7" class="btn" role="button">甜食</a></li>
                    <li><a href="ushowFoodServlet?c=8" class="btn" role="button">其他</a></li>
                </ul>
            </li>
            <li>
                <a href="ushowCarServlet" class="btn" role="button">我的购物车</a>
                <ul class="menuTwo">
                </ul>
            </li>
        </ul>
    </div>
    <div class="four">
        <table  class="table table-striped table-bordered table-condensed">
            <thead>
            <tr  class="warning">
                <td>餐品名称</td>
                <td>价格</td>
                <td>操作</td>
            </tr>
            </thead>
            <tbody>
            <c:forEach items="${list}" var="food">
                <tr  class="danger">
                    <td>${food.fname}</td>
                    <td>${food.fprice}</td>
                    <td>
                        <a href="addCarServlet?fid=${food.fid}&fname=${food.fname}&fdianid=${food.fdianid}&fprice=${food.fprice}" class="btn btn-primary">购买</a>
                    </td>
                </tr>
            </c:forEach>
            </tbody>
        </table>
    </div>
</div>
<script src="js/ucaidan.js"></script>
</body>
</html>
✨解析

        这段代码是一个JSP页面,用于展示用户登录后的信息,并通过层级菜单和表格显示餐品数据。以下是对代码的详细解析:

  1. JSP注释:

    • 页面顶部的注释是IntelliJ IDEA自动生成的,提供了创建者、日期和时间信息。
  2. 页面指令:

    • <%@ page contentType="text/html;charset=UTF-8" language="java" %>: 设置页面的MIME类型为HTML,字符集为UTF-8,脚本语言为Java。
    • <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>: 引入JSTL核心标签库,使用c作为前缀。
  3. HTML结构:

    • <html>: 页面的根元素。
    • <head>: 包含页面的元数据,如标题和样式表链接。
    • <title>: 设置页面标题为“展示用户登入的信息”。
    • <link>: 引入Bootstrap的CSS文件和自定义的CSS文件uShow.css
  4. 页面内容:

    • <div class="first">: 包含整个页面的主要内容。
    • <div class="one">: 包含LOGO和系统名称。
    • <div class="two">: 包含LOGO图片和系统名称标签。
    • <div class="three">: 包含注销按钮,链接到exitServlet
  5. 导航菜单:

    • <div class="btn-group-vertical">: 垂直排列的按钮组,包含不同商家和分类的链接。
    • <ul class="menuOne"> 和 <ul class="menuTwo">: 使用列表来创建层级菜单结构。
  6. 层级菜单:

    • 主菜单项链接到ushowFoodServlet,根据不同的参数c显示不同商家的餐品。
    • 子菜单项进一步细分了餐品种类。
  7. 表格展示:

    • <table>: 使用Bootstrap样式的表格,展示用户的餐品信息。
    • <thead>: 表格的头部,包含列标题:餐品名称、价格和操作。
    • <tbody>: 表格的主体,使用JSTL的<c:forEach>标签循环遍历list集合。
  8. JSTL标签:

    • <c:forEach items="${list}" var="food">: 用于遍历作为请求属性传递到页面的list集合。
  9. 表格行:

    • <tr>: 表格的一行,用于显示单个餐品的信息。
    • <td>: 表格单元格,显示餐品的名称(food.fname)和价格(food.fprice)。
  10. 购买操作:

    • <a href="addCarServlet?...": 在操作列中,创建一个链接到addCarServlet的按钮,用于将选中的餐品添加到购物车。链接包含了餐品的ID、名称、商家ID和价格作为查询参数。
  11. 页面底部:

    • <script src="js/ucaidan.js"></script>: 引入JavaScript文件,可能用于页面的动态交互或效果。
  12. Bootstrap类:

    • 页面使用了多个Bootstrap类(如btnbtn-primarytable-stripedtable-borderedtable-condensedwarningdanger)来增强页面的样式和响应性。

        这个JSP页面是一个用户登录后的管理系统界面,可以展示不同商家的餐品信息,并提供购买功能。页面通过使用JSTL标签动态展示后端传递的数据,并通过Bootstrap框架增强了用户界面的友好性和交互性。

✨效果

 🎯用户注册部分

😎前端页面signUer.jsp部分

🎈代码

<%--
  Created by IntelliJ IDEA.
  User: Lenovo
  Date: 21/6/2024
  Time: 下午1:43
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%-- 引入Bootstrap --%>
<link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<html>
<head>
    <title>用户注册界面</title>
    <link href="../css/sign.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="../js/sign.js"></script>
</head>
<body>
<form name="registerForm" action="${pageContext.request.contextPath}/signUserServlet" onsubmit="return validateForm()">
    <div class="one">
        <div class="first">优选外卖订餐系统</div>
        <div class="form-group">
            <label class="col-sm-5 control-label">账户名:</label>
            <div class="col-sm-12">
                <input class="form-control" type="text" name="username" placeholder="请输入账户名">
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-5 control-label">密码:</label>
            <div class="col-sm-12">
                <input class="form-control" type="password" name="password1" placeholder="请输入密码">
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-5 control-label">重复密码:</label>
            <div class="col-sm-12">
                <input class="form-control" type="password" name="password2" placeholder="请再次输入密码">
            </div>
        </div>
        <div class="left">
            <button type="submit" class="btn btn-success btn-lg">注册</button>
        </div>
        <div class="right">
            <button type="reset" class="btn btn-danger btn-lg">重置</button>
        </div>
    </div>
</form>
</body>
</html>

🎈解析

        这段代码是一个使用HTML和Bootstrap框架构建的用户注册界面的JSP页面。以下是对代码的详细解析:

  1. JSP注释:

    • 页面顶部的注释由IntelliJ IDEA自动生成,提供了创建者、日期和时间。
  2. 页面指令:

    • <%@ page contentType="text/html;charset=UTF-8" language="java" %>: 设置页面的MIME类型为HTML,字符集为UTF-8,脚本语言为Java。
  3. Bootstrap链接:

    • <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">: 引入Bootstrap的CSS文件,用于页面样式。
  4. HTML结构:

    • <html>: 根元素。
    • <head>: 包含页面的元数据,如标题和样式链接。
    • <title>: 设置页面标题为“用户注册界面”。
    • <link href="../css/sign.css" rel="stylesheet" type="text/css">: 引入自定义的CSS样式文件。
  5. JavaScript脚本:

    • <script type="text/javascript" src="../js/sign.js"></script>: 引入自定义的JavaScript脚本文件,可能包含表单验证逻辑。
  6. 表单:

    • <form name="registerForm" action="${pageContext.request.contextPath}/signUserServlet" onsubmit="return validateForm()">: 创建一个表单,用于提交用户注册信息。
      • action属性设置表单提交的URL,使用了JSP表达式${pageContext.request.contextPath}来动态设置上下文路径。
      • onsubmit="return validateForm()": 提交表单前调用validateForm JavaScript函数进行验证。
  7. 表单控件:

    • 使用divform-group类创建表单控件的布局。
    • <label>: 表示表单控件的说明文字。
    • <input>: 创建输入字段,用于输入账户名、密码和重复密码。type="text"type="password"分别用于文本输入和密码输入。
  8. 按钮:

    • <button type="submit" class="btn btn-success btn-lg">注册</button>: 创建提交按钮,使用Bootstrap的按钮样式。
    • <button type="reset" class="btn btn-danger btn-lg">重置</button>: 创建重置按钮,用于清空表单输入。
  9. Bootstrap类:

    • 页面使用了Bootstrap的类(如form-groupcol-sm-5col-sm-12control-labelform-controlbtnbtn-successbtn-lgbtn-danger)来增强表单的布局和样式。
  10. 表单验证:

    • 表单的onsubmit事件调用了validateForm函数,这可能是在sign.js脚本中定义的,用于在提交表单前进行前端验证。

        这个JSP页面提供了一个用户注册的表单,包括账户名和密码的输入,并通过Bootstrap框架增强了用户界面的友好性和响应性。表单提交时会进行前端验证,并最终发送到后端的signUserServlet进行处理。

🎈效果  

😎后端处理SignUserServlet部分

🎈代码

package com.dingcan.controller;
import com.dingcan.service.Impl.UserServiceImpl;
import com.dingcan.service.UserService;

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 java.io.IOException;

@WebServlet(name = "SignUserServlet", value = "/signUserServlet")
public class SignUserServlet extends HttpServlet {
    UserService userService =new UserServiceImpl();
    @Override
    protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String uname = req.getParameter("username");
        String password = req.getParameter("password1");
        if (userService.addUser(uname,password)) {
            req.setAttribute("msg", "注册成功,请登入");
            req.getRequestDispatcher("login.jsp").forward(req, resp);
        }
        else
            resp.sendRedirect("fail.jsp");
    }
}

🎈解析

        这段Java代码是一个Servlet控制器,用于处理用户注册的请求。以下是对代码的详细解析:

  1. 包声明:

    • package com.dingcan.controller;: 声明了这个类属于com.dingcan.controller包。
  2. 导入:

    • 导入了相关的类,包括com.dingcan.service.Impl.UserServiceImplcom.dingcan.service.UserService
  3. @WebServlet注解:

    • @WebServlet(name = "SignUserServlet", value = "/signUserServlet"): 注解用于注册Servlet,定义了它的名称和URL映射。当访问/signUserServlet路径时,这个Servlet会被调用。
  4. 类定义:

    • public class SignUserServlet extends HttpServlet: 定义了一个名为SignUserServlet的类,它继承自HttpServlet
  5. 成员变量:

    • UserService userService = new UserServiceImpl();: 创建了UserService接口的实现类UserServiceImpl的实例。
  6. service方法:

    • @Override: 表示重写了父类的方法。
    • protected void service(HttpServletRequest req, HttpServletResponse resp): 这是Servlet的service方法,用于处理客户端的请求。
  7. 获取请求参数:

    • String uname = req.getParameter("username");: 从请求中获取username参数。
    • String password = req.getParameter("password1");: 从请求中获取password1参数。
  8. 注册用户:

    • if (userService.addUser(uname, password)): 使用userServiceaddUser方法尝试添加用户。如果用户添加成功,返回true
  9. 请求转发:

    • req.setAttribute("msg", "注册成功,请登入");: 设置一个消息属性,提示用户注册成功。
    • req.getRequestDispatcher("login.jsp").forward(req, resp);: 将请求转发到login.jsp页面,携带请求属性。
  10. 重定向:

    • else resp.sendRedirect("fail.jsp");: 如果用户添加失败(例如,用户名已存在),则重定向到fail.jsp页面。
  11. 异常处理:

    • 方法声明中包含了throws ServletException, IOException,表示这个方法可能会抛出ServletExceptionIOException异常。

        总结来说,这个SignUserServlet的作用是接收用户提交的注册信息,通过UserService的实现类UserServiceImpl添加用户,根据添加结果决定是转发到登录页面还是重定向到失败页面。这种模式是MVC(Model-View-Controller)架构中控制器层的典型应用。

🎯注销部分

😎前端页面展示

🎈代码

<div class="first">
    <div class="one">
        <div class="two">
            <img src="image/four.jpg" alt="LOGO">
            <label>优质外卖订餐系统</label>
        </div>
        <div class="three">
            <a href="exitServlet" class="btn">注销</a>
        </div>
    </div>

🎈解析

        这段HTML代码是页面布局的一部分,通常位于页面的顶部,作为导航栏或页眉。它使用了CSS类来控制布局和样式:

  1. <div class="first">: 这是最外层的div元素,它可能被用来作为整个头部或导航区域的容器。

  2. <div class="one">: 这个div元素可能是用来进一步组织内容,例如将LOGO和导航链接组合在一起。

  3. <div class="two">: 这个div元素包含了LOGO图片和系统名称,可能是页面的标识部分。

    • <img src="image/four.jpg" alt="LOGO">: 这是LOGO图片,使用src属性指定图片路径,alt属性提供了图片的替代文本。
    • <label>优质外卖订餐系统</label>: 这是一个文本标签,显示了系统名称。
  4. <div class="three">: 这个div元素包含一个注销链接,可能位于页面的右侧,提供给用户退出登录的功能。

    • <a href="exitServlet" class="btn">注销</a>: 这是一个超链接,当用户点击时,会向exitServlet发送请求,执行注销操作。class="btn"可能是在CSS中定义的,用来给按钮添加样式。
  5. CSS类:

    • .first.one.two.three: 这些类名在CSS文件中定义,用来控制这些div元素的布局、样式和行为。例如,它们可能控制元素的宽度、高度、背景颜色、边框、内边距、外边距等。
  6. 导航链接:

    • 这个部分的代码可能用于实现用户注销功能。在实际应用中,注销链接通常会在用户登录后才显示,或者根据用户的角色和权限动态显示。
  7. 图片和文本的组合:

    • LOGO图片和系统名称的组合是网站设计中的常见元素,用于增强品牌识别度和提供直观的导航提示。
  8. 响应式设计:

    • 由于使用了Bootstrap框架(从引入的Bootstrap CSS可以推断),这些元素很可能被设计为响应式,以适应不同设备的屏幕尺寸。

🎈效果

 😎后端处理ExitServlet部分

🎈代码

package com.dingcan.controller;

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 java.io.IOException;
@WebServlet(name = "ExitServlet", value = "/exitServlet")
public class ExitServlet extends HttpServlet {
    @Override
    protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        req.getSession().setAttribute("uid1",null);
        req.getSession().setAttribute("identity",null);
        req.getSession().setAttribute("sid1",null);
        resp.sendRedirect("login.jsp");
    }
}

🎈解析

        这段Java代码定义了一个名为ExitServlet的Servlet类,它继承自HttpServlet。这个Servlet用于处理用户注销(退出登录)的请求:

  1. 包声明:

    • package com.dingcan.controller;: 声明了这个类属于com.dingcan.controller包。
  2. @WebServlet注解:

    • @WebServlet(name = "ExitServlet", value = "/exitServlet"): 这个注解用于注册Servlet,定义了它的名称和URL映射。当用户访问/exitServlet路径时,这个Servlet会被调用。
  3. 类定义:

    • public class ExitServlet extends HttpServlet: 定义了一个名为ExitServlet的类,它继承自HttpServlet
  4. service方法:

    • @Override: 表示重写了父类HttpServletservice方法。
    • protected void service(HttpServletRequest req, HttpServletResponse resp): 这是Servlet的service方法,用于处理客户端的请求。
  5. 注销逻辑:

    • req.getSession().setAttribute("uid1", null);: 从会话中移除属性uid1,这通常用于清除用户的ID信息。
    • req.getSession().setAttribute("identity", null);: 从会话中移除属性identity,这可能用于清除用户的身份或角色信息。
    • req.getSession().setAttribute("sid1", null);: 从会话中移除属性sid1,这可能用于清除与用户会话相关的其他信息。
  6. 重定向:

    • resp.sendRedirect("login.jsp");: 执行注销操作后,使用HttpServletResponsesendRedirect方法重定向到login.jsp页面。这将导致浏览器接收到一个重定向响应,并将用户导航到登录页面。
  7. 异常处理:

    • 方法声明中包含了throws ServletException, IOException,表示这个方法可能会抛出ServletExceptionIOException异常,这些异常通常与HTTP请求和响应的处理有关。

    ExitServlet的主要作用是在用户点击注销链接时清除会话中的用户信息,并将用户重定向到登录页面,从而完成注销过程。这是一种常见的Web应用程序安全实践,用于确保用户在注销后不再保持登录状态。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1956844.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

什么是内网ip地址?如何查询电脑内网ip地址

在数字化时代&#xff0c;互联网已经成为我们日常生活和工作中不可或缺的一部分。无论是家庭网络还是企业办公环境&#xff0c;每台接入网络的设备都需要一个独特的标识来区分彼此&#xff0c;这个标识就是IP地址。IP地址全称为“互联网协议地址”&#xff0c;是设备在网络中的…

springboot整合junit-用于测试用例

package impl;public interface BookDao {public void save(); }第一步&#xff1a;打开软件&#xff0c;点击file&#xff0c;点击new 然后选择module&#xff0c;在右侧选择springboot 第二步&#xff1a;选择配置和JDK以及java版本 ①选择maven类型 ②选择JDK1.8版本 ③选…

react中路由懒加载

// 1.引入方法&#xff0c;用于创建路由实例 // createBrowserRouter是用于创建history模式 // createHashRouter是用于创建hash模式 // 路由模式的切换只需要更改创建路由实例的方法就行了&#xff0c;其他地方不需要更改 import { createBrowserRouter,createHashRouter } fr…

deployment

一.deployment rc和rs控制器都是控制pod的副本数量的&#xff0c;但是&#xff0c;他们两个有个缺点&#xff0c;就是在部署新版本pod或者回滚代码的时候&#xff0c;需要先apply资源清单&#xff0c;然后再删除现有pod&#xff0c;通过资源控制&#xff0c;重新拉取新的pod来实…

【Vue3复习】Vite创建项目报错解决

报错&#xff1a; Cannot find package ‘vite’ 出错原因分析 使用命令npm create vuelatest创建项目时&#xff0c;没有按顺序执行以下提示命令 解决 依序执行这三条指令 注意 如果没有执行 npm install 这条指令&#xff0c;直接用VS Code打开项目时&#xff0c;env.d.…

职场英语培训柯桥成人学外语|邮件里别乱用“Dear”,老外才不会这么写!

写邮件是职场上的必修课&#xff0c;而一封好的英语邮件应当从适合的称呼开始。 说到称呼&#xff0c;你的脑子里是不是冒出了一个单词“Dear” 从小我们就被教育写英语作文时&#xff0c;开头先来个Dear&#xff0c;结尾写个Sincerely&#xff0c;简直不要太顺手~ 然&#xff…

HDU1071——The area,HDU1072——Nightmare,HDU1073——Online Judge

目录 HDU1071——The area 题目描述 运行代码 代码思路 HDU1072——Nightmare 题目描述 运行代码 代码思路 HDU1073——Online Judge 题目描述 运行代码 代码思路 HDU1071——The area 题目描述 Problem - 1071 运行代码 #include <iostream> #include &…

CloudWeGo新手教程视频:手把手教你从0到1打造电商商城微服务demo

概要 Gomall 电商项目视频教程&#xff0c;由 CloudWeGo 技术社区出品&#xff0c;旨在帮助开发者掌握 Go 语言项目开发和微服务架构。教程通过演示 CloudWeGo 项目中的 Kitex 和 Hertz 框架&#xff0c;引导 Go 初学者学习常见的技术和开源中间件。 观看教程请访问&#xff…

高效灵活 | 前端利器 Vue.js 是一个构建用户界面的渐进式框架。

Vue.js 是一个构建用户界面的渐进式框架。 官网&#xff1a;https://cn.vuejs.org/ 基本特性 数据驱动&#xff1a;通过响应式机制&#xff0c;实现数据的变化自动触发视图的更新。 组件化架构&#xff1a;高度可复用的组件结构&#xff0c;提升代码组织性和可维护性。 虚拟…

爬虫-实战爬取虎扑ACG帖子

要求如下: 爬取虎扑步行街 ACG 版面的数据,要求使用多线程来并发爬取。范围是第一页的所有帖子,每个帖子包含标题、主题内容和第一页的所有回复内容。最后打印出爬到的所有帖子的标题。 网址是:ACG圈 - 虎扑社区。 针对上面的要求,我们进行分析: 首先是要使用多线程范…

YOLO5项目目录最强解析

YOLO5项目目录解析 YOLOv5 项目目录下的文件和目录的结构&#xff0c;以下是对每个目录和文件的解释&#xff1a; 目录 &#x1f4c1; .github: 存放 GitHub 相关配置和文件&#xff0c;如 GitHub Actions 工作流文件、Issue 模板等&#xff0c;用于自动化构建和持续集成等功…

Java编写SIP协议

1、编写Server代码 package com.genersoft.iot.vmp.sip; import javax.sip.*; import javax.sip.message.*; import javax.sip.header.*; import java.util.*;public class SimpleSipServer implements SipListener {private SipFactory sipFactory;private SipStack sipStack…

神经网络的参数初始化【PyTorch】

文章目录 1、常见初始化方法2、代码2.1、导包&#xff1a;2.2、均匀分布随机初始化2.3、固定初始化2.4、全0初始化2.5、全1初始化2.6、正态分布随机初始化2.7、kaiming 初始化2.8、xavier 初始化2.9、完整代码 3、小节 &#x1f343;作者介绍&#xff1a;双非本科大三网络工程专…

哨兵Sentinel-2一些有趣的示例

每天我们都会观察周围的世界。在许多情况下&#xff0c;我们认为我们所看到的事物是不言而喻的&#xff0c;它们只是我们所认为的那样。其他时候&#xff0c;我们会更仔细地分析和询问那些看起来不太熟悉的事物。有时&#xff0c;仅仅改变我们的视觉视角就能提供额外的启发和启…

html实现我的博客文章相册源码

文章目录 1.设计来源1.1 相册界面1.2 相册详细界面1.3 文章界面1.4 文章详细界面1.5 关于我1.6 联系我 2.效果和源码2.1 动态效果2.2 源代码 源码下载万套模板&#xff0c;程序开发&#xff0c;在线开发&#xff0c;在线沟通 作者&#xff1a;xcLeigh 文章地址&#xff1a;http…

轻松上手MYSQL:JSON函数实现高效数据查询与操作

&#x1f308; 个人主页&#xff1a;danci_ &#x1f525; 系列专栏&#xff1a;《设计模式》《MYSQL》 &#x1f4aa;&#x1f3fb; 制定明确可量化的目标&#xff0c;坚持默默的做事。 ✨欢迎加入探索MYSQL字符串函数之旅✨ &#x1f44b; 大家好&#xff01;文本学习和探…

「ETL趋势」定时任务自动化导出Excel/CSV,高效归档业务明细数据

目录 一、Excel/CSV文件输出应用场景 二、Excel/CSV文件输出的常见问题 三、合同订单数据文件输出实战 1&#xff09;合同订单数据输出为 CSV 文件 1、建立业务系统数据库、FTP/SFTP 服务器数据连接 2、数据处理 3、输出为文件 4、运行效果查看 2&#xff09;合同订单数据输出为…

数据结构第七讲:栈和队列OJ题

数据结构第七讲&#xff1a;栈和队列OJ题 1.有效的括号2.用队列实现栈3.用栈实现队列4.设计循环队列 1.有效的括号 链接: OJ题目链接 typedef char StackDataType;typedef struct Stack {StackDataType* arr;//使用一个指针来指向开辟的数组int capacity;//保存数组的空间大…

concrt140.dll丢失是什么情况?有效的解决dll!

concrt140.dll文件丢失是电脑中少见的文件&#xff0c;但也会因为某些原因会导致电脑丢失concrt140.dll文件&#xff0c;那么出现这文件的原因是什么呢&#xff1f;出现这样的问题有什么办法可以将concrt140.dll修复呢&#xff1f;一起来看看吧。 为什么会缺失concrt140.dll文件…

前端:数字世界的门面与灵魂

在当今数字化时代&#xff0c;前端作为用户与网站或应用直接交互的界面&#xff0c;其重要性不言而喻。它不仅是信息的展示窗口&#xff0c;更是用户体验&#xff08;UX&#xff09;和用户界面&#xff08;UI&#xff09;设计的核心。本文将深入剖析前端在整体网站或应用中的重…