SpringMVC 04 -静态资源放行与JSON交互
SpringMVC静态资源放行与JSON交互
- 1 静态资源放行
-
- 1.1 静态资源问题
- 1.2 解决方案1
- 1.3 解决方案2
- 1.4 解决方案3
- 2 Json交互
-
- 2.1 导入依赖
- 2.2 使用@ResponseBody
- 2.3 使用@RestController
- 2.4 使用@RequestBody
-
- 2.4.1 前端请求
- 2.4.2 定义Controller
1 静态资源放行
1.1 静态资源问题
静态资源:html,js文件,css文件,图片文件
因为在SpringMVC中DispatcherServlet也采用了 “/” 作为url-pattern, 所以静态资源的访问也会进入前端控制器,前端控制器会根据路径在对应的Handler处理请求,但是肯定没有这样的请求地址,所以造成静态资源不能完成访问。
1.2 解决方案1
DispathcerServlet采用其他的url-pattern
此时,所有访问handler的路径都要以 .do结尾!!
缺点:所有的请求都需要加上.do为后缀
<servlet><servlet-name>dispatcherServlet</servlet-name><servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class><init-param><param-name>contextConfigLocation</param-name><param-value>classpath:spring/springmvc.xml</param-value></init-param></servlet><servlet-mapping><servlet-name>dispatcherServlet</servlet-name><url-pattern>*.do</url-pattern></servlet-mapping>
1.3 解决方案2
DispathcerServlet的url-pattern依然采用 “/”,但追加配置
- 静态资源放行
<mvc:default-servlet-handler/>
- 底层SpringMVC写了一个DefaultServlet,接受请求,优先去找静态资源,如果静态资源不存在,就去找处理器映射器
<!--SpringMVC提供了一个DefaultServletHttpRequestHandler的类,获取默认先检查次路径是否为静态资源。如果是静态资源就执行放行,如果不是静态资源则继续交给DispatcherServlet处理
-->
<mvc:default-servlet-handler/>
1.4 解决方案3
- mapping是访问路径,location是静态资源存放的路径
放行指定的路径对应的静态资源
<!-- mapping:请求路径 location:静态资源位置 -->
<mvc:resources mapping="/css/" location="/css/"/>
<mvc:resources mapping="/image/" location="/image/"/>
<mvc:resources mapping="/js/" location="/js/"/>
<mvc:resources mapping="/pages/" location="/pages/"/>
2 Json交互
导入依赖:Jackson依赖
jackson-databind
2个注解
- ResponseBody 将方法的返回值类型转换成json字符串,返回给前端
- @RequestBody:将前端传递的
Json格式
的字符串自动转换为java对象前端向后端提交数据 注意SpringMVC要求:
- 设置请求参数的类型为json格式
contentType:'application/json',
- 必须是post请求
type:"POST",
2.1 导入依赖
导入Jackson依赖
jackson-databind
<dependency><groupId>com.fasterxml.jackson.core</groupId><artifactId>jackson-databind</artifactId><version>2.12.2</version>
</dependency>
2.2 使用@ResponseBody
@ResponseBody作用:将方法的返回值类型转换成json字符串,返回给前端
如果在类上使用@ResponseBody 注解表当前类所有的方法都将返回json数据(前后端分离) 不走视图解析器(不是前后端分离就不要用)
可以加在方法上
可以加在类前面
@Controllerpublic class TestController {@RequestMapping("/json1")public void json1(HttpServletResponse response){try {User user = new User("张三",30,1000d);ObjectMapper mapper = new ObjectMapper();response.setContentType("application/json;charset=utf-8");String json = mapper.writeValueAsString(user);response.getWriter().write(json);} catch (JsonProcessingException e) {e.printStackTrace();} catch (IOException e) {e.printStackTrace();}}@RequestMapping("/json2")public User json2(){User user = new User("张三1",31,1010d);return user;}@RequestMapping("/json3")public List<User> json3(){List<User> userList = new ArrayList<>();for (int i = 0; i < 10; i++) {userList.add(new User("张三"+i,31,1010d));}return userList;}@RequestMapping(value = "/json4",produces = "application/json;charset=utf-8")public String json4(){return "hello,中文";}
}
2.3 使用@RestController
Controller类上加了@RestController注解,等价于在类中的每个方法上都加了@ResponseBody
@RestController = @Controller + @ResponseBody
@RestController //那么这个Controller中不能使用转发、重定向,不走视图解析器。 纯前后端分离项目使用
public class TestController {@RequestMapping("/json2")public User json2(){User user = new User("张三1",31,1010d);return user;}@RequestMapping("/json3")public List<User> json3(){List<User> userList = new ArrayList<>();for (int i = 0; i < 10; i++) {userList.add(new User("张三"+i,31,1010d));}return userList;}@RequestMapping(value = "/json4",produces = "application/json;charset=utf-8")public String json4(){return "hello,中文";}
}
2.4 使用@RequestBody
@RequestBody作用:将前端传递的
Json格式
的字符串自动转换为java对象
2.4.1 前端请求
json.html
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><!--引入jQuery--><script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body><form id="userForm">用户名:<input type="text" id="username" name="username">密码:<input type="text" id="password" name="password"><input type="button" onclick="login()" value="提交"></form><script>function login(){//模拟json数据//var json = {username:"admin123",password:"123456"};//var username = $("#username").val();//var password = $("#password").val();//var json = {username:username,password:password};//serializeArray(); 获取表单中所有的数据,并返回一个数据(json对象)[{username:""},...]var dataArr = $("#userForm").serializeArray();var json = {};$.each(dataArr,function(index,data){json[data.name] = data.value;})//发送ajax异步请求$.ajax({url:'/sendJson',//将json对象转成json字符串data:JSON.stringify(json),type:"POST",//设置请求参数的类型为json格式,告知后端提交的是json格式的数据contentType:'application/json',success:function(res){console.log(res);}})}</script>
</body>
</html>
2.4.2 定义Controller
@RestController
public class TestController {@RequestMapping("/sendJson")public Map json5(@RequestBody User user){System.out.println(user);Map map = new HashMap();map.put("code",2000);map.put("msg","成功");return map;}
}