JAVAWEB_实验三 Servlet 相关技术


Servlet 基础

一、 实验目的

理解 Servlet 的工作原理,掌握 Servlet 的应用开发方法;掌握常见 Servlet ;

二、 实验要求

  1. 理解 Servlet 的应用。
  2. 掌握 Servlet 的编程技术。
  3. 熟练使用 Eclipse 开发 Servlet 应用

三、 实验内容

(一)用 Servlet 获取表单数据

  1. 建立一个 Servlet 文件 accept.java 和一个 register.jsp 文件,实现用 Servlet 实现获取表单数据的功能。
    程序功能:利用 Servlet 的方式实现表单数据的获取。
    accept.java
package servlet;

import java.io.*;
import javax.servlet.*;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.*;
@WebServlet(urlPatterns = {"/accept"})
public class accept extends HttpServlet {
    public String codeToString(String str) {//处理中文字符串的函数
        String s = str;
        try {
            byte tempB[] = s.getBytes("ISO-8859-1");
            s = new String(tempB);
            return s;
        } catch (Exception e) {
            return s;
        }
    }

    public void init(ServletConfig config) throws ServletException {
        super.init(config);
    }

    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
//设置mime
        response.setContentType("text/html;charset=GB2312");
        PrintWriter out = response.getWriter();
        out.println("<HTML><head><title>接收新用户注册</title></head><BODY>");
        out.println("这是新用户注册所提交的数据:<br>");
        out.println("用户名是:" + codeToString(request.getParameter("username")) + "<br>");
        out.println("密码是:" + codeToString(request.getParameter("userpassword")) + "<br>");
        out.println("性别是:" + codeToString(request.getParameter("sex")) + "<br>");
        out.println("出生年月是:" + request.getParameter("year") + request.getParameter("month") + request.getParameter("day") + "<br>");
        out.println("电子邮箱是:" + request.getParameter("email") + "<br>");
        out.println("家庭住址是:" + codeToString(request.getParameter("address")) + "<br>");
        out.println("</body> </html>");
    }
}


register.jsp

<%@ page contentType="text/html;charset=gb2312" %>
<script language="javascript">  function on_submit() {//验证数据的合法性
    if (form1.username.value == "") {
        alert("用户名不能为空,请输入用户名!");
        form1.username.focus();
        return false;
    }
    if (form1.userpassword.value == "") {
        alert("用户密码不能为空,请输入密码!");
        form1.userpassword.focus();
        return false;
    }
    if (form1.reuserpassword.value == "") {
        alert("用户确认密码不能为空,请输入密码!");
        form1.reuserpassword.focus();
        return false;
    }
    if (form1.userpassword.value != form1.reuserpassword.value) {
        alert("密码与确认密码不同");
        form1.userpassword.focus();
        return false;
    }
    if (form1.email.value.length != 0) {
        for (i = 0; i < form1.email.value.length; i++)
            if (form1.email.value.charAt(i) == "@")
                break;
        if (i == form1.email.value.length) {
            alert("非法 EMail 地址!");
            form1.email.focus();
            return false;
        }
    } else {
        alert("请输入 Email!");
        form1.email.focus();
        return false;

    }
}
</script>
<html>
<head>
    <title>新用户注册</title>
</head>
<body>
<form method="POST" action="accept.jsp" name="form1" onsubmit="return on_submit()">
    新用户注册<br>
    用户名(*)<input type="text" name="username" size="20"><br>&nbsp;(*)<input type="password" name="userpassword" size="20"><br>
    再输一次密码(*)<input type="password" name="reuserpassword" size="20"><br>
    性别:<input type="radio" value="男" checked name="sex"><input type="radio" name="sex" value="女"><br>
    出生年月:<input name="year" size="4" maxlength=4><select name="month">
        <option value="1" selected>1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="6">6</option>
        <option value="8">7</option>
        <option value="9">9</option>
        <option value="10">10</option>
        <option value="11">11</option>
        <option value="12">12</option>
    </select><input name="day" size="3" maxlength=4><br>
    电子邮箱(*)<input name="email" maxlength=28><br>
    家庭住址:<input type="text" name="address" size="20"><br>
    <input type="submit" value="提交" name="B1">
    <input type="reset" value="全部重写" name="B2"><br>
</form>
</body>
</html>

运行结果:
在这里插入图片描述
在这里插入图片描述

过滤器

一、 实验目的

  1. 了解过滤器的作用;
  2. 掌握过滤器的开发与部署的步骤;
  3. 了解过滤器链。

二、 实验原理

过滤器是 web 服务器上的组件,它们对客户和资源之间的请求和响应进行过滤。
过滤器的工作原理是:当servlet容器接收到对某个资源的请求,它要检查是否有过滤器与之关联。如果有过滤器与该资源关联,servlet容器将把该请求发送给过滤器。在过滤器处理完请求后,它将做下面3件事:

  • 产生响应并将其返回给客户;
  • 如果有过滤器链,它将把(修改过或没有修改过)请求传递给下一个过滤器;
  • 将请求传递给不同的资源。当请求返回到客户时,它是以相反的方向经过同一组过滤器返回。过滤器链中的每个过滤器够可能修改响应。

过滤器 API 主要包括:Filter、FilterConfig 和 FilterChain 接口。

三、 实验内容

编写一个过滤器改变请求编码
【步骤 1】编写一个 loginform.html 文件,代码如下:

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>使用过滤器改变请求编码</title>
    <meta http-equiv="Content-Type" content="text/html;charset=GB2312">
</head>
<body>
<center>
    <h2>请输入用户名和口令:</h2>
    <form method="post" action="servlet/CheckParamServlet">
        <table>
            <tr>
                <td>用户名:</td>
                <td><input name="name" type="text"></td>
            </tr>
            <tr>
                <td>口 令:</td>
                <td><input name="pass" type="password"></td>
            </tr>
            <tr>
                <td></td>
                <td>
                    <input name="ok" type="submit" value="提交">
                    <input name="cancel" type="reset" value="重置">
                </td>
            </tr>
        </table>
    </form>
</center>
</body>
</html>


【步骤 2】编写处理请求参数的 Servlet

package servlet;

import java.io.*;
import javax.servlet.*;
import javax.servlet.http.*;

public class CheckParamServlet extends HttpServlet {
    public void doGet(HttpServletRequest request,
                      HttpServletResponse response)
            throws ServletException, IOException {
        String name = request.getParameter("name");
        String pass = request.getParameter("pass");
        response.setContentType("text/html;charset=gb2312");
        PrintWriter out = response.getWriter();
        out.println("<html><head><title>Param Test</title></head>");
        out.println("<h3 align=center>你的用户名为:" + name + "</h3>");
        out.println("<h3 align=center>你的口令为:" + pass + "</h3>");
        out.println("</body></html>");
    }

    public void doPost(HttpServletRequest request,
                       HttpServletResponse response)
            throws ServletException, IOException {
        doGet(request, response);
    }
}

【步骤 3】修改 web.xml 文件,加入下面代码:

<web-app>

    <servlet>
        <servlet-name>CheckParamServlet</servlet-name>
        <servlet-class>servlet.CheckParamServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>CheckParamServlet</servlet-name>
        <url-pattern>/servlet/CheckParamServlet</url-pattern>
    </servlet-mapping>

</web-app>

【步骤 4】在浏览器的地址栏中输入下面 URL: http://localhost:8080/ helloapp/loginform.html
输入用户名和口令,如下图所示:
在这里插入图片描述

然后点击“提交”按钮,经 CheckParamServlet 处理后返回的结果如下图所示:
在这里插入图片描述
【步骤 5】过滤器代码如下:

package filter;

import java.io.IOException;
import javax.servlet.*;

public class EncodingFilter implements Filter {
    protected String encoding = null;
    protected FilterConfig config;

    public void init(FilterConfig filterConfig) throws ServletException {
        this.config = filterConfig;
// 得到在 web.xml 中配置的编码
        this.encoding = filterConfig.getInitParameter("Encoding");
    }

    public void doFilter(
            ServletRequest request,
            ServletResponse response, FilterChain chain) throws IOException, ServletException {
        if (request.getCharacterEncoding() == null) {
// 得到指定的编码
            String encode = getEncoding();
            if (encode != null) {
//设置 request 的编码
                request.setCharacterEncoding(encode);
                response.setCharacterEncoding(encode);
            }
        }
        chain.doFilter(request, response);
    }

    protected String getEncoding() {
        return encoding;
    }

    public void destroy() {
    }
}


【步骤 6】在 web.xml 文件中配置过滤器,加入下面代码:

<?xml version="1.0" encoding="UTF-8"?>

<web-app>
    <servlet>
        <servlet-name>CheckParamServlet</servlet-name>
        <servlet-class>servlet.CheckParamServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>CheckParamServlet</servlet-name>
        <url-pattern>/servlet/CheckParamServlet</url-pattern>
    </servlet-mapping>

    <filter>
        <filter-name>EncodingFilter</filter-name>
        <filter-class>filter.EncodingFilter</filter-class>
        <init-param>
            <param-name>Encoding</param-name>
            <param-value>UTF-8</param-value>
        </init-param>
    </filter>
    <filter-mapping>
        <filter-name>EncodingFilter</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>

</web-app>

【步骤 7】重复第(4)步操作,结果如下:
在这里插入图片描述

试简述过滤器有哪些功能?

答:本题过滤器的作用是在客户端和服务端之间指定 request 的编码,对乱码问题进行修改,从而将乱码转变为中文编码!主要含义是客户端与服务器资源文件之间的一道过滤网,在访问资源文件之前,通过一系列的过滤器对请求进行修改、判断等,把不符合规则的请求在中途拦截或修改。也可以对响应进行过滤,拦截或修改响应。浏览器发出的请求先递交给第一个filter进行过滤,符合规则则放行,递交给filter链中的下一个过滤器进行过滤。过滤器在链中的顺序与它在web.xml中配置的顺序有关,配置在前的则位于链的前端。当请求通过了链中所有过滤器后就可以访问资源文件了,如果不能通过,则可能在中间某个过滤器中被处理掉。
如何理解过滤器链。
答:在 Web 应用中,可以部署多个 Filter,若这些 Filter 都拦截同一目标资源,则它们就组成了一个 Filter 链(也称过滤器链)。过滤器链中的每个过滤器负责特定的操作和任务,客户端的请求在这些过滤器之间传递,直到传递给目标资源。过滤器能够对网站中的各种内容进行过滤(页面、Servlet、图片、文件),可以在网站内容请求和响应时进行一些操作,完成一些通用的功能。

实现一个查询天气的 web 程序

使用表单完成城市的输入,提交使用 ajax 完成查询显示;

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>ajax</title>
</head>
<body>
<input type="text" id="tel"/>
<button id="ajax">天气预报</button>
<p><span id="reslut"></span></p>
<script src="//apps.bdimg.com/libs/jquery/2.1.2/jquery.min.js"></script>
<script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<script type="text/javascript">
    $(function () {
        $('#ajax').on('click', function () {
            var $telValue = $('#tel').val();
            if ($telValue == "") {
                alert('不能为空!');
                return;
            }
            $.ajax({
                type: 'GET',
                dataType: 'jsonp',
                jsonp: 'callback',
                jsonpCallback: 'getName',
                url: 'http://api.asilu.com/weather/',
                data: {
                    "city": $telValue
                },
                success: function (data) {
                    var reslutData = data;
                    console.log(reslutData);
                    $('#reslut').text(reslutData.city + "明天的天气:"
                        +reslutData.weather[0].weather
                        +reslutData.weather[0].wind
                        +reslutData.weather[0].temp
                        +reslutData.weather[0].date
                    );},

            })
        })
    })
</script>
</body>
</html>

运行结果:
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

南风如意

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值