jsp技术：day2--jsp的几个容器、myAjax（隐藏帧技术）底层原理、jsp的三代开发技术

心已赠人 2022-09-24 11:19 82阅读 0赞

# JSP的几个容器 #

## 容器从小到大： ##

pageContext–>request–>session–>application  
这里我们要重点介绍这个pageContext，因为pageContext容器我们没遇到过。  
通过pageContext可以很方便的操纵其他容器，如下面代码

pageContext.setAttribute("name", "pageContext-name", PageContext.PAGE_SCOPE);
                pageContext.setAttribute("name", "request-name", PageContext.REQUEST_SCOPE);
                pageContext.setAttribute("name", "session-name", PageContext.SESSION_SCOPE);
                pageContext.setAttribute("name", "application-name", PageContext.APPLICATION_SCOPE);

他等价于：

//从小到大的四个容器
                pageContext.setAttribute("name", "pageContext-name");
                request.setAttribute("name", "request-name");
                session.setAttribute("name", "session-name");
                application.setAttribute("name", "application-name");

--------------------

out.print(pageContext.getAttribute("name", PageContext.PAGE_SCOPE)+"<br/>");
                out.print(pageContext.getAttribute("name", PageContext.REQUEST_SCOPE)+"<br/>");
                out.print(pageContext.getAttribute("name", PageContext.SESSION_SCOPE)+"<br/>");
                out.print(pageContext.getAttribute("name", PageContext.APPLICATION_SCOPE)+"<br/>");

等价于下面的代码：

out.print(pageContext.getAttribute("name")+"<br/>");
                out.print(request.getAttribute("name")+"<br/>");
                out.print(session.getAttribute("name")+"<br/>");
                out.print(application.getAttribute("name")+"<br/>");

## pageContext.findAttribute()方法 ##

这个方法会依次（从小到大的容器）  
pageContext->request->session->application  
去找对应的属性，找到一个后面就不会再找了

# myAjax（隐藏帧技术）—定点通讯 #

## 图示myAjax（隐藏帧技术）： ##

![这里写图片描述][20160729153251847]

## 知识点： ##

1、用iframe做一个画中画，将其style设为`style="display: none"`，`name="dateFrame"`  
2、在所提交的表单A中，我们做一个编辑框的onblur事件，用js技术做失去焦点的时候将里面的值放到我们下面做的一个表单中。

3、在另一个表单B中，我们要设一个属性即 `target="dateFrame"` 这样，我们这个表单提交返回的就是这个画中画的页面，而不是浏览器的页面。实现了浏览器中的信息不动。如果不舍`target` 属性，默认的就是浏览器页面。  
4、在表单B中，我们写一个servlet来判断是否通过，设置一个变量error，如果通过，为0，不通过为1；转发到结果页面，而这个结果因为在表单B中设置了返回页面是iframe的`name="dateFrame"`的，所以返回的是这个画中画页面，没有动浏览器页面。

5、在表单A中，写一个`<div id="msg" style="color:red;"></div>`在用户填写的属性的后面，这样，就可以及时显示改填写的值的信息是否正确。

6、在结果页面中，我们将错误信息输出，拿到上面设置的错误信息，根据错误信息去设置父页面的div属性。当然，这里可以使用一种架构：在父页面的js中自己写一个方法，由父页面去调。这种由父页面自己调用自己的方法这种架构比较好，相当于我们在监听里写代码要将外面的变量声明成final类型，这样不好，所以我们在监听里面调用外面的一个方法，这样就不用将变量声明为final类型了，使得架构更好  
如图：  
1、全部不隐藏：  
![这里写图片描述][20160729143342654]  
2、隐藏表单B的显示：  
![这里写图片描述][20160729143455687]  
3、隐藏iframe做的子页面：  
![这里写图片描述][20160729143558197]  
至此，myAjax的底层原理就是这样。

# jsp的三代开发技术 #

## 第一代jsp开发技术：纯jsp技术开发 ##

用jsp写网页和逻辑。

## jsp技术第二代：演示JSP+EJB开发技术 ##

在pojo的基础上增加一些业务处理方法，这样就变成了企业级JavaBean。因为我们反正是在拿值对象去操作，索性将这些方法写入值对象中，这样，第二代jsp技术就出来了

## jsp技术第三代：演示JSP+Servlet+POJO开发技术 ##

分为了三层，即MVC架构思想，jsp只写html和El表达式，servlet和service操作pojo 然后去做业务逻辑，去数据层访问。这个POJO也可以称为简单的javabean  
如图所示：  
![这里写图片描述][20160729151857997]

# 本文完整代码如下： #

## index.jsp ##

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    <%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
    %>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
      </head>
    
      <body>
            <h2>演示jsp的4个容器---pageContext容器没遇到过</h2>
            <%
                //从小到大的四个容器
                //pageContext.setAttribute("name", "pageContext-name");
                //request.setAttribute("name", "request-name");
                //session.setAttribute("name", "session-name");
                //application.setAttribute("name", "application-name");
             %>
             
            <%
                //等价于上面的代码
                pageContext.setAttribute("name", "pageContext-name", PageContext.PAGE_SCOPE);
                pageContext.setAttribute("name", "request-name", PageContext.REQUEST_SCOPE);
                pageContext.setAttribute("name", "session-name", PageContext.SESSION_SCOPE);
                pageContext.setAttribute("name", "application-name", PageContext.APPLICATION_SCOPE);
             %>
             <%
                out.print(pageContext.getAttribute("name")+"<br/>");
                out.print(request.getAttribute("name")+"<br/>");
                out.print(session.getAttribute("name")+"<br/>");
                out.print(application.getAttribute("name")+"<br/>");
              %>
             <%
                //等价上面的代码
                //out.print(pageContext.getAttribute("name", PageContext.PAGE_SCOPE)+"<br/>");
                //out.print(pageContext.getAttribute("name", PageContext.REQUEST_SCOPE)+"<br/>");
                //out.print(pageContext.getAttribute("name", PageContext.SESSION_SCOPE)+"<br/>");
                //out.print(pageContext.getAttribute("name", PageContext.APPLICATION_SCOPE)+"<br/>");
              %>
              <h2>----------我是最美的分割线1111111111--------------</h2>
              
             <%
                out.print(pageContext.findAttribute("name")+"<br/>");
              %>
              <h2>----------我是最美的分割线1111111111--------------</h2>
              
              <h2>这里有一个name：${name}</h2>
              <h2>----------我是最美的分割线222222222--------------</h2>
              <h2>myAjax--演示隐藏帧技术--定点通讯</h2>
              
              <a href="jsps/reg.jsp">去注册</a>
              <br/>
              <br/>
              <br/>
              <br/>
              <h1>演示jsp的三代技术</h1>
              <br/>
              <br/>
    
              <h2>jsp技术第一代：纯jsp技术开发</h2>
              <a href="jsps/regPureJsp.jsp" >纯jsp技术做的注册</a>
              <br/>
              <br/>
              <br/>
              <h2>jsp技术第二代：演示JSP+EJB开发技术</h2>
              <%--因为我们反正是在拿值对象去操作，索性将这些方法写入值对象中，这样，第二代jsp技术就出来了 --%>
              <a href="jsps/regEjbJsp.jsp" >演示JSP+EJB开发技术做的注册</a>
    
              <br/>
              <br/>
              <h2>jsp技术第三代：演示JSP+Servlet+POJO开发技术</h2>
              <a href="jsps/regServletJsp.jsp">演示JSP+Servlet+POJO开发技术</a>         
    
              <br/>
              <br/>
              <br/>
              <br/>
              <br/>
              <br/>
              <br/>
              <br/>
              <br/>
              <br/>
      </body>
    </html>

## web.xml ##

<?xml version="1.0" encoding="UTF-8"?>
    <web-app version="3.0" 
        xmlns="http://java.sun.com/xml/ns/javaee" 
        xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
        xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
        http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd">
      <display-name></display-name>
      <servlet>
        <servlet-name>RegServlet</servlet-name>
        <servlet-class>cn.hncu.reg.servlet.RegServlet</servlet-class>
      </servlet>
      <servlet>
        <servlet-name>ValServlet</servlet-name>
        <servlet-class>cn.hncu.reg.servlet.ValServlet</servlet-class>
      </servlet>
      <servlet>
        <servlet-name>regServletPOJO</servlet-name>
        <servlet-class>cn.hncu.reg.servlet.regServletPOJO</servlet-class>
      </servlet>
    
    
    
      <servlet-mapping>
        <servlet-name>RegServlet</servlet-name>
        <url-pattern>/RegServlet</url-pattern>
      </servlet-mapping>
      <servlet-mapping>
        <servlet-name>ValServlet</servlet-name>
        <url-pattern>/ValServlet</url-pattern>
      </servlet-mapping>
      <servlet-mapping>
        <servlet-name>regServletPOJO</servlet-name>
        <url-pattern>/regServletPOJO</url-pattern>
      </servlet-mapping>    
      <welcome-file-list>
        <welcome-file>index.jsp</welcome-file>
      </welcome-file-list>
    </web-app>

## doReg.jsp ##

<%@page import="java.io.PrintWriter"%>
    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
      </head>
    
      <body>
        <h1>处理注册界面</h1>
        <%
            request.setCharacterEncoding("utf-8");
            response.setContentType("text/html;charset=utf-8");
            String name = request.getParameter("name");
            String pwd = request.getParameter("pwd");
            if(name!=null&&name.trim().length()>0&&name.startsWith("hncu")){
                //访问后台
                session.setAttribute("user", name);
                out.print("注册成功。name:"+name+",pwd:"+pwd+"<br/>");   
    
            }else{
                out.print("注册失败，用户名必须以hncu开头"); 
    
            }
    
    
         %>     
      </body>
    </html>

## doRegEjb.jsp ##

## reg.jsp ##

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <script type="text/javascript">
            function val(obj){
         
                var nm = obj.value;
                if(nm!=null&&nm!=""){
                    document.getElementById("regName").value=nm;
                    document.forms[1].submit();
                }else{
                    alert("请输入用户名");
                }
            }
            function resBack(res){
         
                if(res==1){
                    parent.document.getElementById("msg").innerHTML="用户已存在，请重新输入";
                }else{
                    parent.document.getElementById("msg").innerHTML="恭喜，注册成功";
                }
            }
    
        </script>
      </head>
    
      <body>
        <h1>注册界面</h1>
        <h2>演示myAjax---隐藏帧技术</h2>
        <form action="<%=request.getContextPath()%>/RegServlet" method="post">
            Name:<input type="text" name="name" onblur="val(this)" >
            <div id="msg" style="color:red;"></div>
            <br/>
            Passward:<input type="password" name="pwd" /><br/>
            <input type="submit" value="注册" />
        </form>
        <form target="dateFrame" action="<%=request.getContextPath()%>/ValServlet" method="post">
            
             <input type="hidden" name="name" id="regName"><br/>
        </form>
        
             <iframe name="dateFrame" style="display: none">
    
        </iframe>
      </body>
    </html>

## regEjbJsp.jsp ##

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
      </head>
    
      <body>
        <h1>注册界面</h1>
        <h2>演示第二代jsp技术做的注册界面---JSP+EJB开发</h2>
        <form action="<%=request.getContextPath()%>/jsps/doRegEjb.jsp" method="post">
            Name:<input type="text" name="name" ><br/>
            Passward:<input type="password" name="pwd" /><br/>
            <input type="submit" value="注册" />
        </form>
      </body>
    </html>

## regPureJsp.jsp ##

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
      </head>
    
      <body>
        <h1>注册界面</h1>
        <h2>演示第一代jsp技术做的注册界面---纯jsp开发</h2>
        <form action="<%=request.getContextPath()%>/jsps/doReg.jsp" method="post">
            Name:<input type="text" name="name" ><br/>
            Passward:<input type="password" name="pwd" /><br/>
            <input type="submit" value="注册" />
        </form>
      </body>
    </html>

## regResult.jsp ##

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
      </head>
    
      <body>
        <h2>结果页面</h2>
        <%--
            错误信息：${
        error }
         --%>
            错误信息：${error }
        <script type="text/javascript">
            var res = '<%=request.getAttribute("error")%>';
            <%--
            if(res==1){
                parent.document.getElementById("msg").innerHTML="用户已存在，请重新输入";
            }else{
                parent.document.getElementById("msg").innerHTML="恭喜，注册成功";
            }
            --%>
            <%--
            由父页面自己调用自己的方法这种架构比较好，相当于我们在监听里写代码
            要将外面的变量声明成final类型，这样不好，所以我们在监听里面调用外面的一个方法，
            这样就不用将变量声明为final类型了，使得架构更好 
            --%>
            parent.resBack(res);
        </script>
      </body>
    </html>

## regServletJsp.jsp ##

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
      </head>
    
      <body>
        <h1>注册界面</h1>
        <h2>演示第三代jsp技术注册：jsp+servlet+pojo</h2>
        <form action="<%=request.getContextPath()%>/regServletPOJO" method="post">
            Name:<input type="text" name="name" /><br/>
            Passward:<input type="password" name="pwd" /><br/>
            <input type="submit" value="注册" />
        </form>
      </body>
    </html>

## RegServlet ##

package cn.hncu.reg.servlet;
    
    import java.io.IOException;
    import java.io.PrintWriter;
    
    import javax.servlet.ServletException;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    
    public class RegServlet extends HttpServlet {
        
        public void doGet(HttpServletRequest request, HttpServletResponse response)
                throws ServletException, IOException {
    
            doPost(request, response);
        }
    
        public void doPost(HttpServletRequest request, HttpServletResponse response)
                throws ServletException, IOException {
    
            response.setContentType("text/html;charset=utf-8");
            request.setCharacterEncoding("utf-8");
            PrintWriter out = response.getWriter();
            String name = request.getParameter("name");
            String pwd = request.getParameter("pwd");
            if(name.startsWith("hncu")){
                out.print("恭喜注册成功"+"用户名:"+name+",密码:"+pwd);
            }else{
                out.print("注册失败，用户名必须以hncu开头");
            }
    
        }
    
    }

## regServletPOJO ##

package cn.hncu.reg.servlet;
    
    import java.io.IOException;
    import java.io.PrintWriter;
    
    import javax.servlet.ServletException;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    
    import cn.hncu.regServletPojo.domain.User;
    import cn.hncu.regServletPojo.service.RegService;
    
    public class regServletPOJO extends HttpServlet {
        
        public void doGet(HttpServletRequest request, HttpServletResponse response)
                throws ServletException, IOException {
            doPost(request, response);
        }
        public void doPost(HttpServletRequest request, HttpServletResponse response)
                throws ServletException, IOException {
            request.setCharacterEncoding("utf-8");
            response.setContentType("text/html;charset=utf-8");
            PrintWriter out = response.getWriter();
            User user = new User();
            String name = request.getParameter("name");
            String pwd = request.getParameter("pwd");
            user.setName(name);
            user.setPwd(pwd);
            RegService service = new RegService();
            boolean boo = service.reg(user);
            if(boo){
                //访问后台
                request.getSession().setAttribute("name", name);
                out.println("注册成功，name:"+name+",pwd:"+pwd);
                //转发页面
            }else{
                out.println("注册失败，用户名必须以hncu开头，且密码长度大于等于5.name:"+name+",pwd:"+pwd);
                //转发页面
            }
    
        }
    
    }

## ValServlet ##

package cn.hncu.reg.servlet;
    
    import java.io.IOException;
    import java.io.PrintWriter;
    
    import javax.servlet.ServletException;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    
    public class ValServlet extends HttpServlet {
        
        public void doGet(HttpServletRequest request, HttpServletResponse response)
                throws ServletException, IOException {
            doPost(request, response);
        }
    
        public void doPost(HttpServletRequest request, HttpServletResponse response)
                throws ServletException, IOException {
            request.setCharacterEncoding("utf-8");
            response.setContentType("text/html;charset=utf-8");
            PrintWriter out = response.getWriter();
            String name = request.getParameter("name");
            String pwd= request.getParameter("pwd");
            if(name!=null&&name.trim().length()>0&&name.startsWith("hncu")){
                request.setAttribute("error", 0);//可以注册
            }else{
                request.setAttribute("error", 1);//不能注册，必须以hncu开头
            }
            request.getRequestDispatcher("/jsps/regResult.jsp").forward(request, response);
        }
    
    }

## cn.hncu.regEjb.ejb.User ##

package cn.hncu.regEjb.ejb;
    
    public class User {
        
        private String name ;
        private String pwd;
        public String getName() {
            return name;
        }
        public void setName(String name) {
            this.name = name;
        }
        public String getPwd() {
            return pwd;
        }
        public void setPwd(String pwd) {
            this.pwd = pwd;
        }
        @Override
        public String toString() {
            return "User [name=" + name + ", pwd=" + pwd + "]";
        }
        //在POJO 的基础上，增加一些业务处理方法，就变成企业级javabean，也成为EJB
        public boolean reg(){
            //这里可以导入dao层的方法，，这里就不写了，
            if(name.startsWith("hncu")&& pwd.length()>4){
                return true;
            }
            return false;
    
        }
    
    
    }

## cn.hncu.regServletPojo.domain.User ##

package cn.hncu.regServletPojo.domain;
    
    public class User {
        
        private String name;
        private String pwd;
        public String getName() {
            return name;
        }
        public void setName(String name) {
            this.name = name;
        }
        public String getPwd() {
            return pwd;
        }
        public void setPwd(String pwd) {
            this.pwd = pwd;
        }
        @Override
        public String toString() {
            return "User [name=" + name + ", pwd=" + pwd + "]";
        }
    
    }

## RegService ##

package cn.hncu.regServletPojo.service;
    
    import java.util.ArrayList;
    import java.util.List;
    
    import cn.hncu.regServletPojo.domain.User;
    
    public class RegService {
        
        public boolean reg(User user){
            if(user.getName().startsWith("hncu")&&user.getName().trim().length()>0&&user.getPwd().length()>4){
                return true;
            }
            return false;
        }
        public List<User> getAll(){
            return new ArrayList<User>();
        }
    }

[20160729153251847]: /images/20220719/c25e4d6d9b9644f09780c1e1d8726600.png
[20160729143342654]: /images/20220719/74cd53fdd32f45449270b3c50458b19f.png
[20160729143455687]: /images/20220719/f4aa114acb1a4f69abccb52cdb680247.png
[20160729143558197]: /images/20220719/ec4e580d19824251999c50db9cc427e7.png
[20160729151857997]: /images/20220719/ff8280dce1e6437e826774df8b04489e.png