用Visual Studio.NET 2008实现Ajax+WCF Service交互


Visual Studio.NET 2008已经出了Beta2版。相信有些朋友已经下载尝鲜了。与Visual Studio.NET 2008一起发布的.NET Framework 3.5对于JavaScript及Json有着非常好的支持,这将使得客户端的Ajax代码可以非常方便的和服务器交互,传送数据。下面有一个简短例子可以帮助您了解这些特性。

在这个例子里面,我们用Ajax的方式查询服务器上进程情况。

首先我们先打开Visual Studio.NET 2008并创建一个ASP.NET Web Site。

然后,我们在这个项目里面添加一个Ajax-enabled WCF Service: ProcessService。

这里我们可以看到,一个默认的WCF Service已经被生成:

[ServiceContract(Namespace="")][AspNetCompatibilityRequirements(RequirementsMode=AspNetCompatibilityRequirementsMode.Allowed)]public class DiscService...{// Add [WebGet] attribute to use HTTP GET[OperationContract]public void DoWork()...{// Add your operation implementation herereturn;}    // Add more operations here and mark them with [OperationContract]}

这里我们就需要作一些小小的修改:

using System;using System.Runtime.Serialization;using System.ServiceModel;using System.ServiceModel.Activation;using System.ServiceModel.Web;using System.IO;using System.Diagnostics;using System.Collections.Generic;[ServiceContract(Namespace="")][AspNetCompatibilityRequirements(RequirementsMode=  AspNetCompatibilityRequirementsMode.Allowed)]public class DiscService...{// Add [WebGet] attribute to use HTTP GET[OperationContract]public MyProcess[] GetProcess(string random)...{List myProcesses = new List();Process[] processes = Process.GetProcesses();foreach (Process process in processes)...{MyProcess mp = new MyProcess();mp.ProcessName = process.ProcessName;mp.Memory = process.VirtualMemorySize64;mp.ThreadCount = process.Threads.Count;myProcesses.Add(mp);}return myProcesses.ToArray();}    // Add more operations here and mark them with [OperationContract]}[DataContract]public class MyProcess...{[DataMember]public long Memory;    [DataMember]public int ThreadCount;    [DataMember]public string ProcessName;}


修改好编译项目,然后用浏览器浏览ProcessService.svc, 这时候可以看到一些WCF的说明关于当前WCF Service的Meta publishing 被disabled了。不要紧,现在你可以在URL后面输入一个/js后缀,比如我这里URL是:http://localhost:1314/AjaxWithWCF/ProcessService.svc/js。这时候你就会看到一个下载提示框,你可以通过这个URL得到一个Javascript的proxy文件,这些javascript是用来访问我们刚刚建立的WCF Service的。

现在我们的Service端准备好了,接下来就是添加一个Ajax Web Form. (默认的Ajax Web Form 会帮我们添加必要的Web.config section, 同事也会在aspx Code里面添加一个ScriptManager)让我们来添加一个按钮和一个搜索框以及简单的Javascript来访问这个Service.

我们可以在Form 里面加上这些代码:

<script type="text/javascript" src="ProcessService.svc/js"></script><script type="text/javascript" >...function GetProcessList()...{ProcessService.GetProcess(Math.random().toString(), GetProcessSuccess, GetProcessFail, "");}function GetProcessSuccess(result)...{var div = document.getElementById("processlist");for(var i=0;i<result.length;i++)...{var mp = document.createTextNode(result[i].ProcessName + " Thread:" + result[i].ThreadCount + " memory:" + result[i].Memory); var newLine = document.createElement("br");div.appendChild(mp);div.appendChild(newLine);}}function GetProcessFail(error)...{}</script><input type="button" onclick="javascript:GetProcessList()" value="refresh" /><div id="processlist"></div>


运行结果大家可以自己试一下。需要说明的几点是:

调用时就是:类名.方法名(参数1,参数2,...,成功处理函数,失败处理函数,"");
成功处理函数和失败处理函数处理见sample;
代码一定要加在Form里面,否则会报错;
这里random参数没有被使用,目的有两个,一个是让大家看到参数怎么传递,二来ajax调用Request往往需要一个变化的内容,要不然cache可能会直接返回一个之前的response。

这里列表每次没有清空,大家可以添加一下相关代码。

总的来说,Visual Studio.NET 2008里面的Ajax开发被大大的增强了,这不就是我们一直所期待的吗?

本文作者:
« 
» 
快速导航

Copyright © 2016 phpStudy | 豫ICP备2021030365号-3