Java运用JSON实现后台与前端分工合作(代码实例)

一、前言

      最近在写我们实验室网站内部交流平台,后台架构用的Spring + SpringMVC + Mabatis(数据库框架)整合框架,作为后台人员,与数据库交互、处理业务逻辑已经驾轻就熟,但与前端合作就显得不是那么熟练了。

举一个小例子,一个用户列表,我们从数据库取出来是一个List<User>,但它在前端显示就是一个很炫酷的用户列表,我们后台人员是需要把数据以表格样式呈现然后让前端人员去加样式呢,还是前端做好样式留出接口由后台人员给出数据呢?

刚刚接触网站开发可能都会出现类似的问题,我们是多希望前端和后台的工作分的清清楚楚啊!

其实不用想那么复杂,JSON就可以帮我们!

后台只需告诉前端,请求某一个URL地址就可以得到用户数据的JSON格式的数据,前端在需要的时候自己去请求就好,剩下的工作就由前端做就好了,清清楚楚,干干净净!


二、准备工作

jar包准备

CSDN很强大,好人也是很多的哈,希望大家多多分享,共同进步哈……下面的jar包下载地址是可以的……

http://download.csdn.net/detail/zhangy0329/607838


三、代码实例

一段controller控制器的拦截器代码(注释解释的很详细的)

[java]  view plain  copy
  1. <span style="white-space:pre">    </span>/** 
  2.      * 测试获取所有用户列表 
  3.      * @param request 
  4.      * @return String 
  5.      * @throws IOException  
  6.      */  
  7.     @RequestMapping("/getAllUserTest")  
  8.     public String getAllUserTest(HttpServletRequest request, HttpServletResponse response) throws IOException{  
  9.           
  10.         //从数据库中取出所有用户信息,返回值为一个User对象集合,每个User对象包含username与age两个参数  
  11.         List<User> findAll = userService.findAll();  
  12.           
  13.         //创建JSONArray实例  
  14.         JSONArray jsonArray = new JSONArray();  
  15.         //for each循环取出每个User对象  
  16.         for(User user: findAll)  
  17.         {  
  18.             //JSONObject是一个{}包裹起来的一个对象(Object),  
  19.             //JSONArray则是[]包裹起来的一个数组(Array)  
  20.             //此处为对象,所以用得到JSONObject  
  21.              JSONObject jo = new JSONObject();  
  22.              jo.put("username", user.getUsername());  
  23.              jo.put("age", user.getAge());  
  24.              jsonArray.add(jo);  
  25.         }  
  26.         try {  
  27.              //后台输出测试  
  28.              System.out.println(jsonArray.toString());  
  29.              //设置字符集  
  30.              response.setCharacterEncoding("UTF-8");  
  31.              //页面输出  
  32.              response.getWriter().println("JSON输出形式:");  
  33.              response.getWriter().write(jsonArray.toString());  
  34.                
  35.          } catch (IOException e) {  
  36.              e.printStackTrace();  
  37.          }  
  38.          return null;  
  39.     }  
  40.       

那么前端请求相应的URL就可以得到所有的用户信息了!

效果如下:




如果可以的话,项目做到一定程度后会吧整个项目源码共享的,当然现在只有测试demo啦,谢谢大家!

猜你喜欢

转载自blog.csdn.net/qq_36544760/article/details/79883764
今日推荐