第一个Atlas程序－异步调用Webservice

wangyihust

浏览: 433675 次

最近访客更多访客>>

xuHuihui

woodding2008

wxn_yxm

qcsjliu

博主相关

博客

微博

相册

留言

关于我

文章分类

全部博客 (401)

社区版块

存档分类

WebService Web ASP.net ASP VB

Creating an 'Atlas' Application

To begin, you will create an 'Atlas' Web application in Visual Studio. When you use the Visual Studio project template to create a new, blank 'Atlas' Web application, Visual Studio creates a normal Web site folder structure with the following additional items:

An executable file named Microsoft.Web.Atlas.dll, which resides in the Bin folder and provides server-side functionality.
A Web.config file with settings for 'Atlas' applications.

To create a new 'Atlas' Web application in Visual Studio

In the File menu, click New, and then click Web Site.
In the New Web Site dialog box, select the ASP.NET 'Atlas' Web Site template item.
In the Location list, select File System.
Specify a path and language for the application, and then click OK.

Creating a Web Service with a Single Method

Next, you will create an ASP.NET Web service with a single method that can be called by your 'Atlas' client script. Web services that work with 'Atlas' applications are not different from other ASP.NET Web services. 'Atlas' applications can run in any browser and connect to any type of Web-based service; the server does not have to be running ASP.NET or Windows.

To create the new Web service

In Solution Explorer, right-click the name of the site, and then click Add New Item.
In the Add New Item dialog box, under Visual Studio installed templates, select Web Service.
Name the file HelloWorldService.asmx and clear the Place code in separate file check box.
Select the language you want to use.
Click Add.

Add code to create a HelloWorld method in the Web service that returns the current date and time. The code must take a string as an input and return a formatted string with the current time and a message.

The following example shows a complete Web service that includes the HelloWorld method:

		<%@ WebService Language="C#" Class="Samples.AspNet.HelloWorldService" %> using System;using System.Web;using System.Web.Services;using System.Web.Services.Protocols; namespace Samples.AspNet {  [WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] public class HelloWorldService  :  System.Web.Services.WebService {    [WebMethod]   public string HelloWorld(String query)   {     string inputString = Server.HtmlEncode(query);     if(!String.IsNullOrEmpty(inputString))     {       return String.Format("Hello, you queried for {0}. The "         + "current time is {1}", inputString, DateTime.Now);     }     else     {       return "The query string was null or empty";     }   } }}

		<%@ WebService Language="VB" Class="Samples.AspNet.HelloWorldService" %> Imports System.WebImports System.Web.ServicesImports System.Web.Services.Protocols Namespace Samples.AspNet<WebService(Namespace:="http://tempuri.org/")> _<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _ Public Class HelloWorldService   Inherits System.Web.Services.WebService   <WebMethod()> _   Public Function HelloWorld(ByVal query As String) As String     Dim inputString As String = Server.HtmlEncode(query)     If Not String.IsNullOrEmpty(inputString) Then       Return String.Format("Hello, you queried for {0}. The " _         & "current time is {1}", inputString, DateTime.Now)     Else       Return "The query string was null or  empty"     End If   End Function  End ClassEnd Namespace

Save and close the file.

Creating a Web Page with a Remote Method Call

In this part of the walkthrough, you will create an ASP.NET page and add the client script needed to call the Web service you created earlier.

To create a Web page

Add a new ASP.NET page to your project and name it AtlasScript.aspx.
Note Be sure that you clear the Place code in separate file check box. For this walkthrough, you must create a single-file ASP.NET Web page.
Switch to Source view.

In the @ Page directive, set the Title attribute to Atlas Script Walkthrough as shown in the following example:

<script language="JavaScript" type="text/javascript"> function doClick(index, numTabs, id) { document.all("tab" + id, index).className = "tab"; for (var i=1; i < numTabs; i++) { document.all("tab" + id, (index + i) % numTabs).className = "backtab"; } document.all("code" + id, index).style.display = ""; for (var j=1; j < numTabs; j++) { document.all("code" + id, (index + j) % numTabs).style.display = "none"; } } </script> <style type="text/css"> td.code { padding-left:10px; padding-right:10px; padding-top:0px; padding-bottom:0px; border-left: 1px solid #B1B1B1; border-bottom: 1px solid #DADADA; border-top: none; border-right: 1px solid #DADADA; } td.tab { text-align:center; font: verdana; width:15%; border-top: 1px solid #B1B1B1; border-bottom: none; border-left: 1px solid #B1B1B1; border-left: 1px solid #B1B1B1; cursor: hand; background: #F0F0F0; padding: 3px; } td.backtab { text-align: center; font: verdana; width: 15%; border-top: 1px solid #B1B1B1; border-right: none; border-bottom: 1px solid #B1B1B1; border-left: 1px solid #B1B1B1; cursor: hand; background: #E3E3E3; padding: 3px; } td.space { width:70%; font: x-small verdana; padding: 0px 0px 0px 0px; border-top: none; border-right: none; border-bottom: 1px solid #B1B1B1; border-left: 1px solid #B1B1B1; background: white; } </style>

		<%@ Page Language="C#" Title="Atlas Script Walkthrough"  %>

		<%@ Page Language="VB" Title="Atlas Script Walkthrough"  %>

Copy the following markup and paste it into the file beneath the @Page directive.

Note the addition of the <atlas:ScriptManager> element, which automatically adds the references to the required JavaScript files that provide 'Atlas' functionality. In this case, the element also adds a reference to the Web service file.

<!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 id="Head1" runat="server">   <atlas:ScriptManager runat="server" ID="scriptManager">     <services>       <atlas:servicereference path="~/HelloWorldService.asmx" />     </services>   </atlas:ScriptManager>   <style type="text/css">     body { font: 11pt Trebuchet MS;        font-color: #000000;        padding-top: 72px;          text-align: center }        .text { font: 8pt Trebuchet MS }   </style>     </head>  <body>  <form runat="server">   <div>     Search for     <input id="SearchKey" type="text" />     <input id="SearchButton" type="button" value="Search"       onclick="DoSearch()" />   </div>  </form>  <hr style="width: 300px" />  <div>  <span id="Results"></span>  </div> </body></html>

Save the file, but do not close it yet.

Now you will add client-side script that calls the remote Web service you created. The 'Atlas' client library provides the background services and support to make the remote call work.

To write scripts to call the Web service

In the AtlasScript.aspx page, following the <div> element created in the previous task, paste the following code to call the Web service and display the results in the page:

<script type="text/javascript">  function DoSearch()
   {
     var SrchElem = document.getElementById("SearchKey");
     //异步调用Web服务，传递两个事件的回调函数：完成之后(也可以有OnTimeOut处理)
     HelloWorldService.HelloWorld(SrchElem.value, OnRequestComplete); 
   }
  
  //得到返回值.这个result是个objext类型的，可以传递一个类的实例过去,比如DataTable。
   function OnRequestComplete(result)
   {
     var RsltElem = document.getElementById("Results");
     RsltElem.innerHTML = result;
   } </script>

The DoSearch function calls the remote method in the Web service, passing the value that the user enters in the text box, and passing the name of a callback function. The callback function is necessary because you are making an asynchronous call to the Web service, and you must provide a mechanism for the Web service to notify the client when the call returns. The name of the local callback function (OnRequestComplete) is arbitrary, but for the remote call to work, it must match the name of the callback function in the page. You can optionally provide a third parameter that contains the name of a function to be called if the server request times out while trying to call the remote method.

The OnRequestComplete function is called when the asynchronous call is completed. The function takes the result parameter, which is used to pass the return value of the Web service call. In the example, you display the value of the result parameter as the innerHTML property of the <span> element.

Make sure that the code following the @ Page directive looks like the following example, and then save and close the file.

<!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 id="Head1" runat="server">   <atlas:ScriptManager runat="server" ID="scriptManager">     <services>       <atlas:servicereference path="~/HelloWorldService.asmx" />     </services>   </atlas:ScriptManager>   <style type="text/css">     body { font: 11pt Trebuchet MS;        font-color: #000000;        padding-top: 72px;          text-align: center }       .text { font: 8pt Trebuchet MS }   </style>   </head> <body>  <form runat="server">   <div>     Search for     <input id="SearchKey" type="text" />     <input id="SearchButton" type="button"        value="Search"        onclick="DoSearch()" />   </div>  </form>  <hr style="width: 300px" />  <div>   <span id="Results"></span>  </div>  <script type="text/javascript">     function DoSearch()   {     var SrchElem = document.getElementById("SearchKey");     Samples.AspNet.HelloWorldService.HelloWorld(SrchElem.value,       OnRequestComplete);   }     function OnRequestComplete(result)   {     var RsltElem = document.getElementById("Results");     RsltElem.innerHTML = result;   }    </script> </body></html>

You can now test your page.

To test the page

Run the AtlasScript.aspx page.
Type some text into the search box, and then click the Search button. The text is returned from the HelloWorld method in the Web service and displayed in the page.

来源：http://atlas.asp.net/docs/Walkthroughs/GetStarted/Basic.aspx

分享到：