您的位置：首页 > Web前端 > JavaScript

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

2016-07-29 15:25 537 查看

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（隐藏帧技术）：

知识点：

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、全部不隐藏：

2、隐藏表单B的显示：

3、隐藏iframe做的子页面：

至此，myAjax的底层原理就是这样。

jsp的三代开发技术

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

用jsp写网页和逻辑。

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

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

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

分为了三层，即MVC架构思想，jsp只写html和El表达式，servlet和service操作pojo 然后去做业务逻辑，去数据层访问。这个POJO也可以称为简单的javabean

如图所示：

本文完整代码如下：

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可以很方便的操纵其他容器，如下面代码
-->
<%
//等价于上面的代码
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>
<!-- pageContext.findAttribute("name")方法，会依次（从小到大的容器）
pageContext->request->session->application
去找对应的属性，找到一个后面就不会再找了
-->
<%
out.print(pageContext.findAttribute("name")+"<br/>");
%>
<h2>----------我是最美的分割线1111111111--------------</h2>
<!-- EL表达式 -->
<h2>这里有一个name：${name}</h2>
<h2>----------我是最美的分割线222222222--------------</h2>
<h2>myAjax--演示隐藏帧技术--定点通讯</h2>
<!-- 用iframe，画中画隐藏起来，结合js技术 -->
<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

<%@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>

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="text" name="name" id="regName" ><br/>
<input type="text" name="name" id="regName" ><br/>
应该用
<input type="hidden" name="name" id="regName"><br/>
-->
<input type="hidden" name="name" id="regName"><br/>
</form>
<!--
<iframe name="dateFrame" >
-->
<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>();
}
}

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航