文档章节

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

JaJaCube
 JaJaCube
发布于 2017/09/07 19:29
字数 572
阅读 15
收藏 0

一、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

 

© 著作权归作者所有

共有 人打赏支持
JaJaCube
粉丝 3
博文 7
码字总数 3719
作品 0
合肥
JSONP原理优缺点(只能GET不支持POST)

JSONP的优点是:它不像XMLHttpRequest对象实现的Ajax请求那样受到同源策略的限制;它的兼容性更好,在更加古老的浏览器中都 可以运行,不需要XMLHttpRequest或ActiveX的支持;并且在请求完毕...

BearCatYN
2015/06/04
0
0
ASP.NET AJAX调用WebService

如何在客户端直接调用WebService中的方法? 这里结合经验自己写一写 1.首先新建一个 ASP.NET AJAX-Enabled Web Site,这样系统为我们自动配置好了环境,这主要体现在Web.config这个文件上,如...

孟宪迎
2009/06/28
0
2
用jQuery与JSONP轻松解决跨域访问的问题

跨域的安全限制都是指浏览器端来说的.服务器端是不存在跨域安全限制的,所以通过本机服务器端通过类似httpclient方式完成“跨域访问”的工作,然后在浏览器端用AJAX获取本机服务器端“跨域访问...

烽穹寒渊
2015/07/26
0
0
JSONP原理及JQUERY JSONP的使用

JSONP原理 JSON和JSONP   JSON(JavaScript Object Notation)是一种轻量级的数据交换格式。对于JSON大家应该是很了解了吧,不是很清楚的朋友可以去json.org上了解下,简单易懂。   JSONP...

听风雨
2014/03/01
0
0
第113天:Ajax跨域请求解决方法

一、原生JS实现ajax 第一步获得XMLHttpRequest对象 第二步:设置状态监听函数 第三步:open一个连接,true是异步请求 第四部:send一个请求,可以发送一个对象和字符串,不需要传递数据发送n...

半指温柔乐
2017/12/13
0
0

没有更多内容

加载失败,请刷新页面

加载更多

兄弟连区块链教程之以太坊源码分析交易数据分析

交易的数据结构 交易的数据结构定义在core.types.transaction.go中,结构如下: type Transaction struct {data txdata// cacheshash atomic.Valuesize atomic.Valuefrom atomic.V...

兄弟连区块链入门教程
14分钟前
1
0
Tomcat优化经验之谈

Tomcat优化经验之谈 程序员小新人学习 2018-07-23 12:09:36 由于刚做完一个tomcat,jboss,Oracle性能优化项目,想做个总结。写写项目过程中对他们优化过程的理解。 tomcat安装配置就不讲啦(...

两广总督bogang
21分钟前
2
0
Spark中foreachPartition和mapPartitions的区别

spark的运算操作有两种类型:分别是Transformation和Action,区别如下: Transformation:代表的是转化操作就是我们的计算流程,返回是RDD[T],可以是一个链式的转化,并且是延迟触发的。 Ac...

张泽立
23分钟前
2
0
git reset 和 git revert, git log 和 git reflog 比较

前言:仙儿苦设相思局,寻欢误入冷香处 故事背景: 那一晚 月黑风高之夜 李寻欢 在自诩为江湖正义的一群伪君子设计好的圈套(repository)中做了(commit)三件事:              ...

猿神出窍
34分钟前
1
0
kotlin使用spring mvc(一)

过滤器Filter,是Servlet的一种技术。可通过Filter,对请求进行拦截,比如判断用户是否登录、验证黑名单等并且可对请求进行预处理。 接下来介绍使用WebFilter配置过滤器并实现读取cookie判断...

weidedong
38分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部