一文读懂页面跳转的两种方式转发与重定向,以及实现登录退出页面,还学不会你打我!!!

一文读懂页面跳转的两种方式转发与重定向,以及实现登录退出页面,还学不会你打我!!!

我们知道实现页面跳转的方式有两种,转发和重定向,那么这两者之间有什么关系,我们在本文将讨论这两者的区别

jsp

(login.jsp)登录页面:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>login</title>
</head>
      <form action="login" method="post">
        用户名:<input name="username">
        <br/>&nbsp;&nbsp;<input name="password">
        <br/>
         <button type="submit">提交</button>
      </form>
     <span style="color:red">${msg }</span>

</body>
</html>

(hello.jsp)欢迎页面

<%--
  Created by IntelliJ IDEA.
  User: Lenovo
  Date: 2024/3/23
  Time: 0:26
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>hello</title>
</head>
<body>
hello!!!${msg}<br>
<form action="loginOut" method="post">
    <button type="submit">退出登录</button>
</form>
</body>
</html>

这上面的是最基本的html的内容,重点说一下表单的action属性

这个属性定义了发送数据要去的位置。可以填绝对路径相对路径它的值必须是一个有效的 URL。如果没有提供此属性,则数据将被发送到包含这个表单的页面的 URL。,不建议填绝对地址

这上面我们填的是login这个意味着我们将要把消息发送到这个表单的login路径下,我们数据的提交选择的是post

在这里插入图片描述

当前我们是在localhost:8080的test的login.jsp文件上

我们点击提交看一下

下面的请求地址也的确是/login路径下

在这里插入图片描述

在这里插入图片描述

如果我们把路径改成/login会发生什么

在这里插入图片描述

什么???

在这里插入图片描述 在这里插入图片描述

别急我们先看看,它的请求地址,发现到了根目录下的/login 这个我们填路径的时候需要特别注意

在这里插入图片描述

我们前面已经写好了登录界面,知道了消息需要发去哪里,消息发送了之后,我们需要的是接受和处理

web.xml

在web.xml文件中注册

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
    <welcome-file-list>
        <welcome-file>index.html</welcome-file>
        <welcome-file>index.jsp</welcome-file>
    </welcome-file-list>
    <!--login servlet  -->
    <servlet>
        <servlet-name>login</servlet-name>
        <servlet-class>jun.servlets.LoginServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>login</servlet-name>
        <url-pattern>/login</url-pattern>
    </servlet-mapping>
    <!--login servlet end -->

    <!--loginOut servlet start -->
    <servlet>
        <servlet-name>loginOut</servlet-name>
        <servlet-class>jun.servlets.LoginOutServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>loginOut</servlet-name>
        <url-pattern>/loginOut</url-pattern>
    </servlet-mapping>
    <!-- loginOut servlet end -->
</web-app>

我们在web.xml中注册servlet

这其中的servlet里面的servlet-name是我们为servlet定义的名字,要与servlet-mapping里面的servlet-name对应

servlet-class是我们指定的servlet类的地址

而url-pattern则是我们的请求路径

servlet

在LoginServlet文件 实现dopost方法

转发

package jun.servlets;


import jun.entitys.User;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
public class LoginServlet extends HttpServlet {
    @Override
    public void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException, ServletException {
        User user = new User();
        user.setUsername(req.getParameter("username"));
        user.setPassword(req.getParameter("password"));
        // request.getParameter表示接收参数,参数为页面提交的参数,包括:表单提交的参数、URL重写(就是xxx?id=1中的id)传的参数等,因此这个并没有设置参数的方法(没有setParameter),
        // 而且接收参数返回的不是Object,而是String类型。

        if ("zhangsan".equals(user.getUsername()) && "123456".equals(user.getPassword())) {
//请求转发

            req.setAttribute("msg", user.getUsername());// 这里面setAttribute是用于在请求对象中存储键值对数据,值一般为String或Object类型
            req.getRequestDispatcher("hello.jsp").forward(req, resp);// 我们将数据转发到index.jsp页面,这样我们后面在页面就可以使用el表达式获取数据
            return;
            // 因为转发(重定向)之后代码仍然会继续执行,所以我们使用return来结束

        } else {// 密码输入错误,仍然跳转login页面
            req.setAttribute("msg", "用户名或者密码错误!");
            req.getRequestDispatcher("login.jsp").forward(req, resp);
        }
    }
}

LoginOutServlet

package jun.servlets;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;
public class LoginOutServlet extends HttpServlet {
    @Override
    protected void service(HttpServletRequest req, HttpServletResponse resp) throws IOException,  ServletException {
        // 获取Session
        HttpSession session = req.getSession();
        // 清除Session
        session.invalidate();
        req.getRequestDispatcher("login.jsp").forward(req, resp);
    }
}

效果展示

登录界面

在这里插入图片描述

登录密码错误

在这里插入图片描述

登录成功

这里我们注意一下地址栏,我们在后面会重点标出
第一次成功登录页面
在这里插入图片描述

退出后进入重新登录页面

在这里插入图片描述

重定向

重定向我们需要修改LoginServlet页面

package jun.servlets;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;
import jun.entitys.User;

import java.io.IOException;
public class LoginServlet extends HttpServlet {
    @Override
    public void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        User user = new User();
        user.setUsername(req.getParameter("username"));
        user.setPassword(req.getParameter("password"));
        // request.getParameter表示接收参数,参数为页面提交的参数,包括:表单提交的参数、URL重写(就是xxx?id=1中的id)传的参数等,因此这个并没有设置参数的方法(没有setParameter),
        // 而且接收参数返回的不是Object,而是String类型。
        HttpSession session = req.getSession();
        if ("zhangsan".equals(user.getUsername()) && "123456".equals(user.getPassword())) {
//请求转发

            session.setAttribute("msg", user.getUsername());// 这里面setAttribute是用于在请求对象中存储键值对数据,值一般为String或Object类型
            resp.sendRedirect("hello.jsp");//重定向
            return;
            // 因为转发(重定向)之后代码仍然会继续执行,所以我们使用return来结束

        } else {// 密码输入错误,仍然跳转login页面
            req.setAttribute("msg", "用户名或者密码错误!");
            resp.sendRedirect("login.jsp");//重定向
        }
    }
}

LoginOutServlet

package jun.servlets;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;
public class LoginOutServlet extends HttpServlet {
    @Override
    protected void service(HttpServletRequest req, HttpServletResponse resp) throws IOException,  ServletException {
        // 获取Session
        HttpSession session = req.getSession();
        // 清除Session
        session.invalidate();
        //重定向
        resp.sendRedirect("login.jsp");
    }
}

运行结果

登录界面

在这里插入图片描述

登录成功界面,这里我们注意一下这边的地址栏,发现上面第一次成功登录界面的地址是login
而这边的是hello.jsp

在这里插入图片描述
退出登录:

在这里插入图片描述

转发和重定向已经演示完毕,转发只涉及一次请求的转发,而重定向涉及两次请求的转发

我们使用转发时,我们获取到结果时,浏览器地址栏仍然是我们发送请求的位置,没有发生改变,

而使用重定向时,浏览器的地址栏就会发生改变

什么意思,这个怎么这么难理解…
在这里插入图片描述

在这里插入图片描述

以图说话

我们开始输入密码登录

在这里插入图片描述

登录之后:

在这里插入图片描述

现在我们来看看重定向的

输入密码登录

在这里插入图片描述

此时请求路径和浏览当前路径,这里我们注意下,我们这里不仅有login文件,还有hello文件,我们点击看看

在这里插入图片描述

可以看到这又是一次请求,这是不是可以证明浏览器请求了两次啊

在这里插入图片描述

在这里插入图片描述

你: 不是,为什么会设置重定向和转发两个方式,这个还要请求两次,搞那么麻烦干什么…

在这里插入图片描述

我: 我我我,你小子绝对是来捣乱的,叉出去,叉出去…

在这里插入图片描述

你先别急等我给你说个事情

张三和李四是好朋友,张三找李四借100块钱,想给暗恋已久的女生买一束花,李四二话不说就答应了,这张三的请求路径是李四,也从李四那边得到了钱,是不是只发了一次请求,是不是路径没有变,

又过了两天,女神对张三说想要一只口红,但是要2000块钱,张三又去找到了李四,李四想这小子,自己饭都吃不起了,还想着给女生买口红,

在这里插入图片描述

李四手中也没有这么多钱,就说你去找王五借钱吧,王五在隔壁,最终,张三找王五借到了钱买了

注意看,这里张三首先向李四借钱,然后李四没有这么多钱,让他去找王五,只是告诉了王五位置,李四顺着位置找王五借到了钱,这个就是重定向,是不是请求了两次,是不是浏览器(张三)请求路径变了

在这里插入图片描述

听军一席话,胜读十年书啊!!!

我可是在角落看着你的啊

在这里插入图片描述

速速点赞

  • 29
    点赞
  • 17
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值