Verfügbarmachen von Webdiensten für Clientskript
Aktualisiert: November 2007
Die AJAX-Funktionalität in ASP.NET gibt Ihnen die Möglichkeit, ASP.NET-Webdienste (ASMX-Dateien) mithilfe von Clientskript im Browser aufzurufen. Dies verbessert die Benutzerfreundlichkeit der Webanwendung. Serverbasierte Methoden können von dieser Seite ohne Postback und ohne Aktualisierung der ganzen Seite aufgerufen werden, da zwischen dem Browser und dem Webserver lediglich Daten übertragen werden.
In diesem Thema wird beschrieben, wie ein Webdienst für im Browser ausgeführtes JavaScript verfügbar gemacht wird.
ASP.NET erstellt automatisch JavaScript-Proxyklassen für Webdienste. Proxyklassen werden von der Sys.Net.WebServiceProxy-Klasse abgeleitet. Sie können eine Webdienstmethode aufrufen, indem Sie die entsprechende Methode der JavaScript-Proxyklasse aufrufen. Weitere Informationen finden Sie unter Aufrufen von Webdiensten vom Clientskript.
Webdienste für Skripts zugänglich machen
Damit ein Webdienst für Skripts zugänglich ist, muss es sich um einen ASMX-Webdienst handeln, dessen Webdienstklasse mit dem ScriptServiceAttribute-Attribut qualifiziert wird. Einzelne Methoden, die im Skript aufgerufen werden sollen, müssen mit dem WebMethodAttribute-Attribut qualifiziert werden.
Im folgenden Beispiel werden diese Attribute in Webdienstcode gezeigt.
[ScriptService]
public class SimpleWebService : System.Web.Services.WebService
{
[WebMethod]
public string EchoInput(String input)
{
// Method code goes here.
}
}
<ScriptService> _
Public Class SimpleWebService
Inherits System.Web.Services.WebService
<WebMethod> _
Public Function EchoInput(ByVal input As String) As String
' Method code goes here.
End Function
End Class
Um Webdienstaufrufe in Skripts zu ermöglichen, muss der ScriptHandlerFactory-HTTP-Handler in der Datei Web.config der Anwendung registriert werden. Der Handler verarbeitet die vom Skript ausgehenden Aufrufe von ASMX-Webdiensten. Im folgenden Beispiel wird das Web.config-Element zum Hinzufügen des Handlers veranschaulicht.
.gif "Hinweis") Hinweis: |
|---|
Diese Konfigurationseinstellungen sind bereits Teil der Web.config-Dateivorlage für alle neuen AJAX-fähigen Websites, die Sie in Microsoft Visual Studio 2005 erstellen. |
<system.web>
<httpHandlers>
<remove verb="*" path="*.asmx"/>
<add verb="*" path="*.asmx"
type="System.Web.Script.Services.ScriptHandlerFactory"
validate="false"/>
</httpHandlers>
<system.web>
Bei Webdienstaufrufen, die nicht von ASP.NET-AJAX-Skript ausgehen, delegiert der ScriptHandlerFactory-Handler den Aufruf an den Standardhandler, der das SOAP- anstelle des JSON-Formats verwendet. Die Delegierung wird automatisch ausgeführt, und Sie müssen nur dann weitere Maßnahmen ergreifen, wenn Sie die Verwendung des SOAP-Protokolls für die Webdienste deaktivieren möchten. In diesem Fall müssen Sie die folgende Konfigurationseinstellung in die Datei Web.config eingeben.
<system.web>
<webServices> <protocols> <clear/> </protocols> </webServices>
</system.web>
Verfügbarmachen von Webdiensten für Clientskript in einer ASP.NET-Webseite
Damit ein ASMX-Webdienst von Clientskript in einer ASP.NET-Webseite aufgerufen werden kann, muss der Seite ein ScriptManager-Steuerelement hinzugefügt werden. Sie können auf den Webdienst verweisen, indem Sie ein untergeordnetes Element des Typs asp:ServiceReference zum ScriptManager-Steuerelement hinzufügen und dann das path-Attribut des Serververweises auf die URL des Webdiensts festlegen. ASP.NET wird durch das ServiceReference-Objekt angewiesen, eine JavaScript-Proxyklasse zu generieren, mit der der angegebene Webdienst von Clientskript aus aufgerufen werden kann.
Im folgenden Beispiel wird veranschaulicht, wie ein Webdienst mit dem Namen SimpleWebService.asmx von Skript in einer ASP.NET-Webseite aufgerufen werden kann.
<asp:ScriptManager ID="scriptManager">
<Services>
<asp:ServiceReference
path="~/WebServices/SimpleWebService.asmx" />
</Services>
</asp:ScriptManager>
Das ServiceReference-Objekt kann nur auf einen Webdienst verweisen, der sich in der gleichen Domäne wie die Seite befindet. Der Webdienstpfad kann ein relativer, ein zur Anwendung relativer, ein zur Domäne relativer oder ein absoluter Pfad sein. Bei absoluten Pfaden müssen Sie sicherstellen, dass sich der Pfad auf dieselbe Domäne bezieht.
Beim Rendern einer Seite, die dieses ScriptManager-Steuerelement enthält, wird von der Seite eine JavaScript-Proxyklasse für den Webdienst SimpleWebService.asmx erstellt. Die Proxyklasse verfügt über Methoden, die den Webmethoden des Diensts SimpleWebService.asmx entsprechen. Die Seite enthält außerdem JavaScript-Proxyklassen, die den als Eingabeparameter oder Rückgabewerte für Webdienstmethoden verwendeten Serverdatentypen entsprechen. Dies ermöglicht Ihnen, Clientskript zur Initialisierung dieser Parameter zu schreiben und die Parameter dann dem Methodenaufruf zu übergeben.
Die InlineScript-Eigenschaft des ServiceReference-Objekts gibt an, wie die JavaScript-Proxyklasse in der Seite enthalten ist. Wenn InlineScript auf false festgelegt ist (Standardeinstellung), wird das Proxyskript durch eine separate Anforderung abgerufen. Diese Option empfiehlt sich, wenn mehrere Seiten auf den gleichen Dienst verweisen und die Browserzwischenspeicherung aktiviert ist.
Wenn InlineScript auf true festgelegt ist, wird das Proxyklassenskript als Inline-Skriptblock in die Seite eingeschlossen. Dies kann die Leistung verbessern, indem die Anzahl von Netzwerkanforderungen reduziert wird. Insbesondere ist dies der Fall, wenn viele Dienstverweise in der Seite vorhanden sind und andere Seiten nicht auf denselben Dienst verweisen. Wenn InlineScript auf true festgelegt ist, müssen Sie einen relativen Pfad verwenden. Wenn der Pfad relativ zur Domäne ist, muss er auf die gleiche Webanwendung verweisen.
Die folgenden Beispiele zeigen einen einfachen Webdienst, der im Skript aufgerufen wird und die Eingabe des Benutzers anzeigt und die aktuelle Serverzeit zurückgibt. Das folgende Beispiel zeigt die Seite, die Dienstaufrufe durch Clientskript ausführt.
<%@ Page Language="VB" %>
<!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" >
<style type="text/css">
body { font: 11pt Trebuchet MS;
font-color: #000000;
padding-top: 72px;
text-align: center }
.text { font: 8pt Trebuchet MS }
</style>
<title>Simple Web Service</title>
<script type="text/javascript">
// This function calls the Web Service method.
function EchoUserInput()
{
var echoElem = document.getElementById("EnteredValue");
Samples.AspNet.SimpleWebService.EchoInput(echoElem.value,
SucceededCallback);
}
// This is the callback function that
// processes the Web Service return value.
function SucceededCallback(result)
{
var RsltElem = document.getElementById("Results");
RsltElem.innerHTML = result;
}
</script>
</head>
<body>
<form id="Form1" >
<asp:ScriptManager ID="scriptManager">
<Services>
<asp:ServiceReference path="SimpleWebService_VB.asmx" />
</Services>
</asp:ScriptManager>
<div>
<h2>Simple Web Service</h2>
<p>Calling a simple service that echoes the user's input and
returns the current server time.</p>
<input id="EnteredValue" type="text" />
<input id="EchoButton" type="button"
value="Echo" onclick="EchoUserInput()" />
</div>
</form>
<hr/>
<div>
<span id="Results"></span>
</div>
</body>
</html>
<%@ Page Language="C#" %>
<!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" >
<style type="text/css">
body { font: 11pt Trebuchet MS;
font-color: #000000;
padding-top: 72px;
text-align: center }
.text { font: 8pt Trebuchet MS }
</style>
<title>Simple Web Service</title>
<script type="text/javascript">
// This function calls the Web Service method.
function EchoUserInput()
{
var echoElem = document.getElementById("EnteredValue");
Samples.AspNet.SimpleWebService.EchoInput(echoElem.value,
SucceededCallback);
}
// This is the callback function that
// processes the Web Service return value.
function SucceededCallback(result)
{
var RsltElem = document.getElementById("Results");
RsltElem.innerHTML = result;
}
</script>
</head>
<body>
<form id="Form1" >
<asp:ScriptManager ID="scriptManager">
<Services>
<asp:ServiceReference path="SimpleWebService.asmx" />
</Services>
</asp:ScriptManager>
<div>
<h2>Simple Web Service</h2>
<p>Calling a simple service that echoes the user's input and
returns the current server time.</p>
<input id="EnteredValue" type="text" />
<input id="EchoButton" type="button"
value="Echo" onclick="EchoUserInput()" />
</div>
</form>
<hr/>
<div>
<span id="Results"></span>
</div>
</body>
</html>
Im folgenden Beispiel wird der Dienst veranschaulicht, der vom Clientskript aufgerufen wird.
<%@ WebService Language="VB" Class="Samples.AspNet.SimpleWebService" %>
Imports System.Web
Imports System.Web.Services
Imports System.Xml
Imports System.Web.Services.Protocols
Imports System.Web.Script.Services
Namespace Samples.AspNet
<WebService(Namespace:="http://tempuri.org/")> _
<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _
<ScriptService()> _
Public Class SimpleWebService
Inherits System.Web.Services.WebService
<WebMethod()> _
Public Function EchoInput(ByVal input As String) As String
Dim inputString As String = Server.HtmlEncode(input)
If Not String.IsNullOrEmpty(inputString) Then
Return String.Format("You entered {0}. The " + _
"current time is {1}.", inputString, DateTime.Now)
Else
Return "The input string was null or empty."
End If
End Function 'EchoInput
End Class 'SimpleWebService
End Namespace
<%@ WebService Language="C#" Class="Samples.AspNet.SimpleWebService" %>
using System;
using System.Web;
using System.Web.Services;
using System.Xml;
using System.Web.Services.Protocols;
using System.Web.Script.Services;
namespace Samples.AspNet
{
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[ScriptService]
public class SimpleWebService : System.Web.Services.WebService
{
[WebMethod]
public string EchoInput(String input)
{
string inputString = Server.HtmlEncode(input);
if (!String.IsNullOrEmpty(inputString))
{
return String.Format("You entered {0}. The "
+ "current time is {1}.", inputString, DateTime.Now);
}
else
{
return "The input string was null or empty.";
}
}
}
}
Aufrufen von statischen Methoden in einer ASP.NET-Webseite
Sie können einer ASP.NET-Seite statische Seitenmethoden hinzufügen und sie als Webmethoden qualifizieren. Sie können diese Methoden dann in dem in dieser Seite enthaltenen Skript aufrufen, als ob sie Teil eines Webdiensts wären, jedoch ohne eine eigene ASMX-Datei zu erstellen. Wenn Sie Webmethoden in einer Seite erstellen möchten, importieren Sie den System.Web.Services-Namespace und fügen jeder statischen Methode, die Sie verfügbar machen möchten, ein WebMethodAttribute-Attribut hinzu. Die Seitenmethoden müssen in der Seite definiert werden, die den Seitenmethodenaufruf durchführt.
Damit statische Seitenmethoden als Webmethoden aufgerufen werden können, muss das EnablePageMethods-Attribut des ScriptManager-Steuerelements auf true festgelegt werden.
Die folgenden Beispiele veranschaulichen, wie statische Seitenmethoden von Clientskript aus aufgerufen werden können, um Sitzungszustandswerte zu schreiben und zu lesen. Im folgenden Beispiel werden Seitenmethoden veranschaulicht.
<%@ Page Language="VB" %>
<%@ Import Namespace="System.Web.Services" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script >
<WebMethod()> _
Public Shared Function GetSessionValue(ByVal key As String) As String
' Get session state value.
Return CStr(HttpContext.Current.Session(key))
End Function 'GetSessionValue
<WebMethod()> _
Public Shared Function SetSessionValue(ByVal key As String, _
ByVal value As String) As String
' Set session state value.
HttpContext.Current.Session(key) = value
Return CStr(HttpContext.Current.Session(key))
End Function 'SetSessionValue
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" >
<title>Using Page Methods with Session State</title>
<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>
<h2>Using Page Methods with Session State</h2>
<form id="form1" >
<asp:ScriptManager ID="ScriptManager1"
EnablePageMethods="true">
<Scripts>
<asp:ScriptReference Path="PageMethod.js"/>
</Scripts>
</asp:ScriptManager>
</form>
<center>
<table>
<tr align="left">
<td>Write current date and time in session state:</td>
<td>
<input type="button"
onclick="SetSessionValue('SessionValue', Date())"
value="Write" />
</td>
</tr>
<tr align="left">
<td>Read current date and time from session state:</td>
<td>
<input type="button"
onclick="GetSessionValue('SessionValue')"
value="Read" />
</td>
</tr>
</table>
</center>
<hr/>
<span style="background-color:Aqua" id="ResultId"></span>
</body>
</html>
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Web.Services" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script >
[WebMethod]
// Get session state value.
public static string GetSessionValue(string key)
{
return (string)HttpContext.Current.Session[key];
}
[WebMethod]
// Set session state value.
public static string SetSessionValue(string key, string value)
{
HttpContext.Current.Session[key] = value;
return (string)HttpContext.Current.Session[key];
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" >
<title>Using Page Methods with Session State</title>
<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>
<h2>Using Page Methods with Session State</h2>
<form id="form1" >
<asp:ScriptManager ID="ScriptManager1"
EnablePageMethods="true">
<Scripts>
<asp:ScriptReference Path="PageMethod.js"/>
</Scripts>
</asp:ScriptManager>
</form>
<center>
<table>
<tr align="left">
<td>Write current date and time in session state:</td>
<td>
<input type="button"
onclick="SetSessionValue('SessionValue', Date())"
value="Write" />
</td>
</tr>
<tr align="left">
<td>Read current date and time from session state:</td>
<td>
<input type="button"
onclick="GetSessionValue('SessionValue')"
value="Read" />
</td>
</tr>
</table>
</center>
<hr/>
<span style="background-color:Aqua" id="ResultId"></span>
</body>
</html>
Das folgende Beispiel zeigt die Verwendung von Skript zum Aufrufen von Seitenmethoden.
// PageMethods.js
var displayElement;
// Initializes global variables and session state.
function pageLoad()
{
displayElement = $get("ResultId");
PageMethods.SetSessionValue("SessionValue", Date(),
OnSucceeded, OnFailed);
}
// Gets the session state value.
function GetSessionValue(key)
{
PageMethods.GetSessionValue(key,
OnSucceeded, OnFailed);
}
//Sets the session state value.
function SetSessionValue(key, value)
{
PageMethods.SetSessionValue(key, value,
OnSucceeded, OnFailed);
}
// Callback function invoked on successful
// completion of the page method.
function OnSucceeded(result, userContext, methodName)
{
if (methodName == "GetSessionValue")
{
displayElement.innerHTML = "Current session state value: " +
result;
}
}
// Callback function invoked on failure
// of the page method.
function OnFailed(error, userContext, methodName)
{
if(error !== null)
{
displayElement.innerHTML = "An error occurred: " +
error.get_message();
}
}
if (typeof(Sys) !== "undefined") Sys.Application.notifyScriptLoaded();
Weitere Informationen über den Sitzungszustand finden Sie unter Übersicht über den ASP.NET-Sitzungszustand.
Siehe auch
Aufgaben
Verwenden des UpdatePanel-Steuerelements mit einem Webdienst
Konzepte
Verwenden von Webdiensten in ASP.NET-AJAX
Verwenden von Webdiensten in ASP.NET-AJAX
Offenlegen von WCF-Diensten für Clientskript
Aufrufen von Webdiensten vom Clientskript