blog--用Json来做前后台数据交互

JavaEE——SpringMVC（8）--处理 JSON：使用 HttpMessageConverter 可做下载

使用@ResponseBody注解

从后台获取List<Blog> 传递给前端。并解析

 @RequestMapping(value = "/testJson", method = RequestMethod.POST)
    public @ResponseBody List<Blog> testJson(HttpServletRequest request){
        String id = request.getParameter( "id" );
        Integer userId = Integer.valueOf( id );
        List<Blog> blog = blogService.findAllBlogByUserId( userId );


        /*JSONArray jsonArray = JSONArray.fromObject(blog);*/
        /*JSONObject jsonObject = JSONObject.fromObject( blog );*/
        return blog;
    }

前端将获取到的List数据解析为想要的格式

可使用JavaScript JSON.stringify() 来进行

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>

<p id="demo"></p>
<script>
var str = {"name":"菜鸟教程", "site":"http://www.runoob.com"}
str_pretty1 = JSON.stringify(str)
document.write( "只有一个参数情况：" );
document.write( "<br>" );
document.write("<pre>" + str_pretty1 + "</pre>" );
document.write( "<br>" );
str_pretty2 = JSON.stringify(str, null, 4) //使用四个空格缩进
document.write( "使用参数情况：" );
document.write( "<br>" );
document.write("<pre>" + str_pretty2 + "</pre>" ); // pre 用于格式化输出
</script>

</body>
</html>

输出结果

只有一个参数情况：
{"name":"菜鸟教程","site":"http://www.runoob.com"}

使用参数情况：
{
    "name": "菜鸟教程",
    "site": "http://www.runoob.com"
}

<button id="blogType">test Json</button>
<script>

    document.getElementById('blogType').addEventListener('click', function () {
        var userId = <%--${sessionScope.user.id};--%>
        $.ajax({
            type: "post",
            url: "/blogType/allBlogType",
            data: {id:JSON.stringify(userId)},
            dataType: "json",
//            contentType: "application/json",
            success: function(data){
                $.each(data, function(i, item){
                    var json1 = JSON.stringify(item, null, 4);
                    console.log(json1);
                    $.each(item, function(j, val){
                    });
                });
            }
        });
    }, false)
</script>

在Controller处

@Controller
@RequestMapping("/blogType")
public class BlogTypeController {

    @Autowired
    BlogTypeService blogTypeService;

    @RequestMapping(value = "/allBlogType")
    public @ResponseBody List<BlogType> allBlogType(HttpServletRequest request){
        String id = request.getParameter( "id" );
        Integer userId = Integer.parseInt(id);
        List<BlogType> blog =  blogTypeService.allBlogType( userId );
        for(BlogType i : blog){
            System.out.println(i);
        }
        return blog;
    }
}