回顾
1. listener监听器
监听三大域对象的创建和销毁,request、session、servletContext
快速入门
1.普通类,实现listener接口
2.重写抽象方法,创建和销毁
3.配置
web.xml
注解
统计在线人数
2. 综合案例
使用mvc和三层架构的思想实现用户模块的增删改查
程序入口(浏览器)---servlet(转发、重定向)---service---dao
AJAX&文件上传
今日目标
1. json
java和json数据相互转换
2. 校验用户名是否存在
3. 文件上传【可以照着抄一遍...】
4. 安装mysql5.7版本(如果mysql5.6以上可以继续使用....)
一 JSON
1.1 回顾
最早是JavaScript对象表示形式,现在主要用于互联网传输数据载体
* java
User user =new User();
user.setUsername("jack");
user.setAge(18);
* javaScript
let user = {"username":"jack","age":18};
let array = [{},{},{}]
name:都是字符串
value:支持各种类型
JSON 比 XML 更小、更快,更易解析
1587864032897.png1.2 JSON数据与java对象转换
常见的解析器
工具名称 | 介绍 |
---|---|
Jsonlib | Java 类库,需要导入的jar包较多 |
Gson | google提供的一个简单的json转换工具 |
Fastjson | alibaba技术团队提供的一个高性能的json转换工具 |
Jackson | 开源免费的json转换工具,springmvc转换默认使用jackson |
使用jackson,需要导入jar包
1587864541216.png提供了一个核心转换器对象
ObjectMapper om = new ObjectMapper();
1.2.1 java对象转为json(字符串)【重点】
String writeValueAsString(Object object);
// 将user对象转为json字符串
@Test
public void UserToJson() throws Exception {
User user = new User("1", "lucy", "女", 15, "德克萨斯", "123", "123@qq.com");
// 创建jackson转换器对象
ObjectMapper om = new ObjectMapper();
// 将任意对象转为json字符串
String json = om.writeValueAsString(user);
System.out.println(json); // 在java中name必须使用双引号包裹起来
}
// 将map集合转为json字符串
@Test
public void MapToJson() throws Exception {
Map<String, Object> map = new HashMap<>();
map.put("name", "张三");
map.put("age", 18);
// 创建jackson转换器对象
ObjectMapper om = new ObjectMapper();
// toJson
String json = om.writeValueAsString(map);
System.out.println(json); // {"name":"张三","age":18}
}
// 将list集合转为json数组字符串
@Test
public void ListToJson() throws Exception {
List<User> list = new ArrayList<>();
list.add(new User("1", "lucy", "女", 15, "德克萨斯", "123", "123@qq.com"));
list.add(new User("2", "jack", "男", 15, "德克萨斯", "123", "123@qq.com"));
// 创建jackson转换器对象
ObjectMapper om = new ObjectMapper();
// toJson
String json = om.writeValueAsString(list);
System.out.println(json); // [{},{}]
}
1.2.2 将json(字符串)转为java对象【了解】
T readValue(String json,Class<T> classType);
// 将json字符串转为user对象
@Test
public void JsonToUser() throws Exception {
String json = "{\"id\":\"1\",\"name\":\"lucy\",\"sex\":\"女\",\"age\":15,\"address\":\"德克萨斯\",\"qq\":\"123\",\"email\":\"123@qq.com\"}";
// 创建jackson转换器对象
ObjectMapper om = new ObjectMapper();
// toUser
User user = om.readValue(json, User.class);
System.out.println(user);
}
// 将json字符串转为map集合(如果你获取的json格式没有对应的java实体对象,就可以拿map接收)
@Test
public void JsonToMap() throws Exception {
String json = "{\"name\":\"lucy\",\"age\":18}";
// 创建jackson转换器对象
ObjectMapper om = new ObjectMapper();
// toMap
Map<String, Object> map = om.readValue(json, Map.class);
System.out.println(map);
}
// 将json数组字符串转为list集合
@Test
public void JsonToList() throws Exception {
String json = "[{\"id\":\"1\",\"name\":\"lucy\",\"sex\":\"女\",\"age\":15,\"address\":\"德克萨斯\",\"qq\":\"123\",\"email\":\"123@qq.com\"},{\"id\":\"2\",\"name\":\"jack\",\"sex\":\"男\",\"age\":15,\"address\":\"德克萨斯\",\"qq\":\"123\",\"email\":\"123@qq.com\"}]";
// 创建jackson转换器对象
ObjectMapper om = new ObjectMapper();
// toList
List list = om.readValue(json, List.class);
System.out.println(list);
}
1.3 自定义模板
1587866270735.png二 案例:检查用户名是否可用
需求
在用户注册页面,输入用户名,当用户名输入框失去焦点时,发送异步请求,将输入框的用户名传递给服务器进行是否存在的校验。
2.1 技术分析
此需求使用了ajax技术:通过==异步提交==,实现页面的==局部刷新==,提高用户的体验
JQuery提供的ajax函数
* ajax
$.ajax({
type:"请求方式,get|post",
url:"请求服务器地址",
data:"请求参数",
success:function(resp){
resp就是服务器返回的结果...
}
});
* get
$.get(url(地址?参数),function(resp){
});
* post
$.post(url,data,function(resp){
})
2.2 需求分析
1587868403078.png2.3 代码实现
① index.jsp
1587868753719.png<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>${NAME}</title>
<script src="${pageContext.request.contextPath}/js/jquery-3.2.1.js"></script>
</head>
<body>
<h3>用户注册</h3>
<form action="#" method="post">
用户名:<input type="text" name="username" id="username"> <span id="userwarn"></span> <br>
</form>
<script>
// 给用户文本框绑定失去焦点事件
$('#username').blur(function () {
// 获取用户输入的值
console.log(this.value);
let data = "username=" + this.value;
// 发送ajax请求
$.ajax({
type:"post",
url:'${pageContext.request.contextPath}/CheckServlet',
data:data,
success:function (resp) {
console.log(resp);
// 判断结果并实现局部刷新
if(resp.flag){
$('#userwarn').text(resp.msg).css('color','green');
}else{
$('#userwarn').text(resp.msg).css('color','red');
}
}
})
})
</script>
</body>
</html>
② CheckServlet
@WebServlet("/CheckServlet")
public class CheckServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doPost(request, response);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
request.setCharacterEncoding("utf-8");
// 1.接收请求参数
String username = request.getParameter("username");
// 2.声明map集合
Map<String, Object> map = new HashMap<>();
// 3.判断用户是否存在
if(username.equals("jack")){
map.put("flag",false);
map.put("msg", "× 此用户已注册");
}else{
map.put("flag",true);
map.put("msg", "√ 此用户可以注册");
}
// 4.将map集合转为json字符串
ObjectMapper om = new ObjectMapper();
String json = om.writeValueAsString(map);
System.out.println(json);
// 5.设置json的MIME类型
response.setContentType("application/json;charset=utf-8");
// 6.response响应json到客户端
response.getWriter().write(json);
}
}
三 案例:文件上传
需求
在用户注册页面,我们可以输入用户名,还可以选择要上传的文件;点击提交按钮,就可以将用户输入的内容和选择的文件保存到服务器上
3.1 技术分析
1587870989239.png3.1.1 客户端如何将文件转为文本
1. 表单提交方式必须为post
action="post"
2. 表单的enctype属性值必须为multipart/form-data 多组件表单数据
enctype="multipart/form-data"
3. 在表单中提供文件上传项
<input type="file" name="pic">
1587871962157.png
3.1.2 服务器将文本转为字节流
- 使用apache提供工具类 commons-fileupload(今天讲,最麻烦的....)
- 使用servlet3.0版本,通过注解实现(黑马旅游网)
- 使用springMVC框架(最简单,底层使用commons-fileupload)
3.1.2 代码实现【课下抄一遍即可】
① 导入文件上传相关jar包
1587872397979.png 1587872441280.png② index.jsp
1587872494757.png③ 指定服务器保存文件路径
1587872548319.png④ 编写servlet接收文件并保存
步骤分析
1. 创建磁盘文件项工厂
2. 创建核心解析对象(依赖工厂对象)
3. 解析request对象,返回上传项list集合
4. 遍历list,获取每一个上传项
5. 判断
普通上传项
name和value
文件上传项
文件名
字节输入流
保存服务器端
@WebServlet("/UploadServlet")
public class UploadServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doPost(request, response);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
try {
// 1.创建磁盘文件项工厂
DiskFileItemFactory factory = new DiskFileItemFactory();
// 2.创建上传解析器对象(依赖工厂对象)
ServletFileUpload fileUpload = new ServletFileUpload(factory);
// 3.解析request请求,返回上传项list集合
List<FileItem> fileItems = fileUpload.parseRequest(request);
// 4.遍历list
for (FileItem fileItem : fileItems) {
// 5.判断是文件项还是普通项
if (fileItem.isFormField()) {// 普通上传项
// 获取name属性名
String name = fileItem.getFieldName();
// 获取value属性值
String value = fileItem.getString();
System.out.println("普通上传项:" + name + "=" + value);
} else {// 文件上传项
// a.获取文件名 demo.txt
String fileName = fileItem.getName();
// b.获取文件字节输入流
InputStream in = fileItem.getInputStream();
// c.获取文件扩展名
String extName = FileUtil.extName(fileName);
// d.生成随机文件名
fileName = IdUtil.simpleUUID() + "." + extName;
// 此文件名会保存数据库一份,给用户查询使用...
// 获取upload目录在服务器真实路径
String realPath = request.getServletContext().getRealPath("/upload/");
// 判断此目录是否存在
File dirFile = new File(realPath);
if (!dirFile.exists()) {
dirFile.mkdirs(); // 如果不存在自己创建
}
// 设置文件字节输出流
FileOutputStream out = new FileOutputStream(realPath + fileName);
// 流的拷贝
IoUtil.copy(in, out);
// 关流
out.close();
in.close();
response.getWriter().write("success");
}
}
} catch (FileUploadException e) {
e.printStackTrace();
}
}
}
网友评论