[jsp小技巧]利用Throw Exception來完成Ajax

一般在寫Ajax時,最直覺的使用方法就是利用Ajax Object來要求Server給與回應, 再依回應的內容解西倒底是完成動作?還是有錯誤產生,如必填欄位未填。

這裡介紹一個小技巧,在編譯式的網頁伺服器語言可能比較合適使用。

大概的原理是利用程式在執行有錯誤時Throw Exception來當做錯誤訊息, 回傳給client,而client只要接收到503的錯誤,則就可以知道動作並未完成, 反之則是完成。

範例使用prototype來使用Ajax,傳送及回應,有需要可以參考:

Ajax 使用prototype.js 1

以下是載行結果,當有填值時,則回應填寫的值,

沒填值的時候就回傳錯誤訊息。(Exception)

1
2

1需要建立一個class extends Exception

裡面需實作String getMessage(),這是要給ErrorPage取得值使用的

package myexception; 
public class AjaxException extends Exception { 
private String message ; 
public AjaxException(String message) 
{ 
this.message = message; 
} 
public String getMessage() 
{ 
return this.message; 
} 
}

2建立一個ErrorPage,當有錯誤時利用這個網頁來顯示資料Error.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" 
pageEncoding="UTF-8" isErrorPage="true"%><%=exception.getMessage()%>

3建立主程式,執行Ajax要求並處理回傳   -MyAjax.jsp

其中onFailure 處理503,也就是錯誤回傳

onSuccess 處理200,也就是執行完成

<%@ page language="java" contentType="text/html; charset=UTF-8" 
pageEncoding="UTF-8"%> 
<!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>Insert title here</title> 
<script type="text/javascript" src="js/prototype-1.6.0.3.js"> 
</script> 
</head> 
<body style="background-color:#ff0f01"> 
<script type="text/javascript"> 
function myclick(){ 
//prototype的Ajax class 
new Ajax.Request("TestAjax.jsp",{method:'post', 
postBody:'id='+$F("myid"), 
onCreate:function (transport) 
{  
//建立Ajax時要啟動的function  
}, 
onSuccess: function(transport) 
{//成功執行的話 
alert("成功:"+transport.responseText); 
},onFailure:function(transport) 
{//有出錯誤的話 
alert("有錯誤產生:"+transport.responseText); 
} 
}); 
} 
</script> 
<input type="text" id="myid" name="myid" /> 
<input type="button" value="取得答案" onclick="myclick();" /> 
</body> 
</html>

4建立Ajax要求的伺服器回應頁,記得要指定errorPage     -TestAjax.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" 
pageEncoding="UTF-8" errorPage="Error.jsp"%><% 
String id = request.getParameter("id"); 
if(id==null || id.trim().length()==0)//沒傳值進來的話 
throw new myexception.AjaxException("沒有傳送參數"); 
else 
out.println(id); 
%>

發表迴響