### JavaScript调用WebService的多种方法
#### 一、引言
在Web开发中，JavaScript与WebService的结合使用非常常见，特别是在需要与后端服务进行交互的场景下。本文将详细介绍如何利用JavaScript结合XMLHttpRequest（简称XMLHTTP）来调用WebService，并提供具体的实现案例。
#### 二、XMLHttpRequest简介
XMLHttpRequest是浏览器提供的一个API，它允许网页发起异步请求并处理响应。通过XMLHttpRequest可以轻松地与服务器进行数据交换，从而实现动态页面的效果。在调用WebService时，XMLHttpRequest主要用来发送请求并接收返回的结果。
#### 三、WebService概述
WebService是一种跨平台的服务实现方式，它可以通过网络提供标准化的服务接口。WebService通常使用SOAP协议进行通信，SOAP协议基于XML格式，能够被各种编程语言所支持。
#### 四、使用XMLHttpRequest调用WebService
##### 4.1 原始方法：GET请求
**示例代码：**
```html
<script language="javascript">
function RequestByGet(name) {
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
// WebService位置
var url = "http://localhost:1323/WebSite6/Service.asmx/SayHelloTo?Name=" + encodeURIComponent(name);
xmlhttp.open("GET", url, false);
xmlhttp.setRequestHeader("Content-Type", "text/xml;charset=utf-8");
xmlhttp.setRequestHeader("SOAPAction", "http://tempuri.org/SayHelloTo");
xmlhttp.send(null);
var result = xmlhttp.status;
if (result === 200) {
document.write(xmlhttp.responseText);
}
xmlhttp = null;
}
</script>
```
**说明：**
1. **创建XMLHttpRequest对象**：在不同的浏览器中创建的方式可能有所不同，此处使用`new ActiveXObject("Microsoft.XMLHTTP")`适用于IE浏览器。
2. **设置请求方式**：使用`open`方法设置请求方式为GET。
3. **设置请求头**：`setRequestHeader`方法用于设置请求头，包括Content-Type和SOAPAction。
4. **发送请求**：使用`send`方法发送请求，GET请求参数直接附加在URL后面。
##### 4.2 POST请求
**示例代码：**
```html
<script language="javascript">
function RequestByPost(name) {
var data = '<?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> ' +
'<SayHelloTo xmlns="http://tempuri.org/"> ' +
'<Name>' + encodeURIComponent(name) + '</Name> ' +
'</SayHelloTo> ' +
'</soap:Body> ' +
'</soap:Envelope>';
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
var url = "http://localhost:1323/WebSite6/Service.asmx";
xmlhttp.open("POST", url, false);
xmlhttp.setRequestHeader("Content-Type", "text/xml;charset=utf-8");
xmlhttp.setRequestHeader("SOAPAction", "http://tempuri.org/SayHelloTo");
xmlhttp.send(data);
document.write(xmlhttp.responseText);
}
</script>
```
**说明：**
1. **构建SOAP消息体**：根据WebService的要求构建SOAP消息体，通常包含版本信息、命名空间声明等。
2. **设置请求方式**：使用`open`方法设置请求方式为POST。
3. **设置请求头**：与GET请求类似。
4. **发送请求**：使用`send`方法发送包含完整SOAP消息体的字符串。
#### 五、总结
通过以上两种方式，我们可以有效地使用JavaScript结合XMLHttpRequest来调用WebService。需要注意的是，在实际应用中还需考虑错误处理、跨域问题以及兼容性等问题。此外，随着技术的发展，现代Web开发更倾向于使用JSON等轻量级数据格式以及RESTful API而非传统的SOAP协议，但了解这些基础知识对于理解Web服务的工作原理仍然非常重要。
