娄底建设公司网站,网站开发课程建议,广东住房和城乡建设局网站首页,深圳华强北新闻最新消息今天今日内容 零、 复习昨日 零、 复习昨日 一、JSON处理【重点】 springmvc支持json数据交互,但是自己本身没有对应jar,使用的是第三方Jackson,只需要导入对应依赖,springmvc即可使用 如果需要换用到FastJson 导入依赖配置文件中指定json转换的类型为FastJson本次课程没有替换,用的…今日内容 零、 复习昨日 零、 复习昨日 一、JSON处理【重点】 springmvc支持json数据交互,但是自己本身没有对应jar,使用的是第三方Jackson,只需要导入对应依赖,springmvc即可使用 如果需要换用到FastJson 导入依赖配置文件中指定json转换的类型为FastJson本次课程没有替换,用的还是Jackson !-- json转换-Jackson --dependencygroupIdcom.fasterxml.jackson.core/groupIdartifactIdjackson-databind/artifactIdversion2.9.8/version/dependency1.1 响应JSON数据 只需要在方法上加ResponseBody注解,即可将返回值变为JSON 需求: 前端发请求,后台响应给浏览器JSON
Controller
public class JSONController {RequestMapping(/test1)ResponseBody // 返回JSON对象,不经过视图解析器public String test1() {System.out.println(响应json-test1 );return {\code\:200,\msg\:\OK\};}
}前后端交互,一般固定一个JSON模板 模板一般要包含三个信息: 状态码 自定义的每个意思都不一样假如: 20000 成功 40000 资源未找到 50000 没有权限 60000 代码异常… 提示信息 数据 {code:20000,msg:查询成功,data:{id:1,username:张三}
}/*** --- 天道酬勤 ---** author QiuShiju* desc 封装的结果数据* -- 符合layui默认模板格式* {* code: 0,* msg: ,* count: 1000,* data: [{}, {}]* }*/
public class ResultData {private int code; // 0是成功,其他都是不成功private String msg;private int count;private Object data;public ResultData() {}public static ResultData ok() {ResultData resultData new ResultData( );resultData.setCode(0);resultData.setMsg(成功);return resultData;}public static ResultData ok(Object data) {ResultData resultData new ResultData( );resultData.setCode(0);resultData.setMsg(成功);resultData.setData(data);return resultData;}public static ResultData ok(Object data,int count) {ResultData resultData new ResultData( );resultData.setCode(0);resultData.setMsg(成功);resultData.setData(data);resultData.setCount(count);return resultData;}public static ResultData fail() {ResultData resultData new ResultData( );resultData.setCode(-1);resultData.setMsg(失败);return resultData;}// set get 省略,自己加
}Controller方法只需要将返回值类型变为对应的类型 RequestMapping(/test2)ResponseBody // 返回JSON对象,不经过视图解析器public ResultData test2() {System.out.println(响应json-test2 );return ResultData.ok();}RequestMapping(/test3)ResponseBodypublic ResultData test3() {System.out.println(响应json-test3 );// 模拟查询全部ListUser list new ArrayList( );for (int i 1; i 10; i) {User user new User( );user.setId(i);user.setUsername(测试i);user.setScore(i * 33.3);user.setBirthday(new Date(i * 24 * 60 * 60 * 1000));list.add(user);}return ResultData.ok(list);}如果类中所有方法都需要返回成JSON,即都要加ResponseBody,那么就可以将类上加ResponseBody,方法上不需要加注解 其实还有一个类似的注解RestController,相对于是Controller和ResponseBody综合版 这是RESTful开发风格的写法 1.2 接收JSON数据
1.2.1 简单类型 前端使用ajax发送json数据,后端使用简单类型(基本类型,String,Date)来直接接收 button idbtn1btn1-ajax-json-简单类型/button
script src/js/jquery-2.1.0.js/script
script$(#btn1).click(function (){$.ajax({url:/test4.do,type:get,data:{id:1,username:张三},success:function (ret){if (ret.code 0){alert(ret.msg)}},error:function (){alert(服务器正忙!)}})});
/script/*** 接收JSON数据*/RequestMapping(/test4)public ResultData test4(int id,String username){System.out.println(id id);System.out.println(username username);return ResultData.ok();}1.2.2 对象类型 前端使用ajax发送json数据,后端使用对象来接收 【特别注意】 其实真正发送数据到后台时是按照表单内容发送所以后端可以直接用对象接收 为什么data为json格式的数据还是会以表单内容发送呢 是因为ajax的contentType默认是application/x-www-form-urlencoded 即如果真的要发送完全的JSON数据就需要指定contentTypeapplication/json,但是此时后台就没有办法直接使用对象接收数据 【总结】 请求方式是GET的话contentType指定成什么类型后台都可以直接用对象接收 请求方式是POST的contentType“application/x-www-form-urlencoded”(默认),后台也可以使用对象接收 前端ajax请求方式是POST的,contentTypeapplication/json时,发送的数据data内容需要变成json字符串才行,否则后台就不能使用对象直接接收,需要使用RequestBody来解析JSON data:JSON.stringify({“id”:1,“username”:“admin”}) button idbtn2btn2-ajax-json-对象类型/button
script src/js/jquery-2.1.0.js/script
script$(#btn2).click(function (){$.ajax({url:/test5.do,type:post,data:{id:1,username:张三,score:98.0,birthday:2022-12-12},// contextType:application/json,success:function (ret){if (ret.code 0){alert(ret.msg)}},error:function (){alert(服务器正忙!)}})});
/scriptpublic class User {private int id;private String username;private double score;// 日期,默认只能解析yyyy/MM/dd类型的日期,如果前端就是yyyy-MM-dd// 那么就需要使用该注解DateTimeFormat(pattern yyyy-MM-dd)private Date birthday;// set get...
}RequestMapping(/test5)
// 后台直接使用User对象来接收,JSON的key要与User的属性一致public ResultData test5(User user){System.out.println(user user);return ResultData.ok();}1.2.3 总结 前端发送json数据,后台如果使用简单类型接收单独参数,正常接收 前端发送json数据,后台如果使用对象接收,可以尝试使用对象直接接收 如果对象内没有数据,可以使用RequestBody来解析json,将数据封装到对象 二、文件上传
2.1 图片上传
使用第三方(commons-io,commons-fileupload)依赖 !-- 文件上传1 --dependencygroupIdcommons-io/groupIdartifactIdcommons-io/artifactIdversion2.4/version/dependency!-- 文件上传2 --dependencygroupIdcommons-fileupload/groupIdartifactIdcommons-fileupload/artifactIdversion1.3.3/version!-- 排除,防止依赖冲突 --exclusionsexclusiongroupIdjavax.servlet/groupIdartifactIdservlet-api/artifactId/exclusion/exclusions/dependencyspringmvc配置文件上传解析器
!-- 文件上传解析器 --
bean idmultipartResolver classorg.springframework.web.multipart.commons.CommonsMultipartResolver!-- 允许最大上传大小 --property namemaxUploadSize value102400/
/bean页面
!--文件上传使用的标签是forminput必须使用请求方法: post必须指定enctype
--
form action/upload.do methodpost enctypemultipart/form-data文件上传input typefile namesourcebrinput typesubmit value上传
/form后端 /*** 文件上传(存储到tomcat服务)* param source 类型必须是MultipartFile,参数名必须是和前端name值一样* 这样,文件上传时,MultipartFile内部就会有文件对象* param request 通过请求对象可以获得服务器地址,后续讲图片上传到服务对应位置* return*/RequestMapping(/upload)public String upload(MultipartFile source, HttpServletRequest request) throws IOException {String originalFilename source.getOriginalFilename( );System.out.println(originalFilename originalFilename);// 产生随机图片名String prefix UUID.randomUUID( ).toString( );System.out.println(prefix prefix);// 获得文件后缀String suffix FilenameUtils.getExtension(originalFilename);// 组合成新文件名String filename prefix.suffix;// 获得服务器路径String realPath request.getServletContext( ).getRealPath(/upload_file);System.out.println(realPath realPath);// 创建文件夹File parentFile new File(realPath);if (!parentFile.exists()) {parentFile.mkdir();}// 开始上传source.transferTo(new File(parentFile,filename));return ok;}2.2 上传后回显
方案一(同步): 上传成功后,将图片路径返回给前端,前端再处理
方案二(异步): 使用ajax上传,上传成功后,将图片路径返回给ajax的回调函数
前端页面
h1上传图片并回显/h1
!--使用ajax来完成文件上传,form里面不需要指定其他东西
--
form idformData文件上传input typefile namesourcebrinput typebutton onclickajaxUpload() value上传
/form
!-- 回显图片 --
img width300px idimg src alt图片script src/js/jquery-2.1.0.js/script
script// 文件上传function ajaxUpload(){// 获得表单对象var formData new FormData($(#formData)[0]);// 使用ajax文件上传$.ajax({url:/upload.do,type:post,data:formData,async:false,cache:false,contentType:false,processData:false,success:function (ret) {if (ret.code 0) {console.log(ret.data)$(#img).attr(src,ret.data);}else{alert(上传失败1);}},error:function () {alert(上传失败2);}});}
/script
/body
/html后端 // 与之前一样,只是将图片路径返回了,JSON格式的数据return ResultData.ok(/upload_file/filename);2.3 上传文件后续 1 将来写项目,文件上传后,要将图片路径存储到数据库 2 等真正写项目时,一般要有文件服务器(阿里云OSS,七牛云存储等) 三、文件下载
前端
divdiv!-- 图片路径是服务器路径 --img width300px src/upload_file/81d30e55-d6ca-4463-ba3b-5732504128f3.jpgbutton!-- 下载时,请求中携带文件名即可 --a href/download.do?filename81d30e55-d6ca-4463-ba3b-5732504128f3.jpg下载/a/button/divdivimg width300px src/upload_file/dazhong.jpga href/download.do?filenamedazhong.jpg下载/a/div
/div后端
/*** 下载图片* 下载是需要响应一个对话框,选择文件下载到什么地方* 不需要跳转页面,或者返回JSON*/
RequestMapping(/download)
public void download(String filename, HttpServletRequest request, HttpServletResponse response) throws IOException {String realPath request.getServletContext( ).getRealPath(/upload_file);String filepath realPath/filename;//设置响应头 告知浏览器要以附件的形式保存内容//浏览器显示的下载文件名response.addHeader(content-disposition,attachment;filenamefilename);response.setContentType(multipart/form-data);//读取目标文件写出给客户端IOUtils.copy(new FileInputStream(filepath),response.getOutputStream());
}四、SSM 在Spring整合Mybatis基础上,再加上SpringMVC的配置即可 依赖
spring核心依赖AOP依赖web,webmvc依赖mybatis,数据库驱动,数据源,spring-jdbc,mybatis-springlog4jServlet-apijackson注意lombok版本不要太高,1.16即可
配置文件
applicationContext.xmlspringmvc.xmlmybatis-config.xmllo4j.propertiesdb.propertiesweb.xml注意路径问题,需要加classpath: 1 web.xml定义监听器
!-- 定义监听器 --
listenerlistener-classorg.springframework.web.context.ContextLoaderListener/listener-class
/listener
!-- 监听到服务器启动,就会加载配置文件 --
context-paramparam-namecontextConfigLocation/param-nameparam-valueclasspath:applicationContext.xml/param-value
/context-param2 springmvc和applicationContext.xml
springmvc.xml
!-- 扫描注解 --
!-- 为了重复扫描注解,规定springmvc只扫描Controller注解,其他一概不管 --
context:component-scan base-packagecom.qf use-default-filtersfalse!-- 包含 --context:include-filter typeannotation expressionorg.springframework.stereotype.Controller/
/context:component-scanapplicationContext.xml
!-- 开启注解扫描 --
!-- 为了防止重复扫描,applicationContext,扫描全部注解,除了Controller注解 --
context:component-scan base-packagecom.qf!-- 排除 --context:exclude-filter typeannotation expressionorg.springframework.stereotype.Controller/
/context:component-scan五、作业
1 完成ssm整合,完成查询全部,分页模糊查询
2 复习mybatis ,复习项目
