jQuery中通过ajax调用webservice传递数组参数的问题实例详解


Posted in Javascript onMay 20, 2016

下面通过实例给大家说明比较直观些,更方便大家了解。

本人的项目中通过jquery.ajax调用webservice.

客户端代码如下:

$.ajax({
url: "test/xxx.asmx",
type: 'POST',
dataType: 'xml',
timeout: ,
data: { name: "zhangsan", tags: ["aa", "bb", "cc"] },
error: function(xml) {
alert(xml.responseText);
},
success: function(xml) {
alert("OK");
}
});

服务端代码如下:

[WebMethod]
public XmlDocument xxx(string name, string [] tags )
{ 
return sth; 
}

总是抛出异常.

问题出现在这里:

下面是HTTP数据:

POST http://xxx.com/xxx.asmx/xxx HTTP/1.1
Host: center.cmis.htpc.com.cn
Connection: keep-alive
Content-Length: 55
Cache-Control: max-age=0
Origin: http://xxx.com
User-Agent: Mozilla/5.0 (Windows NT 5.1) AppleWebKit/535.1 (KHTML, like Gecko) Chrome/14.0.835.186 Safari/535.1
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
Accept: application/xml, text/xml, */*; q=0.01
Referer: http://xxx.com/xxx.aspx
Accept-Encoding: gzip,deflate,sdch
Accept-Language: zh-CN,zh;q=0.8
Accept-Charset: GBK,utf-8;q=0.7,*;q=0.3
name=zhangsan&tags%5B%5D=aa&tags%5B%5D=bb&tags%5B%5D=cc

而它期望的格式是如下的:

POST /xxx.asmx/xxx HTTP/1.1
Host: xxx.com
Content-Type: application/x-www-form-urlencoded
Content-Length: length
name=string&tags=string&tags=string

比较上面粗体,post的数据除了问题. 正确的应该如下:

name=zhangsan&tags=aa&tags=bb&tags=cc

看来问题出在jquery.ajax上面了.见代码(jquery.1.8.3.js)

function buildParams(prefix, obj, traditional, add) {
var name;
if (jQuery.isArray(obj)) { 
// Serialize array item.
jQuery.each(obj, function(i, v) {
if (traditional || rbracket.test(prefix)) { 
// Treat each array item as a scalar.
add(prefix, v);
} else {
// If array item is non-scalar (array or object), encode its
// numeric index to resolve deserialization ambiguity issues.
// Note that rack (as of ..) can't currently deserialize
// nested arrays properly, and attempting to do so may cause
// a server error. Possible fixes are to modify rack's
// deserialization algorithm or to provide an option or flag
// to force array serialization to be shallow.
//ytx 
buildParams(prefix, v, traditional, add);
//buildParams(prefix + "[" + (typeof v === "object" ? i : "") + "]", v, traditional, add);
}
});
} else if (!traditional && jQuery.type(obj) === "object") {
// Serialize object item.
for (name in obj) {
buildParams(prefix + "[" + name + "]", obj[name], traditional, add);
}
} else {
// Serialize scalar item.
add(prefix, obj);
}
}

结论:

出问题的代码在22行,我修改成21行那样就行了.

不过,我对js/jquery都是一知半解的,希望不要引起别的后遗症,呵呵.

以上所述是小编给大家介绍的jQuery中通过ajax调用webservice传递数组参数的问题实例详解的相关知识,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
浅析javascript 定时器
Dec 23 Javascript
常用DOM整理
Jun 16 Javascript
js eval函数使用,js对象和字符串互转实例
Mar 06 Javascript
JS奇技之利用scroll来监听resize详解
Jun 15 Javascript
详解React Native网络请求fetch简单封装
Aug 10 Javascript
JS实现十字坐标跟随鼠标效果
Dec 25 Javascript
详解如何实现一个简单的 vuex
Feb 10 Javascript
node实现登录图片验证码的示例代码
Apr 20 Javascript
javaScript强制保留两位小数的输入数校验和小数保留问题
May 09 Javascript
Vue2.0仿饿了么webapp单页面应用详细步骤
Jul 08 Javascript
React+Antd+Redux实现待办事件的方法
Mar 14 Javascript
Vue通过懒加载提升页面响应速度
May 10 Vue.js
浅析JavaScript Array和string的转换(推荐)
May 20 #Javascript
深入理解JS addLoadEvent函数
May 20 #Javascript
用jQuery获取table中行id和td值的实现代码
May 19 #Javascript
jquery遍历table的tr获取td的值实现方法
May 19 #Javascript
jquery if条件语句的写法
May 19 #Javascript
laypage分页控件使用实例详解
May 19 #Javascript
js多功能分页组件layPage使用方法详解
May 19 #Javascript
You might like
详解PHP内置访问资源的超时时间 time_out file_get_contents read_file
2013/06/03 PHP
PHP类相关知识点实例总结
2016/09/28 PHP
php获取当前url地址的方法小结
2017/01/10 PHP
layui框架实现文件上传及TP3.2.3(thinkPHP)对上传文件进行后台处理操作示例
2018/05/12 PHP
php多进程中的阻塞与非阻塞操作实例分析
2020/03/04 PHP
点图片上一页下一页翻页效果
2008/07/09 Javascript
分享十五个最佳jQuery 幻灯插件和教程
2010/03/27 Javascript
jQuery EasyUI API 中文文档 - Documentation 文档
2011/09/29 Javascript
javascript实现动态表头及表列的展现方法
2015/07/14 Javascript
JavaScript实现表格快速变色效果代码
2015/08/19 Javascript
jquery带翻页动画的电子杂志代码分享
2015/08/21 Javascript
jquery uploadify如何取消已上传成功文件
2017/02/08 Javascript
React Native AsyncStorage本地存储工具类
2017/10/24 Javascript
轻量级JS Cookie插件js-cookie的使用方法
2018/03/22 Javascript
JavaScript实现一个简易的计算器实例代码
2018/05/10 Javascript
jQuery实现表单动态添加数据并提交的方法
2018/07/19 jQuery
vue中使用codemirror的实例详解
2018/11/01 Javascript
Promise扫盲贴
2019/06/24 Javascript
vue 使用element-ui中的Notification自定义按钮并实现关闭功能及如何处理多个通知
2019/08/17 Javascript
详解template标签用法(含vue中的用法总结)
2021/01/12 Vue.js
Python图片裁剪实例代码(如头像裁剪)
2017/06/21 Python
Python语言描述KNN算法与Kd树
2017/12/13 Python
Python列表推导式与生成器表达式用法示例
2018/02/08 Python
详谈python3中用for循环删除列表中元素的坑
2018/04/19 Python
Python使用re模块正则提取字符串中括号内的内容示例
2018/06/01 Python
Python爬虫框架scrapy实现的文件下载功能示例
2018/08/04 Python
pytorch中的embedding词向量的使用方法
2019/08/18 Python
python使用信号量动态更新配置文件的操作
2020/04/01 Python
Python实现爬取网页中动态加载的数据
2020/08/17 Python
HTML 5.1来了 9月份正式发布 更新内容预览
2016/04/26 HTML / CSS
DKNY品牌官网:纽约大都会时尚风格
2016/10/20 全球购物
在线吉他课程,学习如何弹吉他:Fender Play
2019/02/28 全球购物
经济学博士求职自荐信范文
2013/11/23 职场文书
婚礼庆典答谢词
2015/01/20 职场文书
vue3中的组件间通信
2021/03/31 Vue.js
详解Go语言中Get/Post请求测试
2022/06/01 Golang