Struts2中使用JSON可以更容易实现数据的异步



网上关于这方面的资料也不少,但多半是struts1的,在Struts2中使用JSON可以更容易实现数据的异步传输。

先做好准备工作:

1.Struts2相关lib, 注意将struts2 lib下面的以json开头的包也加入到工程。

2.JSON Plugin,它可以将Struts2 Action中的结果直接返回为JSON。下载地址:http://jsonplugin.googlecode.com/files/jsonplugin-0.34.jar (支持struts2.1.6及以上版本)。

3.JQuery,JS的一个lib. 下载地址:http://www.jquery.com (最新版本为1.3.2)。

 

准备工作都做好之后,我们可以开始了。建一个WEB工程,把相关的包加入到工程。我们需要做的就是三件事:

一、准备一个JSP页面用于提交ajax请求,这里我使用了JQuery的$.getJSON(url,params,function callback(data))函数提交ajax请求到指定url,并且携带参数params,最后用一个回调函数callback处理请求返回结果data;

二、一个处理请求的Action类,并在struts.xml文件中做相应配置:写一个action类处理ajax请求数据,并将返回结果封装成一个JSONObject对象返回给请求页面。同时在struts.xml中配置对应action,指明其返回类型为json并使其package的extends为json-default,并将要返回请求页面的数据放在名为root的param中,如<param name=”root”>result</param>。


三、接受请求返回结果:使用JS的eval方法将返回结果data转换成JSON对象,并处理返回结果。

具体参见以下代码:

// login.jsp 使用getJSON方法提交ajax请求,并处理请求返回结果。注意请求的url为login.html这是因为我将struts2.preperties中的struts.action.extension改成了htm,默认为action。l

Html代码 复制代码 收藏代码
  1. <%@ page language=”java” contentType=”text/html; charset=UTF-8″
  2.     pageEncoding=”UTF-8″%>
  3. <%@ taglib uri=”/struts-tags” prefix=”s”%>
  4. <!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
  5. <html>
  6. <head>
  7. <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″>
  8. <title><s:text name=”page.title.login” /></title>
  9. <script type=”text/javascript” src=”jquery-1.3.2.js”></script>
  10. <script type=”text/javascript” language=”javascript”>
  11. $(document).ready(function(){
  12.     $(“#login”).click(function(){
  13.         login();
  14.         });
  15. });
  16. function login(){
  17.     var url = “login.html”;
  18.     var params = {“user.logName”:$(“#name”).attr(“value”),”user.password”:$(“#password”).attr(“value”)};
  19.     $.getJSON(url,params,function callback(data){
  20.         // convert to json object
  21.         var user = eval(“(“+data+”)”);//
  22.         $(“#result”).each(function(){
  23.             $(this).html(‘welcome ,’ + user.name);
  24.             });
  25.         });
  26.     }
  27. </script>
  28. </head>
  29. <body>
  30. <s:actionmessage/>
  31. <form  method=”post” id=”form”><s:text
  32.     name=”user.label.name” />:<input type=”textbox” name=”user.logName” id=”name”
  33.     value=’${param["user.logName"]}’ /><br>
  34. <s:text name=”user.label.password” />:<input type=”password” id=”password”
  35.     name=”user.password” /><br>
  36. <input type=”button” id=”login” value=’<s:text name=”button.label.login” />’ /></form>
  37. <div id=”result”>
  38. </div>
  39. </body>
  40. </html>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title><s:text name="page.title.login" /></title>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function(){
	$("#login").click(function(){
		login();
		});
});

function login(){
	var url = "login.html";
	var params = {"user.logName":$("#name").attr("value"),"user.password":$("#password").attr("value")};

	$.getJSON(url,params,function callback(data){
		// convert to json object
		var user = eval("("+data+")");//

		$("#result").each(function(){
			$(this).html('welcome ,' + user.name);
			});
		});
	}
</script>
</head>
<body>
<s:actionmessage/>
<form  method="post" id="form"><s:text
	name="user.label.name" />:<input type="textbox" name="user.logName" id="name"
	value='${param["user.logName"]}' /><br>
<s:text name="user.label.password" />:<input type="password" id="password"
	name="user.password" /><br>
<input type="button" id="login" value='<s:text name="button.label.login" />' /></form>
<div id="result">

</div>
</body>
</html>

 

// struts.xml  注意package的extends属性与result的type属性。result为userAction的一个属性,这里将结果返回给ajax的请求页面。

Java代码 复制代码 收藏代码
  1. <package name=”login” namespace=”/” extends=”json-default” >
  2.         <action name=”login” class=”userAction” method=”login” >
  3.             <result type=”json”>
  4.                 <param name=”root”>result</param>
  5.             </result>
  6.         </action>
  7. </package>
<package name="login" namespace="/" extends="json-default" >
    	<action name="login" method="login" >
    		<result type="json">
    			<param name="root">result</param>
    		</result>
    	</action>
</package>

 

// UserAction.java    只需要看login()方法,另外读者需要自己增加一个User的实体类用来获取请求数据。这里我只将user的logName与password封装到了一个map以JSONObject的方式返回(因为还有其它空属性没必要返回)。也可以直接调用JSONObject.fromObject(user)将整个user对象返回给JSON。注意最后返回的并不是一个JSONObject对象,而是一String类型的result。这里的result须与action中的<param name=”root”>中配置的一致。这里代码写的比较简单,没有增加对用户名密码的验证。

Java代码 复制代码 收藏代码
  1. package com.word.action;
  2. import java.util.HashMap;
  3. import java.util.List;
  4. import java.util.Map;
  5. import com.word.vo.User;
  6. import net.sf.json.JSONObject;
  7. import org.apache.poi.hssf.record.formula.eval.AddEval;
  8. import org.apache.struts2.components.ActionError;
  9. import org.apache.struts2.components.ActionMessage;
  10. import org.apache.struts2.interceptor.validation.JSONValidationInterceptor;
  11. import com.opensymphony.xwork2.ActionSupport;
  12. import com.word.service.IUserService;
  13. public class UserAction extends ActionSupport {
  14.     private User user;
  15.     private String result;
  16.     public String getResult(){
  17.         return result;
  18.     }
  19.     public void setResult(String result){
  20.         this.result = result;
  21.     }
  22.     public User getUser() {
  23.         return user;
  24.     }
  25.     public void setUser(User user) {
  26.         this.user = user;
  27.     }
  28.     private IUserService userService;
  29.     public void setUserService(IUserService userService) {
  30.         this.userService = userService;
  31.     }
  32.     public String login() throws Exception {
  33.         Map map = new HashMap();
  34.         map.put(“name”, user.getLogName());
  35.         map.put(“password”,user.getPassword());
  36.         JSONObject obj = JSONObject.fromObject(map);
  37.         result = obj.toString();
  38.         return SUCCESS;
  39.     }
  40.     /**
  41.      * get User list
  42.      */
  43.     public List<User> findAll() throws Exception {
  44.         return userService.findAll();
  45.     }
  46.     /**
  47.      * get User by id
  48.      *
  49.      * @param id
  50.      * @throw Exception
  51.      */
  52.     public User getUserById(Long id) throws Exception {
  53.         return userService.getUserById(id);
  54.     }
  55.     /**
  56.      * create User
  57.      *
  58.      * @param user
  59.      * @throw Exception
  60.      */
  61.     public String createUser() {
  62.         clearErrorsAndMessages();
  63.         if(user.getLogName().trim().equals(“”) ){
  64.             this.addActionMessage(getText(“error.user.name”));
  65.             return INPUT;
  66.         }
  67.         if(user.getPassword().trim().equals(“”) ){
  68.             this.addActionMessage(getText(“error.user.password”));
  69.             return INPUT;
  70.         }
  71.         try{
  72.             userService.createUser(user);
  73.             this.addActionMessage(getText(“user.message.create”));
  74.             return INPUT;
  75.         }catch(Exception e){
  76.             this.addActionMessage(“注册用户失败”);
  77.             return INPUT;
  78.         }
  79.     }
  80.     /**
  81.      * update User
  82.      *
  83.      * @param user
  84.      * @throw Exception
  85.      */
  86.     public void updateUser() throws Exception {
  87.         userService.updateUser(user);
  88.     }
  89.     /**
  90.      * delete User by id
  91.      *
  92.      * @param id
  93.      * @throw Exception
  94.      */
  95.     public void deleteUser(Long id) throws Exception {
  96.         userService.deleteUser(id);
  97.     }
  98. }
  99. http://www.iteye.com/topic/560638