利用JQuery和Servlet實(shí)現(xiàn)跨域提交請(qǐng)求示例分享
原理:JavaScript的Ajax不可以跨域,但是可以通過向本地的一個(gè)Servlet發(fā)出請(qǐng)求,由Servlet完成跨域。再把遠(yuǎn)程的結(jié)構(gòu)返回給客戶端。這樣Ajax就可以跨域了。在后面,再發(fā)一個(gè)PHP版本的,請(qǐng)大家關(guān)注啊。下面是代碼
JS代碼:
注意:在Post方式時(shí),param1和param2為向遠(yuǎn)程發(fā)送的參數(shù)值,可以有多個(gè)。
//GET方式
function reqeustCrossDomainProxyGet(){
var url = "http://www.baidu.com";//遠(yuǎn)程請(qǐng)求地址
var param = {'requesturl':url,'typedata':'JSON'};
var data = getCrossDomainProxyRemote(param,"json");
}
//Post方式
function reqeustCrossDomainProxyPost(param1,param2){
var url = apiServer+"/api/lucene/query";
var param = {'requesturl':url,'typedata':'JSON','param1':param1,'param2':param2};
var data = getCrossDomainProxyRemote(param,"json");
}
/**
* JS向本址的一個(gè)Servlet發(fā)送POST請(qǐng)求,所有關(guān)于遠(yuǎn)程請(qǐng)求的參數(shù)。
* 在此處參POST方式發(fā)送給Servlet
* @param param 遠(yuǎn)程請(qǐng)求參數(shù)
* @param rtype JS返回類型(暫時(shí)沒有用到)
* @return
*/
function getCrossDomainProxyRemote(param,rtype){
var url = "/cross/proxy";//Servlet的URL地址
var returndata;
$.ajax({
url: url,type: 'POST',dataType: rtype,timeout: 40000,data:param, async:false,
error: function(response,error) {alert(response.status);},
success: function(data){returndata=data;}
});
return returndata;
}
Java代碼:
public class CorssDomainProxy extends HttpServlet {
public void doGet(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
this.doPost(req, resp);
}
public void doPost(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
boolean requestType = false;//標(biāo)記遠(yuǎn)程請(qǐng)求類型,默認(rèn)為GET方式
PrintWriter out = resp.getWriter();
Enumeration keys = req.getParameterNames();//取出客戶端傳入的所有參數(shù)名
ArrayList<String> params = new ArrayList<String>();
String url=null;
while (keys.hasMoreElements()){
String key = (String) keys.nextElement();
/**
* 如果請(qǐng)求參數(shù)內(nèi)有如下幾種表示,這此參數(shù)不參與遠(yuǎn)程請(qǐng)求
*/
if(key.equals("requesturl")){//判斷參數(shù)是否是,遠(yuǎn)程請(qǐng)求地址
url = req.getParameter(key);
}else if(key.equals("typedata")){//判斷請(qǐng)求數(shù)據(jù)類型,暫時(shí)沒有用到
}else if(key.equals("returntype")){//判斷請(qǐng)求返回類型,暫時(shí)沒有用到
}else{
params.add(key);//其它加入?yún)?shù)列表,此處為參與遠(yuǎn)程請(qǐng)求的參數(shù)
requestType = true;//修改標(biāo)記,表求遠(yuǎn)程請(qǐng)求為POST方式
}
}
HttpClient client = new HttpClient();
HttpMethod method = null;
if(requestType){//判斷請(qǐng)求方式,并實(shí)例化HttpMethod對(duì)象,true:POST,false:GET
method = new UTF8PostMethod(url);
for(String name : params){//迭代POST參數(shù),加入到請(qǐng)求中
String _value = req.getParameter(name);
((PostMethod)method).setParameter(name,_value);
}
}else{
method = new GetMethod(url);
}
client.executeMethod(method);//執(zhí)行請(qǐng)求
String bodystr = method.getResponseBodyAsString();//返回結(jié)果
out.println(bodystr);//將結(jié)果返回給客戶端
}
/**
* 內(nèi)部類,轉(zhuǎn)換URL字符串為UTF-8
* @author Administrator
*
*/
private static class UTF8PostMethod extends PostMethod {
public UTF8PostMethod(String url) {
super(url);
}
@Override
public String getRequestCharSet() {
return "UTF-8";
}
}
}
相關(guān)文章
用隊(duì)列模擬jquery的動(dòng)畫算法實(shí)例
這篇文章主要介紹了用隊(duì)列模擬jquery的動(dòng)畫算法,實(shí)例分析了用隊(duì)列模擬jquery的動(dòng)畫算法的原理與實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-01-01
AJAX實(shí)現(xiàn)瀑布流觸發(fā)分頁與分頁觸發(fā)瀑布流的方法
瀑布流觸發(fā)分頁可以理解為微博中的瀏覽效果、到一定程度時(shí)顯示頁數(shù)進(jìn)行分頁,而分頁觸發(fā)瀑布流可以理解為Twitter拉到一頁設(shè)定的最大條數(shù)后繼續(xù)用瀑布流展示下一頁,接下來我們就來詳細(xì)看看AJAX實(shí)現(xiàn)瀑布流觸發(fā)分頁與分頁觸發(fā)瀑布流的方法2016-05-05
JQuery實(shí)現(xiàn)table中tr上移下移的示例(超簡單)
下面小編就為大家分享一篇JQuery實(shí)現(xiàn)table中tr上移下移的示例(超簡單),具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-01-01
jquery判斷類型是不是number類型的實(shí)例代碼
下面小編就為大家?guī)硪黄猨query判斷類型是不是number類型的實(shí)例代碼。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-10-10
7款風(fēng)格新穎的jQuery/CSS3菜單導(dǎo)航分享
下面給大家分享7款風(fēng)格新穎的jQuery/CSS3菜單導(dǎo)航讓用戶方便地找到想要的信息,而且更讓人有一種特殊的用戶體驗(yàn),希望大家會(huì)喜歡2013-04-04

