JavaWeb复习05、06

CH05-Servlet和jsp进阶

过滤器

Servlet API还提供一系列用于拦截Request请求和Response响应的接口。通过调用这些API在用户访问资源前或服务器完成响应后进行某些特定的处理。

过滤器常用的场景有

  • 对用户请求进行统一认证
  • 对用户访问进行审核和统计
  • 对用户发送的数据进行过滤和替换
  • 转换字符编码、图像格式等
  • 对响应的内容进行压缩，减少网络传输量
  • 对请求或响应数据进行加密/解密处理

过滤器的实现

1.实现相关接口，完成方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
public class logFilter implements Filter {
    @Override
    public void init(FilterConfig filterConfig) throws ServletException {}

    @Override
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
        //过滤器，拦截对商品页面的请求，用作日志记录
        String categoryId =servletRequest.getParameter("categoryId");//获取从request过来的categoryId
        Log.getInstance().linkedCategoryUpdate(categoryId);//更新条目被访问的次数

        LogDaoImpl logDao = new LogDaoImpl();
        logDao.UpdateLastTime(Log.getInstance(),Log.getInstance().getLastTime());//存到数据库中

        System.out.println("拦截成功");
        servletRequest.getRequestDispatcher("category").forward(servletRequest,servletResponse);//请求转发
    }

    @Override
    public void destroy() {}
}

2.web.xml中配置注解

1
2
3
4
5
6
7
8
<filter>
    <filter-name>logFilter</filter-name>
    <filter-class>petstore.logFilter</filter-class>
</filter>
<filter-mapping>
    <filter-name>logFilter</filter-name>
    <servlet-name>CategoryFormServlet</servlet-name>
</filter-mapping>

多个过滤器的先后顺序必须通过web.xml配置顺序决定

doFilter()的参数

  • 有三个参数：请求对象request、响应对象response、过滤器链对象filterChain
  • doFilter()的最后一行一般会调用filterChain对象的doFilter()方法，传递给下一个过滤器，没有就进行正常的请求和响应
  • 不在doFilter()的最后一行调用filterChain对象的doFilter()方法即表明用户请求到此结束

监听器

Servlet API提供一系列的事件和事件监听接口，通过调用这些API可以进行事件驱动的开发。

监听器的实现

1.实现相关接口，完成方法

2.在容器内通过配置文件或使用注解配置监听器

1
2
3
<listener>
    <listener-class>fully-qualified class</listener-class>
</listener>

JavaWeb技术栈总结

CH06-HTML/CSS

HTML、CSS、JavaScript三者的关系

网页由三部分组成：结构、表现、行为

  • html给予网页结构
  • CSS控制网页的表现（样式）
  • JavaScript控制网页的行为（behavior）

HTML结构

head在body之前。在head中包含了网页的信息，里面通常会包含5类标签：title、link、script、meta、style。meta的作用是网页关键词、网页描述、作者等说明性标签

body

body元素包含了可见的页面内容。

块和行的概念

大多数 HTML 元素被定义为块级元素或内联元素。块级元素在浏览器显示时，通常会以新行来开始。

块级元素特点：

  • 块级元素，独占一行，从新行开始
  • 块级元素总会占据可用的全部宽度
  • 宽度和高度以及外边距、内填充都可以设置
  • 块级元素可包含行内元素和块级元素
  • 垂直向下排列(注:若想使其水平方向排序，可使用左右浮动（float:left/right）让其水平方向排列。)

行级元素特点：

  • 行内元素 都在一行，不会另起一行
  • 行内元素 只会占据所需要的宽度
  • 行内元素不可以设置宽高，默认宽度就是文字的宽度，宽度高度随文本内容的变化而变化，但是可以设置行高（line-height)
1
2
3
4
5
6
7
8
9
10
11
<!-- 常见块级元素标签 -->
<div></div>
<form></form>
<table></table>
<h1></h1>
    
<!-- 常见行级元素标签 -->
<span></span>
<input>
<img>
<a></a>

CSS

CSS，层叠样式表，用于渲染HTML元素标签的样式。

基本语法

选择器

  • 标签选择器：div{ }：选择所有的div标签添加样式
  • 类选择器：.box{ }：选择所有含有class=“box”的标签进行渲染
  • ID选择器：#idbox{}： 对id=“idbox”的元素进行渲染，元素的 id 在页面中是唯一的，因此 id 选择器用于选择一个唯一的元素！

属性

1
2
3
4
5
6
7
8
9
10
11
12
13
14
.enter 
{
    border-radius: 4px;
    border: none;
    //设置属性边框
    
    color: #FFFFFF;
    //设置颜色属性

    font-size: 28px;
    font-family: Algerian;
    //设置字体属性
    
}

布局方式

CSS采用盒子模型来处理每一个HTML元素，布局就是控制每个盒子的具体位置

**普通流：**每个块级元素都换行显示，垂直向下排列

1
position：static；

**相对定位：**在普通流中的位置给出上下左右的相对位移

1
2
3
position：relative；
top：10px；
left： 50px；

**绝对定位：**脱离普通流，直接用位置参数定位显示

1
position:fixed
  • **固定定位：**元素相对于浏览器定位
1
2
3
position:fixed;
top:50px;
left:50px;
  • **浮动元素：**浮动一个元素，使其脱离普通流，根据参数浮动
1
2
float:right;
width:275px;
  • **z-index：**任何元素从普通流脱离时会产生重叠，控制其层级
1
z-index:10;