Опубликован: 24.03.2009 | Доступ: свободный | Студентов: 2286 / 115 | Оценка: 4.24 / 3.93 | Длительность: 17:47:00
Лекция 10:

Создание взаимодействующих с сервером приложений в Silverlight

Использование ASP.NET AJAX и Веб-сервисов

При создании Веб-сервиса с использованием ASP.NET можно пометить его как используемый в JavaScript, имея в виду, что этот Веб-сервис может автоматически сгенерировать JavaScript-прокси. Этот прокси использует JavaScript Object Notation (JSON), позволяя без труда передавать по сети сложные типы данных, не обращая внимания на вопросы совместимости. Итак, давайте создадим Веб-сервис и посмотрим, как можно с помощью JavaScript извлекать данные из него и помещать в Silver-light.

В Visual Studio создаем новое приложение и добавляем в него Веб-сервис ASMX. Будем использовать этот Веб-сервис для формирования текущего времени в двух форматах: коротком и длинном. Для этого создадим класс, содержащий две строки, что обеспечит нам структурированный объект с данными. Вот как он выглядит:

public class DateData 
{
  public string strShortTime;
  public string strLongTime; 
}

Теперь напишем код класса Веб-сервиса, который будет возвращать текущее время в двух форматах с помощью представленного выше класса. Обратите внимание, что класс обозначен как System.Web.Script.Services.ScriptService. Тем самым мы указываем инфраструктуре ASP.NET пометить его как сервис, который может использоваться из JavaScript:

using System;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Xml.Linq;

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1 1)]
[System.Web.Script.Services.ScriptService]

public class Service : System.Web.Services.WebService
{
 public Service () 
 {
 }
 [WebMethod]
 public DateData getTime()
 {
  DateData dReturn = new DateData();
  dReturn.strLongTime = System.DateTime.Now.ToLongTimeString();
  dReturn.strShortTime = System.DateTime.Now.ToShortTimeString();
  return dReturn;
 }
}

При выполнении этого сервиса добавление /js в конце URI обеспечит формирование JavaScript-прокси. Поэтому для работы с этим Веб-сервисом можно либо использовать HTML-страницу, которая включает этот сценарий, либо ASP.NET-страницу с ScriptManager, ссылающимся на этот сервис. Применим здесь второй метод.

Создадим в решении ASP.NET-страницу и добавим в нее элемент управления ScriptManager. В Script-Manager необходимо добавить ссылку на только что созданный вами Веб-сервис. Делаем это с помощью тега <Services>. Вот пример:

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

Далее добавляем на страницу Silverlight, как обычно. Но сначала взгляните на XAML, визуальное представление которого будет формировать Silverlight. В демонстрационных целях я сделал его максимально простым:

<Canvas xmlns="http://schemas.microsoft.com/client/2007"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <TextBlock Canvas.Top="0" x:Name="txtShort"></TextBlock>
  <TextBlock Canvas.Top="20" x:Name="txtLong"></TextBlock>
</Canvas>

Добавляем этот код в страницу и создаем экземпляр объекта Silverlight, как обычно. Вот код, который может быть добавлен в раздел <body> разметки ASP.NET:

<div id="silverlightPlugInHost">
  <script type="text/javascript">
    Silverlight.createObjectEx({
     source: 'Scene.xaml',
     parentElement: document.getElementById('silverlightPlugInHost'),
     id: 'silverlightPlugIn',
     properties: {
      width: '100%',
      height: '100%',
      background:'white',
      version: '1.0'
     },
     events: {
      onLoad: handleLoad
     },
     context: null
    });
  </script>

В этом коде необходимо обратить внимание на две вещи. Во-первых, источник задан как Scene.xaml, поэтому убедитесь, что при вызове своего XAML-файла используете именно это имя. Во-вторых, событие handleLoad определено как событие, формируемое, когда содержимое Silverlight загружено, и сформировано его визуальное представление.

Итак, рассмотрим это событие handleLoad:

function handleLoad() 
{
 Service.getTime(onSuccess, on Failed,""); 
}

Веб-сервис назван Service, и JavaScript-прокси принимает его имя. Таким образом, JavaScript-прокси можно вызывать, используя синтаксис ИмяКласса.ВебМетод.Наш Веб-метод назывался getTime (Получить время), поэтому просто вызываем Service.getTime. JavaScript-прокси для общения с Веб-сервисом использует AJAX, и, поскольку AJAX применяет механизм обратного вызова, должны быть описаны функции обратного вызова в случае успеха и неудачи (или истечения времени ожидания). Итак, в данном случае, задаются функции обратного вызова onSuccess (В случае успеха) и onFailed (В случае неудачи), соответственно. Третий параметр - это параметр контекста, который может быть пустым.

Вот функции onSuccess и onFailed:

function onSuccess(result)
{
 var sl = document.getElementById("silverlightPlugIn");
 sl.content.findName("txtShort").Text = result.strShortTime;
 sl.content.findName("txtLong").Text = result.strLongTime;
}
function onFailed(result)
{
 alert("Timed out");
}

Эти функции принимают возвращенное в параметре result (результат) значение. Мы используем JSON, поэтому это структурированный объект, так что значениями полей result.strShortTime и re-sult.strLongTime будут строки, содержащие время в укороченном и удлиненном форматах, соответственно. Нам осталось только найти элементы TextBlock по их именам и задать им соответствующие значения.

Взаимодействие и данные в .NET

При использовании .NET в Silverlight 2 взаимодействие с сервисами реализовывается посредством двух основных классов: WebClient и WebRequest (Веб-запрос). Как будет показано далее, эти классы обеспечивают гибкие средства доступа к данным. Кроме того, вы увидите, как в Silverlight можно использовать классы Windows Communication Foundation и ADO.NET Data Services (службы данных ADO.NET).