企业自建的b2b平台有哪些_成熟交bgmbgmbgm在线_百度搜索app_建站平台哪家好

2-11-1Filter&Listener

1.Filter-概述

概念:Filter=过滤器,是JavaWeb三大组件(Servlet、Filter、Listener)之一。

过滤器可以把对资源的请求拦截下来,从而实现一些特殊的功能。

过滤器一般完成一些通用的操作,比如:权限控制、统一编码处理、敏感字符处理等等...

2.Filter-快速入门

1.定义类，实现Filter接口，并重写其所有方法

public class FilterDemo implements Filter {public void init(FilterConfig filterConfig) {}public void doFilter(ServletRequest request) {} public void destroy() {} 
}

2.配置Filter拦截资源的路径：在类上定义@web Filter注解

@WebFilter("/*")
public class FilterDemo implements Filter {
}

3.在都Filter方法中输出一句话，并放行

public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) {System.out.println("filter 被执行了...");//放行chain.doFilter(request,response);
}

3.filter-执行流程

放行后访问对应资源,资源访问完成后,会回到Filter中

如果回到Filter中,是执行放行后逻辑

执行放行前逻辑---放行---访问资源---执行放行后逻辑

//1. 放行前，对 request数据进行处理
System.out.println("1.FilterDemo...");//放行
chain.doFilter(request,response);//2. 放行后，对Response 数据进行处理
System.out.println("3.FilterDemo...");

4.Filter-拦截路径配置

Filter可以根据需求,配置不同的拦截资源路径

@WebFilter("/*/")

public class FilterDemo

拦截具体的资源:/index.jsp:只有访问index.jsp时才会被拦截。

目录拦截:/user/*:访问/user下的所有资源,都会被拦截

后缀名拦截:*jsp:访问后缀名为jsp的资源,都会被拦截

拦截所有:/*:访问所有资源,都会被拦截

5.Filter-过滤器链

过滤器链

• 一个Web应用,可以配置多个过滤器,这多个过滤器称为过滤器链
• 注解配置的Filter,优先级按照过滤器类名(字符串)的自然排序

6.filter-案例-登录验证

登录验证

• 需求:访问服务器资源时,需要先进行登录验证,如果没有登录,则自动跳转到登录页面

//判断访问资源路径是否和登录注册相关
String[] urls = {"/login.jsp","/imgs/","/css/","/loginServlet","/register.jsp","/registerServlet","/checkCodeServlet};
// 获取当前访问的资源路径
String url = req.getRequestURL().toString();//循环判断
for (String u : urls) {if(url.contains(u)){//找到了//放行chain.doFilter(request, response);return;}
}
//1. 判断session中是否有user
HttpSession session = req.getSession();
Object user = session.getAttribute("user");//2. 判断user是否为null
if(user != null){// 登录过了//放行chain.doFilter(request, response);
}else {// 没有登陆，存储提示信息，跳转到登录页面req.setAttribute("login_msg", "您尚未登陆！");req.getRequestDispatcher("/login.jsp").forward(req,response);
}

7.Listener

ServletContextListener使用

1.定义类，实现ServletContextListener接口

public class ContextLoaderListener implements ServletContextListener {/*** ServletContext对象被创建：整个web应用发布成功* @param sce*/public void contextInitialized(ServletContextEvent sce) {}/*** ServletContext对象被销毁：整个web应用卸载* @param sce*/public void contextDestroyed(ServletContextEvent sce) {}
}

2.在类上添加@web Listener注解

Listener

• 概念:Listener表示监听器,是JavaWeb三大组件(Servlet、Filter, Listener)之一。
• 监听器可以监听就是在application,session,request三个对象创建、针消毁或者往其中添加修改删除属性时自动执行代码的功能组件
• Listener分类:JavaWeb中提供了8个监听器

监听器分类	监听器名称	作用
ServletContext 监听	ServletContextListener	用于对 ServletContext 对象进行监听（创建、销毁）
	ServletContextAttributeListener	对 ServletContext 对象中属性的监听（增删改属性）
Session 监听	HttpSessionListener	对 Session 对象的整体状态的监听（创建、销毁）
	HttpSessionAttributeListener	对 Session 对象中的属性监听（增删改属性）
	HttpSessionBindingListener	监听对象于 Session 的绑定和解除
	HttpSessionActivationListener	对 Session 数据的钝化和活化的监听
Request 监听	ServletRequestListener	对 Request 对象进行监听（创建、销毁）
	ServletRequestAttributeListener	对 Request 对象中属性的监听（增删改属性）

11-2.AJAX

1.AJAX-概述

• 概念:ALAX(Asynchronous JavaScript And XML):异步的JavaSccript 和XML
• AJAX作用:
  • 与服务器进行数据交换:通过AJAX可以给服务器发送请求,并获取服务器响应的数据
    • 使用了AJAX和服务器进行通信,就可以使用HTML+AJAX来替换JSP页面了
  • 异步交互:可以在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页的技术,如:搜索联想、用户名是否可用校验,等等...

2.AJAX-快速入门

1. 编写AjaxServlet,并使用response输出字符串
2. 创建XMLHttpRequest对象:用于和服务器交换数据

var xmlhttp;
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safarixmlhttp = new XMLHttpRequest();
} else {// code for IE6, IE5xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

3.向服务器发送请求

xmlhttp.open("GET", "url");
xmlhttp.send();//发送请求

4.获取服务器响应数据

xmlhttp.onreadystatechange = function () {if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {alert(xmlhttp.responseText);}
}

3.案例-验证用户是否纯在

需求:在完成用户注册时,当用户名输入框失去焦点时,校验用户名名是否在数据库已存在

1.接收用户名

2.调用service查询User

3.返回标记

@WebServlet("/selectUserServlet")
public class SelectUserServlet extends HttpServlet {@Overrideprotected void doGet(HttpServletRequest request, HttpServletResponse response) {//1. 接收用户名String username = request.getParameter("username");//2. 调用service查询User对象boolean flag = true;//3. 响应标记response.getWriter().write("" + flag);}
}

1.给用户名输入框绑定光标失去焦点事件onblur

2.发送ajax请求,携带username参数

3.处理响应:是否显示提示信息

//1. 给用户名输入框绑定 失去焦点事件
document.getElementById("username").onblur = function () {//2. 发送ajax请求// 获取用户名的值var username = this.value;//2.1. 创建核心对象var xhttp;if (window.XMLHttpRequest) {xhttp = new XMLHttpRequest();} else {// code for IE6, IE5xhttp = new ActiveXObject("Microsoft.XMLHTTP");}//2.2. 发送请求xhttp.open("GET", "http://localhost:8080/ajax-demo/selectUserServlet?username="+username);xhttp.send();//2.3. 获取响应xhttp.onreadystatechange = function() {if (this.readyState == 4 && this.status == 200) {//alert(this.responseText);//判断if(this.responseText == "true"){//用户名存在，显示提示信息document.getElementById("username_err").style.display = '';}else {//用户名不存在， 清楚提示信息document.getElementById("username_err").style.display = 'none';
}}};
};

4.Axios-基本使用

Axios异步框架

• Axios对原生的AJAX进行封装,简化书写
• 官网:https://www.axios-http.cn

1. 引入 axios 的 js 文件

<script src="js/axios-0.18.0.js"></script>

1. 使用 axios 发送get请求并获取响应结果

axios({method:"get",url:"http://localhost:8080/ajax-demo1/aJAXDemo1?username=zhangsan"
}).then(function (resp){alert(resp.data);
});

1. 使用 axios 发送post请求并获取响应结果

axios({method:"post",url:"http://localhost:8080/ajax-demo1/aJAXDemo1",data:"username=zhangsan"
}).then(function (resp){alert(resp.data);
});

5.Axios-请求方式别名

为了方便起见,Axios已经为所有支持的请求方法提供了别名。

方法名	作用
get(url)	发起 GET 方式请求
post (url, 请求参数)	发起 POST 方式请求

• 发送 get 请求的代码：

axios.get("url")
.then(function (resp){alert(resp.data);
});

• 发送 post 请求的代码：

axios.post("url","参数")
.then(function (resp){alert(resp.data);
});

6.JSON-概述和基础语法

概念:

• JavaScript对象表示法
• 由于其语法简单,层次结构鲜明,现多用于作为数据载体,在网络中进行数据传输

JSON基础语法

• 定义
  • 格式：
    • var 变量名 = '{"key":value,"key":value,...}'
  • 示例：
    • var jsonStr = '{"name":"zhangsan","age":23,"addr":["北京","上海","西安"]}'
• JSDN字符串转为JS对象：
  • var jsObject = JSON.parse(jsonStr);
• JSDN字符串转为JS对象：
  • var jsonStr2 = JSON.stringify(jsObject);

Axios中,JSON字符串和JS对象自动进行转换

7.JSDN数据和JAVA对象转换

Fastjson是阿里巴巴提供的一个Java语言编写的高性能功能完善的JSON库,是目前Java语言中最快的JSON库,可以实现Java对象和JSON字符串的相互转换。

使用：

1.导入坐标

<dependency><groupId>com.alibaba</groupId><artifactId>fastjson</artifactId><version>1.2.62</version>
</dependency>

2.Java对象转换JSDN

String jsonStr = JSON.toJSONString(obj);

3.JSDN字符串转Java 对象

User user = JSON.parseObject(jsonStr, User.class);

8.查询所有

brand.html

1.页面加载完成后发送异步请求,获取列表数据

2.遍历集合数据,展示表格

<script src="js/axios-0.18.0.js"></script><script>//1. 当页面加载完成后，发送ajax请求window.onload = function () {//2. 发送ajax请求axios({method:"get",url:"http://localhost:8080/brand-demo/selectAllServlet"}).then(function (resp) {//获取数据let brands = resp.data;let tableData = " <tr>\n" +"       <th>序号</th>\n" +"       <th>品牌名称</th>\n" +"       <th>企业名称</th>\n" +"       <th>排序</th>\n" +"       <th>品牌介绍</th>\n" +"       <th>状态</th>\n" +"       <th>操作</th>\n" +"     </tr>";for (let i = 0; i < brands.length ; i++) {let brand = brands[i];ableData += "\n" +"<tr align=\"center\">\n" +"<td>"+brand.brandName+"</td>\n" +"<td>"+brand.company+"</td>\n" +"<td>"+brand.ordered+"</td>\n" +"<td>"+brand.description+"</td>\n" +"<td>"+brand.status+"</td>\n" +"<td><a href=\"#\">修改</a> <a href=\"#\">删除</a></td>\n" +"</tr>\n";}// 设置表格数据document.getElementById("brandTable").innerHTML = tableData;});};
</script>

Web层

SelectAllServlet

1.调用service查询

2.将List集合转为JSON

3.响应JSON数据

package com.itheima.web;import...@WebServlet("/selectAllServlet")
public class SelectAllServlet extends HttpServlet {private BrandService brandService = new BrandService();@Overrideprotected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {//1. 调用Service查询List<Brand> brands = brandService.selectAll();//2. 将集合转换为JSON数据  序列化String jsonString = JSON.toJSONString(brands);//3. 响应数据response.setContentType("text/json;charset=utf-8");response.getWriter().write(jsonString);}@Overrideprotected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {this.doGet(request, response);}
}

9.案例-新增品牌

• addBrand.html：前端页面，当用户点击提交按钮时，发送 ajax 请求。获取数据并判断添加是否成功，若成功则跳转至 brand.html 页面。

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>表单提交示例</title><!-- 引入 axios 库 --><script src="js/axios-0.18.0.js"></script>
</head><body><!-- 表单 --><form action="" method="post">品牌名称：<input id="brandName" name="brandName"><br>企业名称：<input id="companyName" name="companyName"><br>排序：<input id="ordered" name="ordered"><br>描述信息：<textarea rows="5" cols="20" id="description" name="description"></textarea><br>状态：<input type="radio" name="status" value="0">禁用<input type="radio" name="status" value="1">启用<br><input type="button" id="btn" value="提交"></form><script>// 1. 给按钮绑定单击事件document.getElementById("btn").onclick = function () {// 将表单数据转为 jsonvar formData = {brandName: "",companyName: "",ordered: "",description: "",status: ""};// 获取表单数据let brandName = document.getElementById("brandName").value;// 设置数据formData.brandName = brandName;// 获取表单数据let companyName = document.getElementById("companyName").value;// 设置数据formData.companyName = companyName;// 获取表单数据let ordered = document.getElementById("ordered").value;// 设置数据formData.ordered = ordered;// 获取表单数据let description = document.getElementById("description").value;// 设置数据formData.description = description;let status = document.getElementsByName("status");for (let i = 0; i < status.length; i++) {if (status[i].checked) {formData.status = status[i].value;break;}}console.log(formData);// 2. 发送 ajax 请求axios({method: "post",url: "http://localhost:8080/brand-demo/addServlet",data: formData}).then(function (resp) {// 判断响应数据是否为 successif (resp.data == "success") {location.href = "http://localhost:8080/brand-demo/brand.html";}});};</script>
</body></html>

​​​​​

• Web 层（AddServlet）：接收前端发送的品牌数据，调用 Service 层的方法进行添加操作，最后向客户端响应成功标识。

// 接收数据,request.getParameter 不能接收json的数据
/* String brandName = request.getParameter("brandName");
System.out.println(brandName);*/// 获取请求体数据
BufferedReader br = request.getReader();
String params = br.readLine();// 将JSON字符串转为Java对象
Brand brand = JSON.parseObject(params, Brand.class);// 调用service 添加
brandService.add(brand);// 响应成功标识
response.getWriter().write("success");