本文摘自PHP中文网,作者coldplay.xixi,侵删。
ajax栏目介绍与后台传输数据的方法
推荐(免费):ajax
最近写ajax与后台传输数据的时候碰到了一个问题,我想ajax以json的方式把数据传输个后台,后台用map的形式接收,然后也以map的形式传回数据。可是一直碰到前台报(*)(@415 Unsupported media type) 不支持媒体类型错误,然后经过查阅资料终于解决了。这里总结下关于ajax与后台传输数据的几种方式,上面问题的解决方法在本文最后。
1.把数据放到url中传递 js: 1
2
3
4
5
6
7
8
9
10
11
<code>
var
id = $(
"#id"
).val();
$.ajax({
type:
"POST"
,
url:
"/IFTree/people/getPeopleById/"
+id,
success:
function
(data){ alert(data);
},
error:
function
(xhr, textStatus, errorThrown) {
}
});
</code>
后台: <pre><code>
1
2
3
4
5
6
7
8
9
@RequestMapping(value =
"getPeopleById/{id}"
)
@ResponseBody
public
Map<String, Object> getPeopleById(@PathVariable(
"id"
) int id) {
System.out.println(id);
Map<String, Object> map =
new
HashMap<String, Object>();
return
map;
}
}
</code></pre>
2.把数据放到data中 js: 1
2
3
4
5
6
7
8
9
10
11
12
<code>
var
id = $(
"#id"
).val();
$.ajax({
type:
"POST"
,
url:
"/IFTree/people/getPeopleById"
,
data: {id:id},
success:
function
(data){ alert(data.result);
},
error:
function
(xhr, textStatus, errorThrown) {
}
});
</code>
后台(两个方式): <pre><code>
1
2
3
4
5
6
7
@RequestMapping(value =
"getPeopleById"
)
@ResponseBody
public
Map<String, Object> getPeopleById(HttpServletRequest request,HttpServletResponse response) {
int id = Integer.valueOf(request.getParameter(
"id"
));
Map<String, Object> map =
new
HashMap<String, Object>();
return
map;
}
</code></pre>
1
2
3
4
5
6
7
8
@RequestMapping(value =
"getPeopleById"
)
@ResponseBody
public
Map<String, Object> getPeopleById(HttpServletRequest request,HttpServletResponse response) {
int id = Integer.valueOf(request.getParameter(
"id"
));
Map<String, Object> map =
new
HashMap<String, Object>();
return
map;
}
</code>
3.以json传输(就是开头说的情况) js(包含一些常见的ajax参数解释): 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<code>
var
id = $(
"#id"
).val();
$.ajax({
type:
"POST"
,
timeout:10000,
async:ture,
cache:false,
url:
"/IFTree/people/getPeopleById"
,
contentType:
"application/json;charset=UTF-8"
,
data: JSON.stringify({id:id}),
dataType:
"json"
,
success:
function
(data){
$(
"#name"
).val(data.result.name);
},
error:
function
(xhr, textStatus, errorThrown) {
}
});
});
</code>
后台: <pre><code>
1
2
3
4
5
6
7
8
9
@RequestMapping(value =
"getPeopleById"
, produces =
"application/json"
)
@ResponseBody
public
Map<String, Object> getPeopleById(@RequestBody Map<String, Object> body){
System.out.println(
""
+body.get(
"id"
));
People people = peopleService.getPeopleById(Integer.valueOf((String)body.get(
"id"
)));
Map<String, Object> map =
new
HashMap<String, Object>();
map.put(
"result"
, people);
return
map;
}
</code></pre>
详解: @RequestBody 该注解首先读取request请求的正文数据,然后使用默认配置的HttpMessageConverter进行解析,把数据绑定要对象上面,然后再把对象绑定到controllor中的参数上。 @ResponseBody 该注解也是一样的用于将Controller的方法返回的对象,通过的HttpMessageConverter转换为指定格式后,写入到Response对象的body数据区。
Srping mvc .xml(配置转换器) <code>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<!-- spring MVC提供的适配器 spring默认加载 (如果不修改默认加载的4类转换器,该bean可不配置)-->
<bean
class
=
"org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter"
>
<property name=
"messageConverters"
>
<!-- 该适配器默认加载以下4类转换器-->
<list>
<bean
class
=
"org.springframework.http.converter.BufferedImageHttpMessageConverter"
/>
<bean
class
=
"org.springframework.http.converter.ByteArrayHttpMessageConverter"
/>
<bean
class
=
"org.springframework.http.converter.xml.SourceHttpMessageConverter"
/>
<bean
class
=
"org.springframework.http.converter.xml.XmlAwareFormHttpMessageConverter"
/>
<bean
class
=
"org.springframework.http.converter.StringHttpMessageConverter"
/>
<bean
class
=
"org.springframework.http.converter.json.MappingJacksonHttpMessageConverter"
>
<property name=
"supportedMediaTypes"
>
<list>
<value>application/json;charset=UTF-8</value>
</list>
</property>
</bean><!--这里配置了json转换器支持的媒体类型-->
</list>
</property>
</bean>
</code>ByteArrayHttpMessageConverter : 负责读取二进制格式的数据和写出二进制格式的数据;StringHttpMessageConverter : 负责读取字符串格式的数据和写出二进制格式的数据;ResourceHttpMessageConverter :负责读取资源文件和写出资源文件数据;FormHttpMessageConverter : 负责读取form提交的数据MappingJacksonHttpMessageConverter : 负责读取和写入json格式的数据;SouceHttpMessageConverter : 负责读取和写入 xml 中javax.xml.transform.Source定义的数据;Jaxb2RootElementHttpMessageConverter : 负责读取和写入xml 标签格式的数据;AtomFeedHttpMessageConverter : 负责读取和写入Atom格式的数据;RssChannelHttpMessageConverter : 负责读取和写入RSS格式的数据;
项目里面我用到的只有json转换器,所以要导入关于json的包(maven):
1
2
3
4
5
6
7
8
9
10
11
12
<code>
<dependency>
<groupId>org.codehaus.jackson</groupId>
<artifactId>jackson-core-asl</artifactId>
<version>1.9.11</version>
</dependency>
<dependency>
<groupId>org.codehaus.jackson</groupId>
<artifactId>jackson-mapper-asl</artifactId>
<version>1.9.11</version>
</dependency>
</code>
同样controller中参数也能以实体类的方式接收数据, 开始一直报(415 Unsupported media type)的错误是因为配置文件没有写对也没导入相应的包。 如果有哪里不足或错误的地方望提出,谢谢_
想了解更多编程学习,敬请关注php培训栏目!
以上就是介绍Spring中ajax与后台传输数据的几种方式 的详细内容,更多文章请关注木庄网络博客 !
相关阅读 >>
ajax异步是什么
jquery ajax区别是什么
使用layui框架封装ajax模块的具体步骤
ajax获取网页添加到div中的方法
如何解决jquery ajax乱码问题
ajax完整详细教程(一)
如何解决jquery ajax中文乱码问题
详解ajax实现excel报表导出
ajax 如何实现 excel 报表导出?
ajax实现简单登录页面详解
更多相关阅读请进入《spring 》频道 >>
¥83.86元 人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » 介绍Spring中ajax与后台传输数据的几种方式