ASP.NET Web Service详解：从创建到JavaScript调用-优快云博客

本文链接：https://blog.youkuaiyun.com/winfredzen/article/details/76197754

本文详细介绍了如何创建和使用ASP.NET Web Service，包括WebMethod的使用、重载以及如何通过JavaScript和jQuery AJAX进行调用。讨论了WSDL的作用、代理类的功能，以及Web服务在更新后客户端的同步处理。同时，文章还探讨了Web服务返回JSON数据的方式，以及处理JSON数组的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Web Service

参考ASP.NET Web Services Tutorial系列课程

WebService是开发互操作应用程序的标准方式，即应用程序能够调用另一应用程序的方法

创建Web Service，选择Web服务，如下：

创建web服务

创建后，会发现WebService类会有一个[WebService]的特性，并且继承自System.Web.Services.WebService。WebService的命名空间(Namespace )用来唯一标识你的web服务。WebService的命名空间可以为任意的字符串，但一般是公司的域名，如下的这种形式：

[WebService(Namespace = "http://pragimtech.com/webservices")]

使用WebService

在一个web应用中调用另一个WebService
1.右键”引用”，选择”添加服务引用”
2.在地址中，填入WebService的地址，如下：

这里写图片描述

可在命名空间中修改名字

3.使用

protected void btnAdd_Click(object sender, EventArgs e)
{
    CalculatorService.CalculatorWebServicesSoapClient client =  new CalculatorService.CalculatorWebServicesSoapClient();
    int result = client.Add(Convert.ToInt32(txtFirstNumber.Text), Convert.ToInt32(txtSecondNumber.Text));
    lblResult.Text = result.ToString();
}

一些问题
1.什么是WSDL，有什么用？
visual studio使用web服务的WSDL(Web Service Description Language)文件，来生成一个代理类。WSDL文档正式定义了一个Web服务。它包含：

1.Web服务公开的所有方法
2.参数及其类型
3.方法的返回类型

2.代理类的用途是什么？
client应用程序调用代理类的方法，然后代理类将参数序列化，准备一个SOAP请求消息并将其发送到Web服务。Web服务执行该方法，并向代理返回SOAP响应消息。然后代理类将反序列化SOAP响应消息，并将其交给客户端应用程序。不必将点.NET CLR对象序列化或反序列化为SOAP格式。代理类负责序列化和反序列化，使开发人员更加轻松。

还需要注意的一点是，如果webservice更新了，在client应用中也要更新webservice引用，如下：

这里写图片描述

WebMethod

一个WebService也不是一定要继承自System.Web.Services.WebService类，但如果WebService想要使用ASP.NET的 session 或者 application state 对象，继承System.Web.Services.WebService类会提供直接访问这些对象

如果想要使方法成为WebService的一部分而公开，方法必须是public的，且必须使用[WebMethod]特性来修饰，如下的方法：

        [WebMethod]
        public int Add(int firstNumber, int secondNumber)
        {
            return firstNumber + secondNumber;
        }

在WebService中要使用session对象，[WebMethod]特性的EnableSession的属性要设置为true

        [WebMethod(EnableSession = true)]
        public int Add(int firstNumber, int secondNumber)
        {
            ......
        }

使用session还要注意，在一个client应用中调用另一个WebService时，可能还需要在web.config中将allowCookies 设置为true

<basicHttpBinding>
  <binding allowCookies="true" name="CalculatorWebServicesSoap" />
</basicHttpBinding>

WebMethod的其它属性：

Description-用于指定Web服务方法的描述
BufferResponse-默认为true，表示XML Web服务方法的响应不会返回给客户端，直到响应完全序列化或缓冲区已满。设置为false，XML Web服务方法的响应在被序列化时返回给客户端。总的来说，只有在XML Web service返回大量数据时，才将BufferResponse设置为false，对于较小量的数据，当BufferResponse设置为true时，Web服务性能会更好
CacheDuration-缓存WebService方法的结果，是一个整数，指定响应缓存多少秒

WebMethod重载

方法重载允许类具有多个具有相同名称的方法，但具有不同的签名。WebService的WebMethod方法也可以重载，如下：

[WebMethod]
public int Add(int firstNumber, int secondNumber)
{
    return firstNumber + secondNumber;
}

[WebMethod]
public int Add(int firstNumber, int secondNumber, int thirdNumber)
{
    return firstNumber + secondNumber + thirdNumber;
}

但当运行这个WebService时，会有一个运行时异常

Both Int32 Add(Int32, Int32, Int32) and Int32 Add(Int32, Int32) use the message name 'Add'.  Use the MessageName property of the WebMethod custom attribute to specify unique message names for the methods.

此时要使用WebMethod特性的MessageName 属性来解决问题

[WebMethod(MessageName="Add2Numbers")]
public int Add(int firstNumber, int secondNumber)
{
    return firstNumber + secondNumber;
}

这样做之后，还有问题，还需要修改WebServiceBinding 特性，把

[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]

修改为：

[WebServiceBinding(ConformsTo = WsiProfiles.None)]

javascript调用webservice

参考Part 6 - Calling asp.net web service from javascript using ajax

javascript使用asp.net ajax来调用webservice，webservice类要添加 [System.Web.Script.Services.ScriptService]，关键步骤如下:

1.使用asp:ScriptManager

    <asp:ScriptManager ID="ScriptManager1" runat="server">
        <Services>
            <asp:ServiceReference Path="~/StudentService.asmx" />
        </Services>
    </asp:ScriptManager>

2.调用webservice

WebServicesDemo.StudentService.GetStudentByID(id, GetStudentByIdSuccessCallback, GetStudentByIdFailedCallback)

其中：

id表示传递的参数
GetStudentByIdSuccessCallback表示成功的回调
GetStudentByIdFailedCallback表示失败的回调

完整代码如下：

    <script type="text/javascript" language="javascript">
        function GetStudentById() 
        {
            var id = document.getElementById("txtStudentId").value;
            WebServicesDemo.StudentService.GetStudentByID(id, 
                GetStudentByIdSuccessCallback, GetStudentByIdFailedCallback);
        }

        function GetStudentByIdSuccessCallback(result) 
        {
            document.getElementById("txtName").value = result["Name"];
            document.getElementById("txtGender").value = result["Gender"];
            document.getElementById("txtTotalMarks").value = result["TotalMarks"];
        }

        function GetStudentByIdFailedCallback(errors) 
        {
            alert(errors.get_message());
        }
    </script>

jQuery AJAX与webservice

参考教程：

1.webservice返回的是一个对象
webservice返回的是一个对象，例如如下的webservice的方法，返回的是一个Student类型的对象，参数是学生ID：

[WebMethod]
public Student GetStudentById(int ID)
{
    ....
    return student;
}

使用jquery的ajax来访问webservice，如下：

                var stuId = $('#txtId').val();
                $.ajax({
                    url: 'StudentService.asmx/GetStudentById',
                    data: { ID: stuId },
                    method: 'post',
                    dataType: 'xml',
                    success: function (data) {
                        var jQueryXml = $(data);
                        $('#txtName').val(jQueryXml.find('Name').text());
                        $('#txtGender').val(jQueryXml.find('Gender').text());
                        $('#txtTotalMark').val(jQueryXml.find('TotalMarks').text());
                    },
                    error: function () {
                        alert('error xxxxxxxx');
                    }

                });

这种形式，其上传数据是formdata的形式
这里写图片描述

其返回数据的是xml形式
这里写图片描述

所以这里使用jQueryXml.find('Name')形式来获取数据

2.jQuery AJAX处理webservice返回的JSON数据
这里有两种方式让webservice返回json数据

a.一种是不需要修改webservice，还是返回一个对象，但是jQuery AJAX要做如下的改变：

contentType要设置为application/json; charset=utf-8，表示发送的是JSON数据
使用JSON.stringify()把发送的数据转为json
把dataType 改为json，表示你想接收的数据时json
修改success回调

要注意的一点是此时webservice返回的json一个key为d的字段

                var stuId = $('#txtId').val();
                $.ajax({
                    url: 'StudentService.asmx/GetStudentById',
                    contentType: 'application/json;charset=utf-8',
                    data: JSON.stringify({ ID: stuId }),
                    method: 'post',
                    dataType: 'json',
                    success: function (data) {
                        $('#txtName').val(data.d.Name);
                        $('#txtGender').val(data.d.Gender);
                        $('#txtTotalMark').val(data.d.TotalMarks);
                    },
                    error: function () {
                        alert('error xxxxxxxx');
                    }

                });

此时，发送的数据格式如下：

这里写图片描述

接收到数据如下：

这里写图片描述

b.另一种是修改webservice和jquery ajax

修改webservice，使其返回json数据

使用JavaScriptSerializer 把对象序列化为json，要使用using System.Web.Script.Serialization;
注意把方法的返回值设为void

关于JavaScriptSerializer可参考:

如下，修改后的方法为：

[WebMethod]
public void GetJSONStudentById(int ID)
{
        ....
    JavaScriptSerializer js = new JavaScriptSerializer();
    Context.Response.Write(js.Serialize(student));
}

修改后的jquery ajax如下：

                var stuId = $('#txtId').val();
                $.ajax({
                    url: 'StudentService.asmx/GetJSONStudentById',
                    data: { ID: stuId },
                    method: 'post',
                    dataType: 'json',
                    success: function (data) {
                        $('#txtName').val(data.Name);
                        $('#txtGender').val(data.Gender);
                        $('#txtTotalMark').val(data.TotalMarks);
                    },
                    error: function () {
                        alert('error xxxxxxxx');
                    }

                });

此时，发送的数据如下：

这里写图片描述

接收的数据如下：

这里写图片描述

3.jquery ajax处理返回的json数组
参考Handling json arrays returned from asp.net web services with jquery

过程与上面的类似，只是返回的结果是json数组

            function getAllStudents() {
                $.ajax({
                    url: 'StudentService.asmx/GetAllStudents',
                    dataType: "json",
                    method: 'post',
                    success: function (data) {
                        var studentTable = $('#tblStudent tbody');
                        studentTable.empty();

                        $(data).each(function (index, student) {
                            studentTable.append('<tr><td>' + student.ID + '</td><td>'
                                + student.Name + '</td><td>' + student.Gender
                                + '</td><td>' + student.TotalMarks + '</td></tr>');
                        });
                    },
                    error: function (err) {
                        alert(err);
                    }
                });
            }

4.使用jquery ajax和webservice保存数据
参考Save data using asp.net web services and jquery ajax

首先要创建一个添加数据的webservice方法：

        [WebMethod]
        public void AddStudent(Student student)
        {
            string cs = ConfigurationManager.ConnectionStrings["DBCS"].ConnectionString;
            using (SqlConnection con = new SqlConnection(cs))
            {
                SqlCommand cmd = new SqlCommand("insert into tblStudents values(@Name, @Gender, @TotalMarks)", con);
                SqlParameter[] param = new SqlParameter[]
                {
                    new SqlParameter("@Name", student.Name),
                    new SqlParameter("@Gender", student.Gender),
                    new SqlParameter("@TotalMarks", student.TotalMarks)
                };
                con.Open();
                cmd.Parameters.AddRange(param);
                int result = cmd.ExecuteNonQuery();

            }
        }

jquery ajax调用过程如下：

            $('#btnAddStudent').click(function () {
                var student = {};
                student.Name = $('#txtName').val();
                student.Gender = $('#txtGender').val();
                student.TotalMarks = $('#txtTotalMarks').val();

                $.ajax({
                    url: 'StudentService.asmx/AddStudent',
                    method: 'post',
                    data: '{student: ' + JSON.stringify(student) + '}',
                    contentType: "application/json; charset=utf-8",
                    success: function () {
                        getAllStudents();
                    },
                    error: function (err) {
                        alert(err);
                    }
                });
            });