使用stream類型的Result實現Ajax

來源:互聯網
上載者:User

前面介紹過Struts 2支援一種stream類型的Result,這種類型的Result可以直接向用戶端瀏覽器產生二進位響應、文本響應等。那麼我們就可讓Struts 2的Action來直接產生文本響應,接下來在用戶端頁面動態載入該響應即可。

例如下面做一個非常簡單的Ajax登入樣本,瀏覽者輸入使用者名稱、密碼之後,我們讓他以非同步方式來提交請求,而Struts 2的Action則直接輸出登入結果——無須使用額外的JSP頁面。下面是本樣本的Action類代碼。

程式清單:codes\04\4.6\streamAjax\WEB-INF\src\org\crazyit\app\action\LoginAction.java

  1. public class LoginAction  
  2.     implements Action  
  3. {  
  4.     //封裝請求參數的兩個屬性  
  5.     private String user;  
  6.     private String pass;  
  7.     //封裝輸出結果的二進位流  
  8.     private InputStream inputStream;  
  9.     //省略user屬性的setter和getter方法  
  10.     ...  
  11.     //省略pass屬性的setter和getter方法  
  12.     ...  
  13.     public InputStream getResult()  
  14.     {  
  15.         return inputStream;  
  16.     }  
  17.     public String execute()   
  18.         throws Exception   
  19.     {  
  20.         //判斷使用者名稱、密碼,產生對應的響應  
  21.         inputStream = user.equals("crazyit.org") && pass.equals("leegang")  
  22.             ? new ByteArrayInputStream("恭喜你,登入成功!" 
  23.                 .getBytes("UTF-8"))  
  24.             : new ByteArrayInputStream("對不起,使用者名稱、密碼不匹配!" 
  25.                 .getBytes("UTF-8"));  
  26.         return SUCCESS;  
  27.     }  
  28. }  

上面的Action與普通登入Action大致相同,同樣提供了user、pass兩個屬性來封裝使用者的請求參數,並為這兩個屬性提供setter和getter方法。但這個Action與普通Action也略有差別,它提供了一個返回二進位流的方法:getResult()——如上面的Action類中粗體字代碼所示。

getResult()方法的返回的二進位流將會直接輸出給瀏覽者——這將會使用stream類型的Result來完成,而上面的execute方法將會根據瀏覽者輸入的user、pass請求參數來決定產生怎樣的響應。

在struts.xml檔案中配置該Action,配置片段如下。

程式清單:codes\04\4.6\streamAjax\WEB-INF\src\struts.xml

  1. <action name="loginPro" class="org.crazyit.app.action.LoginAction">  
  2.     <result name="success" type="stream">  
  3.         <!-- 指定stream產生的響應資料的類型 -->  
  4.         <param name="contentType">text/html</param>  
  5.         <!-- 指定由getResult()方法返回輸出結果的InputStream -->  
  6.         <param name="inputName">result</param>  
  7.     </result>  
  8.     <!-- 定義一個名為login的結果 -->  
  9.      <result name="login">/WEB-INF/content/login.jsp</result>  
  10. </action>  

提示:通過使用stream類型的Result,Strut 2可以無需JSP視圖頁面,直接在Action向瀏覽者產生指定的響應。

接下來只要定義一個登入頁面,該頁面向上面的loginPro Action發送非同步請求,並動態載入該Action送回來的響應即可。

為了簡單起見,我們此處不會去做建立XMLHttpRequest對象、發送非同步請求這些煩瑣的步驟,此處將直接藉助於jQuery這個Ajax庫來發送非同步請求。頁面代碼如下。

程式清單:codes\04\4.6\streamAjax\WEB-INF\content\login.jsp

  1. <%@ page contentType="text/html; charset=GBK" language="java" errorPage="" %>  
  2. <%@ taglib prefix="s" uri="/struts-tags" %>  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  4.     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  5. <html xmlns="http://www.w3.org/1999/xhtml">  
  6. <head>  
  7.     <title>使用JSON外掛程式</title>  
  8.     <script src="${pageContext.request.contextPath}/jquery-1.4.4.min.js"   
  9.     type="text/javascript">  
  10.     </script>  
  11. </head>  
  12. <body>  
  13. <s:form id="loginForm">  
  14.     <s:textfield name="user" label="使用者名稱"/>  
  15.     <s:textfield name="pass" label="密碼"/>  
  16.     <tr><td colspan="2">  
  17.     <input id="loginBn" type="button" value="提交"/>  
  18.     </td></tr>  
  19. </s:form>  
  20. <div id="show" style="display:none;">  
  21. </div>  
  22. <script type="text/javascript">  
  23.     //為id為loginBn的按鈕綁定事件處理函數  
  24.     $("#loginBn").click(function()  
  25.     {  
  26.         //指定向loginPro發送請求,以id為loginForm表單裡各表單控制項作為請求參數  
  27.         $.get("loginPro" , $("#loginForm").serializeArray() ,   
  28.             //指定回呼函數  
  29.             function(data , statusText)  
  30.             {  
  31.                 $("#show").height(80)  
  32.                     .width(300)  
  33.                     .css("border" , "1px solid black")  
  34.                     .css("background-color" , "#efef99")  
  35.                     .css("color" , "#ff0000")  
  36.                     .css("padding" , "20px")  
  37.                     .empty();  
  38.                 $("#show").append("登入結果:" + data + "<br />");  
  39.                 $("#show").show(2000);  
  40.             },  
  41.             //指定伺服器響應為html  
  42.             "html");  
  43.     });  
  44. </script>  
  45. </body>  
  46. </html>  

上面的程式中粗體字代碼正是通過jQuery發送非同步請求的代碼。在瀏覽器中瀏覽該頁面,並輸入合適的使用者名稱、密碼,然後登入系統,將可以看到4.34所示結果。

 

 

除此之外,Struts 2.2還提供了一個JSON外掛程式,通過該外掛程式能更簡單地完成Ajax開發,下面主要以JSON外掛程式為例來介紹Struts 2的Ajax支援。

提示:jQuery是一個非常優秀的、輕量級Ajax函數庫,它不僅提供了大量方便的工具函數,而且對Ajax的支援也是既簡單、又強大。如果讀者希望獲得更多關於jQuery的知識,請參考瘋狂Java體系的《瘋狂Ajax講義》。

本文出自 “瘋狂Java李剛” 部落格,請務必保留此出處http://javaligang.blog.51cto.com/5026500/895034

相關文章

Alibaba Cloud 10 Year Anniversary

With You, We are Shaping a Digital World, 2009-2019

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。