AJAX跨域调用WebService解决方案

//描述:AJAX调用WebService的解决方案
//作者:Faneok
//日期:2012.06.14
//调用示例:
//    <script language="javascript" type="text/javascript">
//        function jsonpCallback(result) {//这里是回调方法
//            alert(result.msg);
//            $("ws1").remove();//注意回调后如果有可能请执行删除操作
//        }
//        $(function () {
//            $.fn.getWS({ id: 'ws1', url: 'http://host:prot/ser.asmx/method', Callback: "jsonpCallback" });
//        });
//    </script>
//服务器端需要执行的操作示例:
//[WebMethod]
//public string method1()
//{
//    string str = "{\"msg\":\"这里是主要内容\"}";
//    if (HttpContext.Current.Request["jsonp"] != null)//这里是执行是否需要返回JSONP字符串的唯一标识
//    {
//        HttpRequest Request = HttpContext.Current.Request;
//        HttpResponse Response = HttpContext.Current.Response;
//        string callback = Request["jsonp"];
//        Response.Write(callback + "(" + str + ")");
//        Response.End();//结束后续的操作,直接返回所需要的字符串
//    }
//    return str;
//}
(function ($) {
    //向目标DOM设置值,常规表单标签则直接设置Value,Item标签设置val属性
    $.fn.getWS = function (options) {
        var defaults = {
            id: "",
            url: "",
            Callback: ""
        }
        var options = $.extend(defaults, options);
        var oHead = document.getElementsByTagName('HEAD').item(0);
        var oScript = document.createElement("script");
        oScript.type = "text/javascript";
        oScript.setAttribute("id", options.id);
        oScript.src = options.url + "?jsonp=" + options.Callback;
        oHead.appendChild(oScript);
    }

})(jQuery);



一个简单的调用方法,Jquery原始方法:

            $.ajax({
                type: "get",
                url: "http://localhost:17180/Service1.asmx/method1",
                dataType: "jsonp",
                jsonp: "jsonp", //传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(默认为:callback)
                jsonpCallback: "jsonpCallback", //自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名
                contentType: "application/json; charset=utf-8",
                success: function (json) {
                    alert(json.msg);
                },
                error: function () {
                    debugger;
                    alert('fail');
                }
            });

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值