ssm从前台接收数据_SSM将后台获取的数据转换成json格式传递到前台页面

本文介绍了在SSM框架下如何从前台接收数据,并将后台获取的数据库信息转换成JSON格式传回给前端页面。主要方法包括使用@ResponseBody注解和PrintWriter,文中详细展示了代码实现,并强调了所需依赖的JSON库和相关jar包。最后,通过jQuery的ajax方法在前端解析JSON数据。
摘要由CSDN通过智能技术生成

1、后台从数据库中获取数据,传递到response中

这一步折腾了我一整天,不知道是因为没有传递到response中还是其他的原因,在前台获取的data,使用alert(data)输出的一直为空值或null

有两种方式可以实现这一步。一是利用注解@ResponseBody,二是利用PrintWriter。最终我是通过@ResponseBody成功完成了这一步,而不知道为什么利用PrintWriter总是写不成功,具体的原因我后面再研究研究吧。下面来介绍下这两种实现方式:

(1)@ResponseBody,即将方法返回值写到response对象中,代码如下:

[java] view plain

copy

        @RequestMapping("/addAction.do")

@ResponseBody//将返回结果写到response中

public String save(HttpServletRequest request,HttpServletResponse response,Model model,@RequestParam(value="photo",required=false)MultipartFile filedata) throws IllegalArgumentException, IllegalAccessException{

//PrintWriter out=null;

if(filedata!=null&&!filedata.isEmpty()){

//获取图片的文件名

String fileName=filedata.getOriginalFilename();

//获取图片的扩展名

String extensionName=fileName.substring(fileName.lastIndexOf(".")+1);

//新的图片名=获取时间戳+"."图片扩展名

String newFileName=String.valueOf(System.currentTimeMillis())+"."+extensionName;

System.out.println(picUrl);

//将图片上传到服务器

//saveFile(newFileName,filedata);

saveFile(fileName,filedata);

//将图片名称保存至数据库

//photoService.insert(fileName);

}

JSONArray jsonArray=new JSONArray();

for(int i=10;i<30;i++){

Photo p=photoService.getPhotoById(new BigDecimal(i));

jsonArray.add(p);

}

//获取单个json对象

/*JSONObject json=null;

Photo p1=photoService.getPhotoById(new BigDecimal(3));

json=JSONObject.fromObject(p1);*/

return jsonArray.toString();

}

这里我是利用net.sf.json.JSONArray;将从数据库读取的对象转换成了json格式。

说到这里,就要提下,要导入的jar包

要使程序可以运行必须引入JSON-lib包,JSON-lib包同时依赖于以下的JAR包:

[html] view plain

copy

commons-lang.jar

commons-beanutils.jar

commons-collections.jar

commons-logging.jar

ezmorph.jar

json-lib-2.2.2-jdk15.jar

这几个jar包缺一不可,不然会报错。

我的maven中pom.xml文件的配置如下:

[html] view plain

copy

net.sf.json

json-lib

2.2.2

commons-beanutils

common-beanu

1.0

commons-collections

commons-collections

3.2.1

commons-logging

commons-logging

1.1.1

commons-lang

commons-lang

2.1

ezmorph

ezmorph

1.0.6

(2) 利用PrintWriter实现如下:

[java] view plain

copy

                 response.setCharacterEncoding("UTF-8");

response.setHeader("Cache-Control", "no-cache");

response.setContentType("application/json");

PrintWriter out=null;

try {

out=response.getWriter();

out.print(json.toString());

out.flush();

out.close();

} catch (IOException e) {

e.printStackTrace();

}

2、前台获取获取后台传递的json数据,利用jquery的ajax,代码如下:

[html] view plain

copy

        function photo(){

var val;

$.ajax({

async:false,

type:'get',//get是获取数据,post是带数据的向服务器发送请求

url:'addAction.do',

dataType:'json',

success:function(data){

val=eval(data);//转换成js对象

alert(val[2].name);

alert(data);

},

error:function(data){

alert("JSON数据获取失败,请联系管理员!");

}

});

}

主要是把ajax的相关参数弄明白,上述获取数据的过程也就清楚了。

3、将json字符串解析为js对象,获取对象的相关值

[html] view plain

copy

val=eval(data);//转换成js对象

alert(val[2].name);这一行代码便可以获取对应的name值。

感觉这三步写起来很简单,但是在实现过程中,我还是思考了很久的,主要是第一步的过程一直不行,导致第二步获得的值为空,这里总结下希望以后

不会再在这个地方卡住,通过这个过程,我也明白了SSM前台和后台交互的过程。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值