springmvc 返回json数据给前台jsp页面展示

　　　　　　　　　　　　　　　　　　　　　　　　spring mvc返回json字符串的方式

方案一：使用@ResponseBody 注解返回响应体直接将返回值序列化json

优点：不需要自己再处理

步骤一：在spring-servlet.xml文件中配置如下代码

<?xml version="1.0" encoding="UTF-8"?>

<beans xmlns="http://www.springframework.org/schema/beans"


    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"


    xmlns:p="http://www.springframework.org/schema/p"


     xmlns:mvc="http://www.springframework.org/schema/mvc"


    xmlns:context="http://www.springframework.org/schema/context"


    xsi:schemaLocation="


        http://www.springframework.org/schema/beans


        http://www.springframework.org/schema/beans/spring-beans.xsd


        http://www.springframework.org/schema/context


        http://www.springframework.org/schema/context/spring-context.xsd


        http://www.springframework.org/schema/mvc


        http://www.springframework.org/schema/mvc/spring-mvc.xsd ">

 <span style="color: #008000">&lt;!--</span><span style="color: #008000">使用Annotation方式 完成映射  </span><span style="color: #008000">--&gt;</span></br>

 <span style="color: #008000">&lt;!--</span><span style="color: #008000">让spring扫描包下所有的类，让标注spring注解的类生效  </span><span style="color: #008000">--&gt;</span></br>

 <span style="color: #0000ff">&lt;</span><span style="color: #800000">context:component-scan </span><span style="color: #ff0000">base-package</span><span style="color: #0000ff">="cn.yxj.controller"</span><span style="color: #0000ff">/&gt;</span></br>

 <span style="color: #0000ff">&lt;</span><span style="color: #800000">mvc:annotation-driven</span><span style="color: #0000ff">/&gt;</span>  </br>

 <span style="color: #008000">&lt;!--</span><span style="color: #008000">视图解析器  </span><span style="color: #008000">--&gt;</span></br>

 <span style="color: #0000ff">&lt;</span><span style="color: #800000">bean </span><span style="color: #ff0000">class</span><span style="color: #0000ff">="org.springframework.web.servlet.view.InternalResourceViewResolver"</span><span style="color: #0000ff">&gt;</span></br>

 <span style="color: #0000ff">&lt;</span><span style="color: #800000">property </span><span style="color: #ff0000">name</span><span style="color: #0000ff">="prefix"</span><span style="color: #ff0000"> value</span><span style="color: #0000ff">="/WEB-INF/jsp/"</span><span style="color: #0000ff">&gt;&lt;/</span><span style="color: #800000">property</span><span style="color: #0000ff">&gt;</span></br>

 <span style="color: #0000ff">&lt;</span><span style="color: #800000">property </span><span style="color: #ff0000">name</span><span style="color: #0000ff">="suffix"</span><span style="color: #ff0000"> value</span><span style="color: #0000ff">=".jsp"</span><span style="color: #0000ff">&gt;&lt;/</span><span style="color: #800000">property</span><span style="color: #0000ff">&gt;</span>

 <span style="color: #0000ff">&lt;/</span><span style="color: #800000">bean</span><span style="color: #0000ff">&gt;</span></br>


</beans>

步骤二：在处理器方法中打上@ResponseBody 标签

@RequestMapping(value="/hello5.do")


    @ResponseBody


    public String hello(HttpServletResponse response) throws IOException{


        UserInfo u1=new UserInfo();


        u1.setAge(15);


        u1.setUname("你好");


    UserInfo u2</span>=<span style="color: #0000ff">new</span><span style="color: #000000"> UserInfo();</br>

    u2.setAge(</span>152<span style="color: #000000">);</br>

    u2.setUname(</span>"你好2"<span style="color: #000000">);</br>

    Map</span>&lt;String,UserInfo&gt; map=<span style="color: #0000ff">new</span> HashMap&lt;String, UserInfo&gt;<span style="color: #000000">();</br>

    map.put(</span>"001"<span style="color: #000000">, u1);</br>

    map.put(</span>"002"<span style="color: #000000">, u2);</br>

    String jsonString </span>=<span style="color: #000000"> JSON.toJSONString(map);</br>

    </span><span style="color: #0000ff">return</span><span style="color: #000000"> jsonString;</br>

}</span></pre>

步骤三：使用ajax进行获取数据

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%


String path = request.getContextPath();


String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">


<html>



<head>



<base href="<%=basePath%>">


<span style="color: #0000ff">&lt;</span><span style="color: #800000">title</span><span style="color: #0000ff">&gt;</span>My JSP 'index.jsp' starting page<span style="color: #0000ff">&lt;/</span><span style="color: #800000">title</span><span style="color: #0000ff">&gt;</span></br></br>

<span style="color: #0000ff">&lt;</span><span style="color: #800000">script </span><span style="color: #ff0000">type</span><span style="color: #0000ff">="text/javascript"</span><span style="color: #ff0000"> src</span><span style="color: #0000ff">="js/jquery-1.8.3.js"</span><span style="color: #0000ff">&gt;&lt;/</span><span style="color: #800000">script</span><span style="color: #0000ff">&gt;</span></br>

<span style="color: #0000ff">&lt;</span><span style="color: #800000">script </span><span style="color: #ff0000">type</span><span style="color: #0000ff">="text/javascript"</span><span style="color: #0000ff">&gt;</span><span style="background-color: #f5f5f5; color: #000000"></br>

  $(</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">(){

     $(</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">#btn</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">).click(</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">(){</br>

         $.ajax({</br>

           url:</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">&lt;%=path%&gt;/Five.do</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">,</br>

           success:</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">(data){ </br>

           </span><span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">解析对象</span></br>

           <span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">alert(data.uname+"\n"+data.age);</span></br>

           <span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">解析map</span></br>

           <span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">alert(data.info.age+"\n"+data.info.uname);</span></br>

           <span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">解析list</span></br>


$.each(data,function(i,dom){



alert(dom.uname+"\n"+dom.age);



});



}



});


});



});



</script>



</head>


<body>



<input type="button" value="ajax" id="btn"/>

</body>



</html>

方案二：处理器方法的返回值---Object

　　由于返回Object数据，一般都是将数据转化为JSON对象后传递给浏览器页面的，而这个由Object转换为Json，是由Jackson工具完成的，所以要导入jar包，将Object数据转化为json数据，需要Http消息

　　转换器 HttpMessageConverter完成。而转换器的开启，需要由<mvc:annotation-driven/> 来完成，当spring容器进行初始化过程中，在<mvc:annotation-driven/> 处创建注解驱动时，默认创

　　建了七个HttpMessageConverter对象，也就是说，我们注册<mvc:annotation-driven/>，就是为了让容器帮我们创建HttpMessageConverter对象

详细代码看

方案二、使用返回字符串的处理器方法，去掉@ResponseBody注解

步骤一、同上

步骤二

@RequestMapping(value="/hello5.do")


    public String hello(HttpServletResponse response) throws IOException{


        UserInfo u1=new UserInfo();


        u1.setAge(15);


        u1.setUname("你好");


    UserInfo u2</span>=<span style="color: #0000ff">new</span><span style="color: #000000"> UserInfo();</br>

    u2.setAge(</span>152<span style="color: #000000">);</br>

    u2.setUname(</span>"你好2"<span style="color: #000000">);</br>

    Map</span>&lt;String,UserInfo&gt; map=<span style="color: #0000ff">new</span> HashMap&lt;String, UserInfo&gt;<span style="color: #000000">();</br>

    map.put(</span>"001"<span style="color: #000000">, u1);</br>

    map.put(</span>"002"<span style="color: #000000">, u2);</br>

    String jsonString </span>=<span style="color: #000000"> JSON.toJSONString(map);</br>

    </span><span style="color: #0000ff">return</span><span style="color: #000000"> jsonString;</br>

}</span></pre>

步骤三、在前台取值的时候需要我么做一遍处理

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%


String path = request.getContextPath();


String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";



%>



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">


<html>



<head>



<base href="<%=basePath%>">


<span style="color: #0000ff">&lt;</span><span style="color: #800000">title</span><span style="color: #0000ff">&gt;</span>My JSP 'index.jsp' starting page<span style="color: #0000ff">&lt;/</span><span style="color: #800000">title</span><span style="color: #0000ff">&gt;</span></br></br>

<span style="color: #0000ff">&lt;</span><span style="color: #800000">script </span><span style="color: #ff0000">type</span><span style="color: #0000ff">="text/javascript"</span><span style="color: #ff0000"> src</span><span style="color: #0000ff">="js/jquery-1.8.3.js"</span><span style="color: #0000ff">&gt;&lt;/</span><span style="color: #800000">script</span><span style="color: #0000ff">&gt;</span>

<span style="color: #0000ff">&lt;</span><span style="color: #800000">script </span><span style="color: #ff0000">type</span><span style="color: #0000ff">="text/javascript"</span><span style="color: #0000ff">&gt;</span><span style="background-color: #f5f5f5; color: #000000"></br>

  $(</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">(){</br>

     $(</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">#btn</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">).click(</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">(){</br>

         $.ajax({</br>

           url:</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">&lt;%=path%&gt;/hello5.do</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">,</br>

           success:</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">(data){ </span><span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">data指的是从server打印到浏览器的数据</span></br>

               <span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">jsonString jsonObject</span></br>

               <span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">{"001":{"age":122,"name":"顺利就业"}}</span></br>

              <span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> result</span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> eval(</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">(</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">data</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">)</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">);</br>

               $.each(result,</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">(i,dom){</br>

                  alert(dom.age</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">\n</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000">dom.uname);</br>

               });</br>

            </span><span style="background-color: #f5f5f5; color: #008000">//</span><span style="background-color: #f5f5f5; color: #008000">  alert(result["001"]["age"]);</span>


}



});



});



});



</script>



</head>


<body>



<input type="button" value="ajax" id="btn"/>


</body>



</html>

方案三：使用无返回值的处理器方法

步骤一：同上

步骤二：使用响应流回送数据

@RequestMapping(value="/hello5.do")


    public void hello(HttpServletResponse response) throws IOException{


        UserInfo u1=new UserInfo();


        u1.setAge(15);


        u1.setUname("你好");


    UserInfo u2</span>=<span style="color: #0000ff">new</span><span style="color: #000000"> UserInfo();</br>

    u2.setAge(</span>152<span style="color: #000000">);</br>

    u2.setUname(</span>"你好2"<span style="color: #000000">);</br>

    Map</span>&lt;String,UserInfo&gt; map=<span style="color: #0000ff">new</span> HashMap&lt;String, UserInfo&gt;<span style="color: #000000">();</br>

    map.put(</span>"001"<span style="color: #000000">, u1);</br>

    map.put(</span>"002"<span style="color: #000000">, u2);</br>

    String jsonString </span>=<span style="color: #000000"> JSON.toJSONString(map);</br>

    response.setCharacterEncoding(</span>"utf-8"<span style="color: #000000">);

    response.getWriter().write(jsonString);</br>

    response.getWriter().close();</br>

    </br>

}</span></pre>

步骤三：在前台取值也需要做处理

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">



<html>



<head>



<base href="<%=basePath%>">


&lt;title&gt;My JSP 'index.jsp' starting page&lt;/title&gt;</br></br>

&lt;script type="text/javascript" src="js/jquery-1.8.3.js"&gt;&lt;/script&gt;</br>

&lt;script type="text/javascript"&gt;<span style="color: #000000">

  $(function(){</br>

     $(</span>"#btn"<span style="color: #000000">).click(function(){</br>

         $.ajax({</br>

           url:</span>"&lt;%=path%&gt;/hello5.do"<span style="color: #000000">,

           success:function(data){ </span><span style="color: #008000">//</span><span style="color: #008000">data指的是从server打印到浏览器的数据</br>

               </span><span style="color: #008000">//</span><span style="color: #008000">jsonString jsonObject</br>

               </span><span style="color: #008000">//</span><span style="color: #008000">{"001":{"age":122,"name":"顺利就业"}}</span></br>

              var result= eval("("+data+")"<span style="color: #000000">);</br>

               $.each(result,function(i,dom){</br>

                  alert(dom.age</span>+"\n"+<span style="color: #000000">dom.uname);</br>

                  </br>

               });</br>

            </span><span style="color: #008000">//</span><span style="color: #008000">  alert(result["001"]["age"]);</span></br>


}



});


});


});


</script>



</head>

<body>



<input type="button" value="ajax" id="btn"/>

</body>



</html>

springmvc 返回json数据给前台jsp页面展示的更多相关文章

【Spring学习笔记-MVC-4】SpringMVC返回Json数据-方式2
<Spring学习笔记-MVC>系列文章,讲解返回json数据的文章共有3篇,分别为: [Spring学习笔记-MVC-3]SpringMVC返回Json数据-方式1:http://www ...
【Spring学习笔记-MVC-3】SpringMVC返回Json数据-方式1
<Spring学习笔记-MVC>系列文章,讲解返回json数据的文章共有3篇,分别为: [Spring学习笔记-MVC-3]SpringMVC返回Json数据-方式1:http://www ...
【Spring学习笔记-MVC-3.1】SpringMVC返回Json数据-方式1-扩展
<Spring学习笔记-MVC>系列文章,讲解返回json数据的文章共有3篇,分别为: [Spring学习笔记-MVC-3]SpringMVC返回Json数据-方式1:http://www ...
SpringMVC返回JSON数据时日期格式化问题
https://dannywei.iteye.com/blog/2022929 SpringMVC返回JSON数据时日期格式化问题博客分类: Spring 在运用SpringMVC框架开发时,可 ...
springMVC返回json数据乱码问题及@RequestMapping 详解
原文地址:https://blog.csdn.net/u010127245/article/details/51774074 一.@RequestMapping RequestMapping是一个用来 ...
springMVC返回json数据乱码问
在springMVC controller中返回json数据出现乱码问题,因为没有进行编码,只需要简单的注解就可以了在@RequestMapping()中加入produces="text/ ...
SpringMVC——返回JSON数据&&文件上传下载
--------------------------------------------返回JSON数据------------------------------------------------ ...
关于springmvc 返回json数据null字段的显示问题-转https://blog.csdn.net/qq_23911069/article/details/62063450
最近做项目(ssm框架)的时候,发现从后台返回的json(fastjson)数据对应不上实体类,从数据库查询的数据,如果对应的实体类的字段没有信息的话,json数据里面就不显示,这不是我想要的结果,准 ...
Response返回JSON数据到前台页面
转自博文:<Response JSON数据返回>http://blog.csdn.net/anialy/article/details/8665471 简述: 在servlet填充Resp ...

随机推荐

MySQL忘记root密码重置密码（5.7版本）
网上找了一堆方法都不行,经过折腾一番,发现MySQL不同版本重置密码也存在一定的差异!记录下Mysql5.7.18版本的重置密码方法. 1.找到/etc/mysql/my.cnf 修改此文件添加一行s ...
阿里云SaaS生态战略发布：成就亿级营收独角兽
导语:本文中,阿里云智能资深技术专家黄省江从“势”“道”“术”三个方面分享了自己对于SaaS生态的理解,并介绍了SaaS加速器发布以来在产品.技术和商业侧最新的一些进展. 在321北京峰会上,阿里云公 ...
H5C3--语义标签以及语义标签IE8兼容，表单元素新属性，度量器，自定义属性，dataList,网络监听，文件读取
HTML5新增标签以及HTML5新增的api 1.H5并不是新的语言,而是html语言的第五次重大修改--版本 2.支持:所有的主流浏览器都支持h5.(chrome,firefox,s ...
laravel-admin
laravel-admin 文档地址: http://laravel-admin.org/docs/#/zh/
介绍vue项目中的axios请求（get和post）
一.先安装axios依赖,还有qs依赖 npm install axios --save npm install qs --save qs依赖包用post请求需要用到的插入一个知识点: npm in ...
Vue源码探究-数据绑定的实现
Vue源码探究-数据绑定的实现本篇代码位于vue/src/core/observer/ 在总结完数据绑定实现的逻辑架构一篇后,已经对Vue的数据观察系统的角色和各自的功能有了比较透彻的了解,这一篇继 ...
Leetcode766.Toeplitz Matrix托普利茨矩阵
如果一个矩阵的每一方向由左上到右下的对角线上具有相同元素,那么这个矩阵是托普利茨矩阵. 给定一个 M x N 的矩阵,当且仅当它是托普利茨矩阵时返回 True. 示例 1: 输入: matrix = ...
nth-child和nth-of-type的使用案列
HTML: <div id="footer-f"> <ul class="trajectory"> <li> <div ...
【JZOJ4896】【NOIP2016提高A组集训第16场11.15】兔子
题目描述在一片草原上有N个兔子窝,每个窝里住着一只兔子,有M条路径连接这些窝.更特殊地是,至多只有一个兔子窝有3条或更多的路径与它相连,其它的兔子窝只有1条或2条路径与其相连.换句话讲,这些兔子窝之 ...
Precision和Recall
学习自: http://blog.csdn.net/wangran51/article/details/7579100

springmvc 返回json数据给前台jsp页面展示

springmvc 返回json数据给前台jsp页面展示的更多相关文章

随机推荐

热门专题