本文继续介绍使用ASP.NET3.5中的AJAX环境中如何从客户端JavaScript调用Web服务方法。编写本文的目的在于让大家深刻了解基于ASP.Net3.5的Ajax和Web的服务，虽然例子比较简单，但是比较能说明问题。在这里我又介绍了命名空间System. Web.Script的方式确定客户端调用Web服务方法。

在AJAX中调用Web服务方法可以提高Web用户的体验，微软在ASP.NET3.5中的AJAX加入了它的新功能，新的功能可以从客户端JavaScript调用Web服务方法无刷新整个页面。AJAX技术使你能够调用服务器端的方法，没有post back。客户端脚本可以提出请求的Web方法，并可以通过数据作为输入参数的方法和数据也可以从服务器发回给客户端浏览器。

 
为了使你的应用程序调用的ASP.NET Web service使用客户端脚本，服务器异步通信层会自动生成的JavaScript代理类。代理类生成为每个Web服务的
一个<asp:ServiceReference>元素被列入<asp:ScriptManager>控制的页面。
<asp:ScriptManager runat="server" ID="scriptManagerId">
     <Services>
            <asp:ServiceReference  Path="WebService.asmx" />
     </Services>
</asp:ScriptManager>
这是下载的代理类的浏览器在网页加载时间，并提供了一个客户端对象，代理调用方法的Web服务。在调用相应的方法所产生的JavaScript的代理类。该代理类打开通信与网络服务。这些请求通过的XMLHTTP对象的浏览器异步通讯。 
如下图所示，详细规定了不同的层上的客户机和服务器方面通讯框架。
<asp:ScriptReference>元素指定注册一个JavaScript文件，用来在网页中。只有在注册CallWebServiceMethod.js文件，您才可以在方法上进行调用，调用Web服务方法的脚本是异步的。获得返回值或以确定何时返回的请求，您必须提供一个成功的回调函数。回调函数被调用时，请求已成功完成，并且它包含的返回值（如果有的话）从Web方法调用。您也可以提供一个失败的回调函数来处理错误。此外，您还可以通过用户的背景资料，使用中的回调函数。
如下图，是WCF和Ajax调用Web service时序图。

在上一篇文章（基于ASP.NET 3.5 Web Service 的JSON扩展应用）中已经讲过，JSON - JavaScript对象符号是默认序列化格式，使用它进行数据转换之间客户端服务器请求。您可以禁用所有目前启用的协议像HTTP-GET、HTTP-POST，甚至的XML格式的SOAP中使用的早期形式的Web服务。以下设置在Web.config文件同样也是这样使用。

<system.web>
    <webServices>
        <protocols>
          <clear/>
        </protocols>
      </webServices>
</system.web>

 
请求一个Web服务方法通过这些层面。你可以看到如何使用一种方法，要求在一个可用的代理对象和Web请求中，并由一个XMLHttp对象在客户端浏览器端运行。在服务器端，你的要求是与往常一样是由一个HTTP处理程序，发出的XML/JSON序列化。
如下图所示，asp.net 3.5调用Ajax与Web服务的类关系图。
在AJAX中使用Web服务方法包括两个步骤：第一步是，创建和定义Web服务。第二个步，是使用客户端脚本来从一个网页的服务通话方法。创建一个Web服务：
在System.Web.Scripts.Services命名空间，你可能会发现一个属性类“ScriptSrvice ”，这需要适用于Web服务类，使Web服务方法可以调用来自客户端的脚本。这将使代理生成脚本来生成一个代理对象对应于Web服务类。
同样，在相同的命名空间，可能会发现另一个属性类“ScriptMethod”，如果采用此属性为Web方法，你可以指定哪些HTTP动词是用来调用一个方法和响应形式。此属性有三个参数描述如下：
UseHttpGet ：如果设置为true，将调用该方法使用HTTP GET命令。默认值为false 。

      ResponseFormat ：指定是否反应将序列化的简JSON或XML 。默认值为JSON。

      XmlSerializeString ：指定是否所有返回类型，包括字符串类型，是为XML序列化的值将被忽略XmlSerializeString连续的响应来系列化的JSON 。

 
现在，创建新的Web使用ASP.NET Web Service模板在Microsoft Visual Studio 2008和修改Web服务类如下:
using System.Web.Script.Services;

namespace AjaxWebService
{
    [WebService(Namespace = "http://localhost:1382/AjaxWebService/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [ScriptService]
    public class Service : System.Web.Services.WebService
    {
        string myXmlData = @"<?xml version=""1.0"" encoding=""utf-8"" ?>
                <Book>
                    <Title>Programming ASP.NET 3.5, AJAX and Web Services</Title>
                </Book>";
       
        /// <summary>
        /// This method uses JSON response formatting 
        /// </summary>
        /// <param name="months"></param>
        /// <returns></returns>
        [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
        [WebMethod]
        public string getNextBackupDate(int months)
        {
            return DateTime.Now.AddMonths(months).ToShortDateString();
        }
        
        /// <summary>
        /// This method uses XML response formatting
        /// </summary>
        /// <returns></returns>
        [ScriptMethod(ResponseFormat = ResponseFormat.Xml)]
        [WebMethod]
        public XmlDocument GetBookTitle()
        {
            XmlDocument xmlDoc = new XmlDocument();
            xmlDoc.LoadXml(myXmlData);
            return xmlDoc;
        }
       
        /// <summary>
        /// This method uses HTTP-GET protocol to call it
        /// </summary>
        /// <returns></returns>
        [ScriptMethod(UseHttpGet = true)]
        [WebMethod]
        public string HelloWorld()
        {
            return "Hello, world";
        }
    }
}


 
注：Web服务创建的ScriptService使用如上将不会被浏览器默认。您需要修改文件中的设置Web.config文件如下，以测试上述Web服务。
<webServices>
     <protocols>
       <add name="HttpGet"/> 
       <add name="HttpPost"/>
    </protocols>
</webServices>

 
调用Web服务方法使用客户端脚本，Asp.Net Web服务方法可以说是从客户端脚本异步不回传，并没有刷新整个页面。只有其之间传输数据的服务器和客户端的浏览器。

目前，.NET 3.5框架支持Web服务和客户端的网页可以在相同的域（同一网站）。
现在增加一个新的“Ajax激活Web页” ，以现有的Web服务项目并添加控件的网页中指定的标记如下，编写JavaScript函数调用Web服务和回调方法。调用Web服务方法
是通过使用代理类和参数列表，成功回调函数名，失败的回调函数，用户方面是通过额外的参数的要求调用。
<%@ Page  Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="AjaxWebService.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>AJAX Web Form</title>
    <script type="text/javascript">

function CallNextDate() 
    {
        AjaxWebService.Service.getNextBackupDate(1, OnSucceeded);
    }

function CallHelloWorld() 
    {
        AjaxWebService.Service.HelloWorld(OnSucceeded);
    }
   function CallBookTitle() 
    {
        AjaxWebService.Service.GetBookTitle(OnSuccess, OnFail, "XmlDocument");
    }
    
    // This is the callback function that processes the Web Service return value in JSON format.
    function OnSucceeded(result)
    {
        var myresult = document.getElementById("Text1");
        myresult.value = result;
    }
    
   // This is the callback function that processes the Web Service return value in XML format.
    function OnSuccess(result)
    {
        var myresult = document.getElementById("Text1");
        myresult.value = "Title: " + result.documentElement.text;
    }
    
   // This is the callback function that processes the Web Service return value in XML format.
    function OnFail(error)
    {
        var myresult = document.getElementById("Text1");
        myresult.value = "Service Error: " + error.get_message();
    }

     </script>
  
    <style type="text/css">
        #Text1
        {
            width: 375px;
        }
        #Button2
        {
            width: 140px;
        }
    </style>
  
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        <Services>
        <asp:ServiceReference Path="~/Service.asmx"/>
        </Services>
        </asp:ScriptManager>
        <br />
        Result:&nbsp;&nbsp;         <input id="Text1" type="text" /><br />
        <br />
        <input id="Button1" type="button" value="Get Server Time" onclick="CallNextDate()" />&nbsp;&nbsp;
        <input id="Button2" type="button" value="Say Hello World" onclick="CallHelloWorld()" />&nbsp;&nbsp;
        <input id="Button3" type="button" value="Get Book Title" onclick="CallBookTitle()" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <br />
        <br />
        <br />
        </div>
    </form>
</body>
</html>

 
在上面的标记，通知的路径属性如何在ServiceReference元素ScriptManager控制点到Web服务类。这使得Web服务方法被称为从脚本中的default.aspx页面。内嵌功能CallNextDate ， CallHelloWorld ， CallBookTitle是用来调用的三个Web服务方法。 OnSuccess和OnFail方法是回调方法，得到执行的Web服务的方法得到了执行。为了使客户端的Web页的正常工作，您需要添加以下设置的Web.config文件。
<runtime>
    <assemblyBinding xmlns="urn:schemas-microsoft-com:asm.v1">
      <dependentAssembly>
        <assemblyIdentity name="System.Web.Extensions" publicKeyToken="31bf3856ad364e35"/>
        <bindingRedirect oldVersion="1.0.0.0-1.1.0.0" newVersion="3.5.0.0"/>
      </dependentAssembly>
      <dependentAssembly>
        <assemblyIdentity name="System.Web.Extensions.Design" publicKeyToken="31bf3856ad364e35"/>
        <bindingRedirect oldVersion="1.0.0.0-1.1.0.0" newVersion="3.5.0.0"/>
      </dependentAssembly>
    </assemblyBinding>
  </runtime>
本文使用微软ASP.NET 3.5引用的System.Web.Extensions.dll等DLL，利用内置的ASP.NET3.5中的AJAX技术仅供学习人员参考。
参考代码下载

转载于:https://blog.51cto.com/xiaoyinnet/196073

使用ASP.Net 3.5 的Ajax与Web服务开发实例相关推荐

  1. asmx 接受 ajax post,jQuery ajax调用web服务（asmx）触发认证弹出框

    在我的asp.net 4.0电子商务web应用程序中,登录的客户可以点击锚点,如"过去6个月内的订单"或"订单去年"来查看他过去的订单.当点击这样的锚,我做一个 ...

  2. ASP.NET 创建、发布、使用Web服务的详细方法

    一.创建Web服务 1.首先,打开VS(本例以VS2017为例).创建一个ASP.NET Web 应用程序,位置和名称自定义,本例我把这个项目创建在桌面,名字叫helloWho.然后点击[确定],在弹 ...

  3. 结合使用Ajax和Web服务

    什么是Web服务? Web服务是使用万维网公开应用程序功能的一种方式. 它通过使用开放协议来做到这一点,因此任何可以访问Web的使用应用程序也可以访问Web服务. 加入My developerWork ...

  4. ajax请求web服务返回json格式

    由于.net frameword3.5以上添加了对contenttype的检查,当ajax发送请求时,如果设置了contenttype为json,那么请求webservice时,会自动将返回的内容转为 ...

  5. 在ASP.NET AJAX 1.0框架中访问Web服务

    一. 简介     如今,微软最新推出的AJAX框架为ASP.NET AJAX 1.0(下载地址为[url]http://ajax.asp.net/downloads/default.aspx[/ur ...

  6. ajax在项目中怎么使用,我如何添加项目在sql中使用jQuery（ajax）通过web服务

    我有一个web服务,并在其中有两种方法(select,insertdata).我想用jquery在sql中插入一条记录.我怎样才能做到这一点?我已经制作了该代码,但它不起作用.请帮助我.我如何添加项目 ...

  7. 第三十五 ASP.NET和Web服务（二）

    *摘要 .异步Web服务 .Web服务中的事务处理 .Web服务中的缓存技术 .WSE技术 * Web服务 .Web Service是在Internet上进行分布式计算的基本构造块. .WebServ ...

  8. [导入]Learning.ASP.NET 2.0.with.AJAX.pdf(14.14 MB)

    ASP.NET 2.0的AJAX无疑是最快,最有效,最可靠和最佳的方式支持创建交互式Web应用程序上市.结合开发工具,可以从Microsoft ,免费和商业,这是 难以置信轻松地创建网站,看看伟大的表 ...

  9. 微軟 ASP.NET 2.0 的 AJAX 利劍 ～ Atlas Framework

    MSDN 程式開發講座: 微軟 ASP.NET 2.0 的 AJAX 利劍 - Atlas Framework 作者:奚江華 [ASP.NET網頁設計與C#]書籍作者 DotNet 開發聖殿 Blog ...

最新文章

  1. 如何在本地安装tomcat、jdk并且配置tomcat环境变量（window7）
  2. 5G NPN 行业专网 — 部署模式
  3. java B2B2C Springboot电子商务平台源码-Feign设计原理
  4. html教程padding,HTML CSS——margin和padding的学习
  5. python斐波那契数列30_python的30个骚操作
  6. java 递归遍历对象所有属性_Java学习之Xml系列二：xml按条件查询、xml递归遍历所有元素和属性...
  7. oracle 9i手动启动数据库,Oracle9iAS (之五): 手工起动，关闭系统
  8. 20211027:《Labuladong的算法小抄》学习记录（一）
  9. androidpn的学习研究（四）androidpn-client客户端几个类说明
  10. LZJ流体质量计算机价格,LZJ-ⅢC型流体质量计算机
  11. 网络编程 2 套接字socket
  12. Xamarin Mono For Android
  13. 为什么只看重结果_太过于看重结果会失掉过程
  14. 【矩阵乘】【DP】【codevs 1305】Freda的道路
  15. RooT最好软件，root手机最好的软件
  16. Android 基于Message的进程间通信 Messenger完全解析
  17. Database-3：SQL语句之DQL
  18. python:小鱼的航程
  19. 半导体鼻祖：仙童半导体的故事
  20. 蓝桥杯基础练习---特殊数字

热门文章

  1. AC日记——斗地主（dfs）
  2. 去邵程程博客，得到很有喜感图片一张
  3. 网管管理的12种方法
  4. LeetCode 426. 将二叉搜索树转化为排序的双向链表
  5. git上的分支命名规范
  6. MyBatis Generator模板
  7. 【Redis】Redis分布式集群几点说道
  8. Java中实现DES加解密的一个类
  9. 644 - Immediate Decodability
  10. 关于“做一个聊天+信息分享客户端”的设想（SNS？）