js 无参数、有参数的webservice通信方法 XMLHttpRequest和 $.ajax方式汇总及返回值为json问题...

一、XMLHttpRequest方式

1.无参数通信方法（网上找来的方法）

 [C#]

[WebMethod]
        public string HelloWorld()
        {
            return "Hellow World";
        }

 

[javascript]

                function RequestWebService() {
                    //这是我们在第一步中创建的Web服务的地址
                    var URL = "http://192.168.1.128/ZHYL_Service/MapsService.asmx";

                    //在这处我们拼接
                    var data;
                    data = '<?xml version="1.0" encoding="utf-8"?>';
                    data = data + '<soap12:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap12="http://www.w3.org/2003/05/soap-envelope">';
                    data = data + '<soap12:Body>';
                    data = data + '<HelloWorld xmlns="http://tempuri.org/" />';
                    data = data + '</soap12:Body>';
                    data = data + '</soap12:Envelope>';

                    //创建异步对象
                    var xmlhttp = new XMLHttpRequest();
                    xmlhttp.open("POST", URL, false);
                    xmlhttp.setRequestHeader("Content-Type", "application/soap+xml");
                    xmlhttp.send(data);

                    document.getElementById("testDiv").innerHTML = xmlhttp.responseText;//返回结果放置于div中
                 
                  
                }

参考原文地址：http://www.cnblogs.com/puresoul/archive/2010/08/19/1803567.html

 

2.多参数通信方法

C#

[WebMethod]
        public string GetLayers(string groupTableName,string layerTableName)
        {
            return mReturnLayersEasyUI(groupTableName, layerTableName);
        }
        //其中mReturnLayersEasyUI()为具体处理方法

js

 function RequestWebService2() {
                    //这是我们在第一步中创建的Web服务的地址
                    var URL = "http://192.168.1.128/ZHYL_Service/MapsService.asmx";

                    //在这处我们拼接
                    var data;
                    data = '<?xml version="1.0" encoding="utf-8"?>';
                    data = data + '<soap12:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap12="http://www.w3.org/2003/05/soap-envelope">';
                    data = data + '<soap12:Body>';
                    data = data + '<GetLayers xmlns="http://tempuri.org/">';//GetLayers 为webservice中的方法名
                    data = data + "<groupTableName>ZHYL_GROUPS</groupTableName>";//第一参数，形参为groupTableName，实参为"ZHYL_GROUPS"
                    data = data + "<layerTableName>ZHYL_LAYERS</layerTableName>";//第二参数，同上
                    data = data + "</GetLayers>"
                    data = data +'</soap12:Body>';
                    data = data + '</soap12:Envelope>';

                    //创建异步对象
                    var xmlhttp = new XMLHttpRequest();
                    xmlhttp.open("POST", URL, false);
                    xmlhttp.setRequestHeader("Content-Type", "application/soap+xml");
                    xmlhttp.send(data);

                    var d = $("#testDiv")[0].innerHTML = xmlhttp.responseText; //返回结果放置到id为testDiv的div控件中

                   
                }

 

 二、$.ajax方式

$.ajax({
    type: 'POST',
    url: "http://192.168.1.128/ZHYL_Service/MapsService.asmx/GetLayers",
    dataType: 'json',
    data: { groupTableName: "ZHYL_GROUPS", layerTableName: "ZHYL_LAYERS"},
    async: true, 
    success: function (data) {
        var resultObject = data;
    },
    error: function (xhr,error,Eobject) {
        var d = $("#testDiv")[0].innerHTML = xhr.responseText; //返回结果放置到id为testDiv的div控件中
        var resultObject = xhr;
    }
});

在实际操作中发现，上述情况会返回分支error中而非意料之中的success，调试后发现返回值类型包含了XML头，因此不能识别为正确的json格式，当dataType设置为xml时进入success，但这并不是我们需要的json结果，具体原因和解决方案详见另一篇博文：

《js 与webservice通信返回值包含xml头，不能识别为json对象的解决方法》https://my.oschina.net/u/3669041/blog/1531681

 

转载于:https://my.oschina.net/u/3669041/blog/1531498