天天看點

使用stream類型的Result實作Ajax

前面介紹過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

public class LoginAction  

    implements Action  

{  

    //封裝請求參數的兩個屬性  

    private String user;  

    private String pass;  

    //封裝輸出結果的二進制流  

    private InputStream inputStream;  

    //省略user屬性的setter和getter方法  

    ...  

    //省略pass屬性的setter和getter方法  

    public InputStream getResult()  

    {  

        return inputStream;  

    }  

    public String execute()   

        throws Exception   

        //判斷使用者名、密碼,生成對應的響應  

        inputStream = user.equals("crazyit.org") && pass.equals("leegang")  

            ? new ByteArrayInputStream("恭喜你,登入成功!" 

                .getBytes("UTF-8"))  

            : new ByteArrayInputStream("對不起,使用者名、密碼不比對!" 

                .getBytes("UTF-8"));  

        return SUCCESS;  

}  

上面的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

<action name="loginPro" class="org.crazyit.app.action.LoginAction">  

    <result name="success" type="stream">  

        <!-- 指定stream生成的響應資料的類型 -->  

        <param name="contentType">text/html</param>  

        <!-- 指定由getResult()方法傳回輸出結果的InputStream -->  

        <param name="inputName">result</param>  

    </result>  

    <!-- 定義一個名為login的結果 -->  

     <result name="login">/WEB-INF/content/login.jsp</result>  

</action>  

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

接下來隻要定義一個登入頁面,該頁面向上面的loginPro Action發送異步請求,并動态加載該Action送回來的響應即可。

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

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

<%@ page contentType="text/html; charset=GBK" language="java" errorPage="" %>  

<%@ taglib prefix="s" uri="/struts-tags" %>  

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 

    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  

<html xmlns="http://www.w3.org/1999/xhtml">  

<head>  

    <title>使用JSON插件</title>  

    <script src="${pageContext.request.contextPath}/jquery-1.4.4.min.js"   

    type="text/javascript">  

    </script>  

</head>  

<body>  

<s:form id="loginForm">  

    <s:textfield name="user" label="使用者名"/>  

    <s:textfield name="pass" label="密碼"/>  

    <tr><td colspan="2">  

    <input id="loginBn" type="button" value="送出"/>  

    </td></tr>  

</s:form>  

<div id="show" style="display:none;">  

</div>  

<script type="text/javascript">  

    //為id為loginBn的按鈕綁定事件處理函數  

    $("#loginBn").click(function()  

        //指定向loginPro發送請求,以id為loginForm表單裡各表單控件作為請求參數  

        $.get("loginPro" , $("#loginForm").serializeArray() ,   

            //指定回調函數  

            function(data , statusText)  

            {  

                $("#show").height(80)  

                    .width(300)  

                    .css("border" , "1px solid black")  

                    .css("background-color" , "#efef99")  

                    .css("color" , "#ff0000")  

                    .css("padding" , "20px")  

                    .empty();  

                $("#show").append("登入結果:" + data + "<br />");  

                $("#show").show(2000);  

            },  

            //指定伺服器響應為html  

            "html");  

    });  

</script>  

</body>  

</html>  

上面的程式中粗體字代碼正是通過jQuery發送異步請求的代碼。在浏覽器中浏覽該頁面,并輸入合适的使用者名、密碼,然後登入系統,将可以看到如圖4.34所示結果。

<a href="http://blog.51cto.com/attachment/201206/095427959.jpg" target="_blank"></a>

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

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