利用JQuery和Servlet实现跨域提交请求示例分享


Posted in Javascript onFebruary 12, 2014

原理:JavaScript的Ajax不可以跨域,但是可以通过向本地的一个Servlet发出请求,由Servlet完成跨域。再把远程的结构返回给客户端。这样Ajax就可以跨域了。在后面,再发一个PHP版本的,请大家关注啊。下面是代码

JS代码:

注意:在Post方式时,param1和param2为向远程发送的参数值,可以有多个。

//GET方式
function reqeustCrossDomainProxyGet(){
    var url = "http://www.baidu.com";//远程请求地址
    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向本址的一个Servlet发送POST请求,所有关于远程请求的参数。
 * 在此处参POST方式发送给Servlet
 * @param param 远程请求参数
 * @param rtype JS返回类型(暂时没有用到)
 * @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;//标记远程请求类型,默认为GET方式
        PrintWriter out = resp.getWriter();
        Enumeration keys = req.getParameterNames();//取出客户端传入的所有参数名
        ArrayList<String> params = new ArrayList<String>();
        String url=null;
        while (keys.hasMoreElements()){
            String key = (String) keys.nextElement();
            /**
             * 如果请求参数内有如下几种表示,这此参数不参与远程请求
             */
            if(key.equals("requesturl")){//判断参数是否是,远程请求地址
                url = req.getParameter(key);
            }else if(key.equals("typedata")){//判断请求数据类型,暂时没有用到
            }else if(key.equals("returntype")){//判断请求返回类型,暂时没有用到
            }else{
                params.add(key);//其它加入参数列表,此处为参与远程请求的参数
                requestType = true;//修改标记,表求远程请求为POST方式
            }
        }
        HttpClient client = new HttpClient();
        HttpMethod method = null;
        if(requestType){//判断请求方式,并实例化HttpMethod对象,true:POST,false:GET
            method = new UTF8PostMethod(url);
            for(String name : params){//迭代POST参数,加入到请求中
                String _value = req.getParameter(name);
                ((PostMethod)method).setParameter(name,_value);
            }
        }else{
            method = new GetMethod(url);
        }       
        client.executeMethod(method);//执行请求
        String bodystr = method.getResponseBodyAsString();//返回结果
        out.println(bodystr);//将结果返回给客户端
    }
    /**
     * 内部类,转换URL字符串为UTF-8
     * @author Administrator
     *
     */
    private static class UTF8PostMethod extends PostMethod { 
        public UTF8PostMethod(String url) { 
            super(url); 
        } 
        @Override
        public String getRequestCharSet() { 
            return "UTF-8"; 
        } 
    }
}
Javascript 相关文章推荐
jquery的Tooltip插件 qtip使用详细说明
Sep 08 Javascript
基于jquery的高性能td和input切换并可修改内容实现代码
Jan 09 Javascript
javascript仿qq界面的折叠菜单实现代码
Dec 12 Javascript
Javascript中设置默认参数值示例
Sep 11 Javascript
使用jQuery实现返回顶部
Jan 26 Javascript
javascript结合fileReader 实现上传图片
Jan 30 Javascript
jQuery操作基本控件方法实例分析
Dec 31 Javascript
JavaScript的React Web库的理念剖析及基础上手指南
May 10 Javascript
Node.js+ES6+dropload.js实现移动端下拉加载实例
Jun 01 Javascript
javascript基于定时器实现进度条功能实例
Oct 13 Javascript
axios拦截设置和错误处理方法
Mar 05 Javascript
JS pushlet XMLAdapter适配器用法案例解析
Oct 16 Javascript
jquery ajax,ashx,json的用法总结
Feb 12 #Javascript
Jquery中ajax方法data参数的用法小结
Feb 12 #Javascript
利用jquery.qrcode在页面上生成二维码且支持中文
Feb 12 #Javascript
Jquery中国地图热点效果-鼠标经过弹出提示层信息的简单实例
Feb 12 #Javascript
JavaScript cookie的设置获取删除详解
Feb 11 #Javascript
JavaScript新窗口与子窗口传值详解
Feb 11 #Javascript
jquery绑定事件不生效的解决方法
Feb 11 #Javascript
You might like
全国FM电台频率大全 - 22 重庆市
2020/03/11 无线电
PHP 如何向 MySQL 发送数据
2006/10/09 PHP
php获得当前的脚本网址
2007/12/10 PHP
简单实用的网站PHP缓存类实例
2014/07/18 PHP
php使用指定编码导出mysql数据到csv文件的方法
2015/03/31 PHP
PHP生成及获取JSON文件的方法
2016/08/23 PHP
PHP排序算法之基数排序(Radix Sort)实例详解
2018/04/21 PHP
PHP网站常见安全漏洞,及相应防范措施总结
2021/03/01 PHP
javascript之可拖动的iframe效果代码
2008/08/01 Javascript
javascript 模拟点击广告
2010/01/02 Javascript
用RadioButten或CheckBox实现div的显示与隐藏
2013/09/21 Javascript
扒一扒JavaScript 预解释
2015/01/28 Javascript
JavaScript实现图片轮播的方法
2015/07/31 Javascript
jQuery实现带分组数据的Table表头排序实例分析
2015/11/24 Javascript
JavaScript中实现无缝滚动、分享到侧边栏实例代码
2016/04/06 Javascript
javascript实现无法关闭的弹框
2016/11/27 Javascript
Vue2.0 v-for filter列表过滤功能的实现
2018/09/07 Javascript
解决vue单页面应用进入页面加载所有 js 的问题
2020/08/12 Javascript
[01:05:41]EG vs Optic Supermajor 败者组 BO3 第二场 6.6
2018/06/07 DOTA
Python Socket编程入门教程
2014/07/11 Python
解决python2.7用pip安装包时出现错误的问题
2017/01/23 Python
使用Python爬虫库requests发送表单数据和JSON数据
2020/01/25 Python
Tensorflow实现多GPU并行方式
2020/02/03 Python
前端使用canvas生成盲水印的加密解密的实现
2020/12/16 HTML / CSS
澳大利亚免息网上购物:Shop Zero
2016/09/17 全球购物
英国派对礼服和连衣裙购物网站:TFNC London
2018/07/07 全球购物
TCP/IP中的TCP和IP分别承担什么责任
2012/04/21 面试题
办护照工作证明范本
2014/01/14 职场文书
自动化专业职业生涯规划书范文
2014/01/16 职场文书
村干部培训班主持词
2014/03/28 职场文书
运动会铅球比赛加油稿
2014/09/26 职场文书
2014幼儿园卫生保健工作总结
2014/12/05 职场文书
公司表扬稿范文
2015/05/05 职场文书
水浒传读书笔记
2015/06/25 职场文书
Java处理延时任务的常用几种解决方案
2022/06/01 Java/Android
CSS中使用grid布局实现一套模板多种布局
2022/07/15 HTML / CSS