使用JQuery的Ajax调用SOAP-XML Web Services(Call SOAP-XML Web Services With jQuery Ajax)(译+摘录)
假设有一个基于.Net的Web Service,其名称为SaveProduct
POST /ProductService.asmx HTTP/1.1
Host: localhost
Content-Type: text/xml; charset=utf-8
Content-Length: length
SOAPAction: "http://sh.inobido.com/SaveProduct" <?xml version="1.0" encoding="utf-8"?>
<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">
<soap:Body>
<SaveProduct xmlns="http://sh.inobido.com/">
<productID>int</productID>
<productName>string</productName>
<manufactureDate>dateTime</manufactureDate>
</SaveProduct>
</soap:Body>
</soap:Envelope>
在客户端用jQuery的ajax调用的代码为
var productServiceUrl = 'http://localhost:57299/ProductService.asmx?op=SaveProduct'; // Preferably write this out from server side
function beginSaveProduct(productID, productName, manufactureDate){
var soapMessage =
'<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/"> \
<soap:Body> \
<SaveProduct xmlns="http://sh.inobido.com/"> \
<productID>' + productID + '</productID> \
<productName>' + productName + '</productName> \
<manufactureDate>' + manufactureDate + '</manufactureDate> \
</SaveProduct> \
</soap:Body> \
</soap:Envelope>';
$.ajax({
url: productServiceUrl,
type: "POST",
dataType: "xml",
data: soapMessage,
complete: endSaveProduct,
contentType: "text/xml; charset=\"utf-8\""
});
return false;
}
function endSaveProduct(xmlHttpRequest, status){
$(xmlHttpRequest.responseXML)
.find('SaveProductResult')
.each(function() {
var name = $(this).find('Name').text();
});
}
说明:
- type: 发送的请求的类型-the type of request we're sending
- dataType: 发回的响应的类型- the type of the response will send back, 一般情况下可以是html, json等类型,但如果是一个SOAP web service,必须定义为 xml类型
- data: 发送给web service的实际数据
- complete: function (XMLHttpRequest, textStatus) { /* Code goes here */ }
- contentType: 请求的MIME content类型, 同理,如果是一个SOAP web service,必须定义为 “text/xml”
- endSaveProduct:现在XML数据就已经发送到web service了,一旦服务器server接受到请求并进行处理,调用endSaveProduct方法
如用jQuery处理传回的XML响应,必须理解SOAP reponse’s schema定义,SaveProduct的schema格式如下:
HTTP/1.1 200 OK
Content-Type: text/xml; charset=utf-8
Content-Length: length <?xml version="1.0" encoding="utf-8"?>
<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">
<soap:Body>
<SaveProductResponse xmlns="http://sh.inobido.com/">
<SaveProductResult>
<ID>int</ID>
<Name>string</Name>
<ManufactureDate>dateTime</ManufactureDate>
</SaveProductResult>
</SaveProductResponse>
</soap:Body>
</soap:Envelope>
传回的响应放在xmlHttpRequest的参数responseXML中,可以使用firebug或Dev. Tool查看,现在我们就可以使用jQuery来遍历该XML的节点并处理数据了。
补充:JSP和jQuery配合调用Web service的代码
<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<html>
<head>
<script type="text/javascript"
src="<c:url value='/js/jquery-1.5.js'/>"></script>
</head>
<body>
<label for="name">姓名:</label>
<input type="text" id="name" name="name"/>
<br/>
<a href="#" id="ok">确定</a>
</body>
<script type="text/javascript">
$(function(){
$("#ok").click(function(){
var val = $("#name").val();
if($.trim(val)==""){
alert("请输入名称");
return;
}
<!--可以通过拦截器获取请求信息-->
var str = '<?xml version="1.0" encoding="UTF-8"?>'+
'<soap:Envelope xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">'+
'<soap:Body><ns2:sayHello xmlns:ns2="http://first.cxf.itcast.com/">'+
'<arg0>'+val+'</arg0>'+
'</ns2:sayHello></soap:Body></soap:Envelope>';
$.ajax({
contentType:'application/xml;charset="UTF-8"',
dataType:'xml',//发送数据格式
type:'post',
url:'http://localhost:9999/cxf2.4_spring_web/ws/helloworld', //直接发向这个地址
data:str,
success:function(data){
//$(data).find("return").each(function(){
// alert($(this).text());
//}); //使用上面的方法也是可以的
var ss = $(data).find("return").first().text();
$("<div>").html(ss)
.css("border","1px solid blue")
.css({width:'50%'}).
appendTo($("body"));
$("#name").val("");
}
},"xml");//数据返回格式为xml
});
});
</script>
</html>
摘录自:http://openlandscape.net/2009/09/25/call-soap-xm-web-services-with-jquery-ajax/
使用JQuery的Ajax调用SOAP-XML Web Services(Call SOAP-XML Web Services With jQuery Ajax)(译+摘录)的更多相关文章
- 类型:Ajax;问题:ajax调用ashx参数获取不到;结果:ashx文件获取$.ajax()方法发送的数据
ashx文件获取$.ajax()方法发送的数据 今天在使用Jquery的ajax方法发送请求时,发现在后台中使用ashx文件无法接收到ajax方法中传递的参数,上网查了一下原因后发现了问题所在,原来是 ...
- WCF入门教程(四)通过Host代码方式来承载服务 一个WCF使用TCP协议进行通协的例子 jquery ajax调用WCF,采用System.ServiceModel.WebHttpBinding System.ServiceModel.WSHttpBinding协议 学习WCF笔记之二 无废话WCF入门教程一[什么是WCF]
WCF入门教程(四)通过Host代码方式来承载服务 Posted on 2014-05-15 13:03 停留的风 阅读(7681) 评论(0) 编辑 收藏 WCF入门教程(四)通过Host代码方式来 ...
- jquery ajax调用WCF,采用System.ServiceModel.WebHttpBinding
Jquery ajax调用WCF服务 例子效果如下:原界面 点击按钮GetList get后,通过指定的Url获取数据添加到table 新建一个控制台项目,添加IContract.cs,DBServi ...
- ajax 调用 .net core WebAPI,报错 400 (Bad Request) Unexpected character encountered while parsing value
此文由博主前两天的提问及 dudu 的回答整理,地址:https://q.cnblogs.com/list/myquestion 情况说明 基于 .net core 写了一个 Web API,用 po ...
- JQuery Ajax调用asp.net后台方法
利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法. 先来个简单的实例热热身吧. 1.无参数的方法调用 asp.net code: using System.Web.Scrip ...
- jQuery.ajax()调用asp.net后台方法
利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法.介意方法名不要重名 建一个WebFormAjax名aspx文件 CS <%@ Page Language=" ...
- Jquery利用ajax调用asp.net webservice的各种数据类型(总结篇)
原文:Jquery利用ajax调用asp.net webservice的各种数据类型(总结篇) 老话说的好:好记心不如烂笔头! 本着这原则,我把最近工作中遇到的jquery利用ajax调用web服务的 ...
- Asp.net中JQuery、ajax调用后台方法总结
通过上一篇文章实例的实现,整个过程当中学习到很多知识点,了解了Jquery.Ajax在asp.net中的运用,加以总结,其实原理都是一样的,理解了一种,其他的注意很少的区别就可以了.灵活运用: 1.有 ...
- jquery ajax调用WCF,采用System.ServiceModel.WSHttpBinding协议
采用System.ServiceModel.WSHttpBinding或者basicHttpBinding 协议.客户端就不能直接在前端通过url直接访问服务了 它是基于SOAP协议的bing,会采用 ...
随机推荐
- 自动编号维护SNRO
声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...
- python_way day13 paramiko
paramiko 一.安装 pip3 install paramiko 二.使用 1.SSHClient 用于连接远程服务器并执行基本命令 import paramiko # 创建SSH对象 ssh ...
- hdu 5167 Fibonacci 打表
Fibonacci Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others) Proble ...
- 《Linux内核设计的艺术》学习笔记(六)执行setup.s
参考资料 1. 8259A可编程中断控制器 jmpi , SETUPSEG // 0x90200 到这里,bootsect.s的执行就算结束了.控制权转移到了setup.s文件的手中. setup程序 ...
- Python numpy学习笔记(一)
下边代码是关于numpy的一些基本用法,包括数组和矩阵操作等... import numpy as np print "<== print version ==>" p ...
- css3 3d学习笔记
几个属性: -webkit-perspective:0;景深(默认0), -webkit-perspective-origin:center center;景深基点(默认中间), -webkit-tr ...
- JPG 批量压缩、 PNG32、PNG24转PNG 透明批量压缩工具 【JPNG】 支持多级目录
说在最前,压缩不一定是最好的,仅仅是为了方便自己工作需要.主要是手机端图片 算法说明:JPG压缩使用的是 adobe 的 JPGEncoder+ AIR的JPEGEncoderOptions (注 ...
- 加载.properties方式
相对路径时注意:是相对项目(即包下)还是相对当前类(一般都是相对当前项目)(对于非class的资源文件eclipse编译时会直接放到bin目录下) 1.一般是从目录中加载:需要指明路径 2.另外就是通 ...
- 子div用了float浮动之后,如何撑开父元素,让父元素div自动适应高度的问题
方法一: html: <div id="all1"> <div id="left1">1</div> <div id= ...
- DDL和DML的定义和区别
DML(Data Manipulation Language)数据操纵语言: 适用范围:对数据库中的数据进行一些简单操作,如insert,delete,update,select等. DDL(Data ...