欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Spring mvc,jQuery和JSON数据交互实例讲解

程序员文章站 2022-11-18 10:10:13
二、实验例子编写 1、请求和返回都是JSON a).程序发起 index.jsp的一个按钮 b).js函数 function requestByJso...

二、实验例子编写

1、请求和返回都是JSON

a).程序发起

index.jsp的一个按钮

Spring mvc,jQuery和JSON数据交互实例讲解

b).js函数

Spring mvc,jQuery和JSON数据交互实例讲解

function requestByJson() {

$.ajax({

type : 'post',

url : '${pageContext.request.contextPath}/jsonsource.action',

//设置contentType类型为json

contentType : 'application/json;charset=utf-8',

//json数据

data : '{"username":"reader001","password":"psw001"}',

//请求成功后的回调函数

success : function(data) {

alert(data.username);

}

});

}

c).Controller/Mapping

@RequestMapping("/jsonsource")

//@RequestBody 将json对象转成java对象

//@ResponseBody 表示返回的是json对象

public @ResponseBody User jsonSource(@RequestBody User user){

return user;

}

d).测试结果

查看浏览器的开发者工具信息

request

Spring mvc,jQuery和JSON数据交互实例讲解
Spring mvc,jQuery和JSON数据交互实例讲解

response

Spring mvc,jQuery和JSON数据交互实例讲解

PS:User类有3个属性,id,username,password。

回调函数使用alert(data.username);

Spring mvc,jQuery和JSON数据交互实例讲解

2、请求是key/value值,返回JSON

a).程序发起

Spring mvc,jQuery和JSON数据交互实例讲解

b).js函数

//请求是key-value的值,返回的是json

function resquestByKV() {

$.ajax({

type : 'post',

url : '${pageContext.request.contextPath}/kvsource.action',

data : 'username=kvuser&password=kvpsw',

success : function(data) {

alert(data.username);

}

});

}

c).Controller/Mapping

Spring mvc,jQuery和JSON数据交互实例讲解

参数没有@RequestBody。

d).测试结果

参考1。

三、提交表单数据,返回json结果。

1、实验准备和预测

设计两个form,将form1的数据提交后,做一定的处理后返回到form2。处理结果依据controller。

Spring mvc,jQuery和JSON数据交互实例讲解
Spring mvc,jQuery和JSON数据交互实例讲解

2、将数据作为json发出

a).JS函数

Spring mvc,jQuery和JSON数据交互实例讲解

b).Controller

Spring mvc,jQuery和JSON数据交互实例讲解

c).结果

Spring mvc,jQuery和JSON数据交互实例讲解

实验过程,发现如果要传递json数据(java程序传出),由于json的字符串要在双引号中,要达到双引号的效果,引号较混乱。

3、将数据作为key/value的形式发出。

a).JS函数

Spring mvc,jQuery和JSON数据交互实例讲解

b).Controller

Spring mvc,jQuery和JSON数据交互实例讲解

c).结果

Spring mvc,jQuery和JSON数据交互实例讲解

四、Spring mvc和ajax中文乱码问题

1、返回的java对象

如果是java对象作为json对象返回的话,不需要设置过滤器,spring的配置文件也没有设置字符编码,中文正常返回。估计是json的支持包或spring有编码的设置。

2、返回字符串

例子请求的是这个方法

Spring mvc,jQuery和JSON数据交互实例讲解

a).设置filter字符编码

spring的字符过滤器org.springframework.web.filter.CharacterEncodingFilter

无效,是乱码。显示如下

Spring mvc,jQuery和JSON数据交互实例讲解

b).解决方法一、@ResponseBody

加上produces。如produces="application/json; charset=utf-8"。

Spring mvc,jQuery和JSON数据交互实例讲解

设置后没有乱码

Spring mvc,jQuery和JSON数据交互实例讲解

c).解决方法二、mvc:annotation-driven

这个方法是针对所有。

在mvc:annotation-driven加上下面的StringHttpMessageConverter

主要是text/html;charset=UTF-8就可以,其他都不可以。避免乱码。

text/html;charset=UTF-8

发现:再去掉注解中的参数produces="application/json; charset=utf-8",然后测试。supportedMediaTypes加入text/html;charset=UTF-8能解决乱码。且java对象的json返回也没有出现乱码问题。