使用ASP.NET AJAX 调用web service-优快云博客

本文链接：https://blog.youkuaiyun.com/alexcao247/article/details/2699413

使用ASP.NET AJAX：让Hello说的轻松一点

可以看出，在上面的实现过程中，JS脚本非常麻烦，不仅要处理各种浏览器的差别（其实我上面的代码还没有照顾到所有浏览器），还要在回调函数中判断相应状态。调用过程也必须手工进行。那么，我们可不可以在JS中直接调用后台代码中的某个方法呢？就像在后台调用一样。答案是肯定的，只要我们使用ASP.NET AJAX。

ASP.NET AJAX框架在VS2008中是自带的，但如果你和我一样使用的是VS2005和.net framework2.0和话，则需要手工安装。在微软官方网站有下载，安装过程也和普通软件安装很相似，这里不再赘述。

下面，我们使用ASP.NET AJAX框架再次实现这个应用。

1.创建工程

这一次，我们还是需要创建一个新的网站，不同的是，我们选择ASP.NET AJAX-Enabled Web Site，使用这个项目创建网站后，VS将自动在Web.config中配置好这个框架需要的配置项，而且会在页面中自动加入一个ScriptManager控件，这个控件是ASP.NET AJAX应用所必不可少的。创建完成后，仍需要新建App_Code文件夹。

2.创建后台程序

这个和上一部分的后台程序非常类似，仍是在App_Code文件夹下建立Hello.cs，代码如下：

Hello.cs:

using System;
2

public class Hello
4

{
5

public Hello() { }
6

public string SayHello()
8

{
9

return "Hello!ASP.NET AJAX";
10

}
11

}

3.创建WebService

其实，使用ASP.NET AJAX框架后，JS是可以直接调用后台类中的方法的，但是这里不建议这样做，而是使用WebService作为过渡，让JS调用WebService。关于其中的理由，将在以后介绍。

在网站工程下新建WebService文件SayHelloService，这时VS会自动在App_Code文件夹下建立对应的代码文件，SayHelloService.cs，具体程序代码如下：

SayHelloService.cs:

using System;
2

using System.Web;
3

using System.Collections;
4

using System.Web.Services;
5

using System.Web.Services.Protocols;
6

using System.Web.Script.Services;
7

[WebService(Namespace = " http://tempuri.org/ " )]
9

[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
10

[ScriptService]
11

public class SayHelloService : System.Web.Services.WebService
12

{
13

public SayHelloService() { }
14

[WebMethod]
16

public string SayHello()
17

{
18

Hello myHello = new Hello();
19

return myHello.SayHello();
20

}
21

}
22

其中要特别注意三个地方，一个是using Web.Script.Services，这里必须引入这个命名空间。然后就是SayHelloService类上面的[ScriptService]属性（Attribute）和SayHello方法上面的[WebMethod]属性，这两个属性对于JS的访问是不可缺少的。

4.编写JavaScript

这时，ajax.js文件的代码如下：

ajax.js:

// 单击btnSayHello时调用的JS函数
2

function btnSayHello_onClick()
3

{
4

SayHelloService.SayHello(HandleStateChange);
5

}
6

// 回调函数
8

function HandleStateChange(reusltText)
9

{
10

$get("result").innerHTML=reusltText;
11

}

这里我们看到了神奇的事情：35行JS代码变成了11行，并且这里直接使用了SayHelloService.SayHello()这样的方法，这个方法是定义在SayHelloService.cs里的，而在这里的JS中就像在后台一样，直接调用了这个方法，并不需要创建对象、发送请求等一大套东西。这里也不用担心浏览器差别问题，因为这个框架已经为我们屏蔽了浏览器差异。

而且回调函数中，不需要判断状态了，因为ASP.NET AJAX自动分开了成功时调用的回调函数和失败时调用的回调函数。而且这里用“$get”代替了“getElementById”，这也是这个框架给我们提供的便利。

5.主页

现在我们再看看主页代码：

Default.aspx: