VS2008中JavaScript调用WebServices的实现教程

WebServices学习背景

近期任务告一段落，利用空闲时间深入学习了WebServices的相关知识。整体感觉这一技术体系既有趣味性，上手难度也相对适中。

创建ASP.NET网站项目

第一步，使用Visual Studio 2008环境新建一个ASP.NET网站项目。

第二步，在项目解决方案资源管理器中右键点击项目名称，选择“添加新项”，然后在弹出的对话框中选择“Web 服务”选项，具体操作界面可参考相关图示。

配置Web服务代码

执行上述操作后，项目将自动生成WebService.cs和WebService.asmx两个核心文件。接下来需要在WebService.cs文件中编写具体的服务逻辑代码。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Script.Services;
/// <summary>
///WebService 的摘要说明
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
//注意添加下面代码//
[ScriptService]
//若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。
// [System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService
{
public WebService()
    {
//如果使用设计的组件，请取消注释以下行
//InitializeComponent();
    }
[WebMethod]
public string HelloWorld()
    {
return "Hello World";
    }
[WebMethod]
public int GetSum(int a, int b)
    {
int sum = a + b;
return sum;
    }
}

前端页面与JavaScript交互实现

接下来配置Default.aspx页面，具体代码结构如下：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<script language="javascript">
function Method(obj)
     {
document.getElementById("txtSum").value = obj;
     }
function Hello()
     {
WebService.HelloWorld(backMethod);
     }
function getSum()
     {
var a,b;
a = document.getElementById("txtA").value;
b = document.getElementById("txtB").value;
try
        {
WebService.GetSum(a, b, Method);
        }
catch(err)
        {
alert(err.description);
        }
     }
</script>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Services>
<asp:ServiceReference InlineScript="True" Path="WebService.asmx" />
</Services>
</asp:ScriptManager>
<input type="button" id="btHello" value="Hello" onclick="Hello();" /><br />
<input type="text" id="txtA" value="" />+
<input type="text" id="txtB" value="" />=
<input type="text" id="txtSum" value="" />
<input type="button" id="btSum" value="求和" onclick="getSum();" /><br />
</div>
</form>
</body>
</html>

通过上述配置，即可实现前端JavaScript对WebServices方法的便捷调用。值得注意的是，WebServices同样支持返回DataSet等复杂结果集。后续仍需持续深入研习WebServices相关技术。若读者拥有优质的WebServices学习资料或推荐网站，欢迎分享交流，以促进共同学习与进步。