文档章节

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

JaJaCube
 JaJaCube
发布于 2017/09/07 19:29
字数 572
阅读 17
收藏 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
使用 web 代理实现 Ajax 跨域调用

XMLHttpRequest对象(在IE中是XMLHTTP)处于当今最令人兴奋的AJAX Web应用程序的核心地位。但是实际上使用这个对象编写客户端web应用程序将会受到网络上web浏览器对跨域链接的限制。这个指南...

时过境迁_
2013/06/26
4.9K
5
ASP.NET AJAX调用WebService

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

孟宪迎
2009/06/28
2.1K
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

没有更多内容

加载失败,请刷新页面

加载更多

Spring Cloud Stream消费失败后的处理策略(四):重新入队(RabbitMQ)

应用场景 之前我们已经通过《Spring Cloud Stream消费失败后的处理策略(一):自动重试》一文介绍了Spring Cloud Stream默认的消息重试功能。本文将介绍RabbitMQ的binder提供的另外一种重试...

程序猿DD
29分钟前
0
0
kiss原则

KISS 原则是用户体验的高层境界,简单地理解这句话,就是要把一个产品做得连白痴都会用,因而也被称为“懒人原则”。换句话说来,”简单就是美“。KISS 原则源于 David Mamet(大卫马梅)的电...

NB-One
31分钟前
7
0
MYSQL事务处理

INNODB 事务里,所有表引擎必须为INNODB,在非实务表上操作,不会警告,不会报错,但没有效果

关元
今天
3
0
cmake 编译脚本

#!/bin/sh test -d build || mkdir -p build cd build cmake .. make

shzwork
今天
2
0
从零开始实现Vue简单的Toast插件

概述: 在前端项目中,有时会需要通知、提示一些信息给用户,尤其是在后台系统中,操作的正确与否,都需要给与用户一些信息。 1. 实例 在Vue组件的methods内,调用如下代码 `this``.$toast({...

前端小攻略
今天
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部