Применение Веб-методов. Технология Jasp

14.1.4. Создание Веб-сервиса

Веб-сервисы создаются в управляемом коде с помощью платформы ASP.NET. Сначала создается файл с расширением ASMX [7]. Этот файл содержит класс, помеченный атрибутом WebService, который служит для обозначения открытого класса, реализующего логику Веб-сервиса. Этот класс Веб-сервиса содержит один или несколько открытых методов, подлежащих публикации в составе Веб-сервиса. Перед этими методами ставится атрибут WebMethod. Среда ASP.NET отвечает за реализацию инфраструктуры публикации этих методов в составе Веб-сервиса.

Веб-сервисы состоят из двух частей: точка входа Веб-сервиса и код, который реализует его функциональность. В ASP.NET точкой входа для Веб-сервиса служит текстовый ASMX-файл. Он ссылается на код в предкомпилированных сборках, файл с выделенным кодом, или на код, содержащийся в самом ASMX-файле.

При построении Веб-сервиса в управляемом коде среда ASP.NET автоматически обеспечивает инфраструктуру и обрабатывает запросы и ответы Веб-сервиса, в том числе занимаясь разбором и формированием сообщений SOAP.

14.1.4.1. Директива обработки WebService

В начале ASMX- страницы находится директива обработки WebService, атрибуты которой содержат сведения о реализации Веб-сервиса. Эта директива предоставляет среде ASP.NET необходимые сведения, например, о том, какой класс реализует функциональность. Ниже приведен пример директивы обработки WebService:

<%@ WebService Language="c#" Codebehind="Service1.asmx.cs"
    Class="WebService1.Service1" %>

Атрибут Language указывает, какой язык программирования использовался для разработки сервиса. Веб-сервис можно разрабатывать на любом языке, совместимом с .NET – например, на Visual Basic .NET или на Visual C#.

При создании сервиса в управляемом коде с использованием Visual Studio .NET ее реализация находится в файле с выделенным кодом. Файл с выделенным кодом связывается с ASMX- страницей посредством атрибута Codebehind.

При использовании шаблона сервиса ASP.NET атрибут Class указывает, какой класс в файле с выделенным кодом реализует функциональные возможности сервиса.

Клиенты Веб-сервиса – это компоненты, службы и приложения, ссылающиеся на сервис и использующие его. Стоит отметить, что это не обязательно клиентские приложения – во многих случаях клиентами служб могут быть другие Веб-приложения или даже другие службы.

14.1.5. Выполнение HTTP-запросов из клиентского сценария AJAX

Прежде чем обсуждать, каким образом можно использовать прокси-классы для вызова Веб-методов, рассмотрим, как можно решить ту же задачу при помощи класса WebRequest. Этим может потребоваться, если необходимо управлять уровнем связи или выполнять проверку данных, отправляемых на или с сервера, или если заранее не известны параметры самого сервиса.

В следующем примере показаны способы использования объекта WebRequest для реализации Веб-запросов GET и POST при подключении к указанным URL-адресам (конечные точки HTTP):

var resultElement;
function pageLoad()
{
    resultElement = $get("ResultId");
}
// Эта функция вызывает GET запрос.
function GetWebRequest()
{
    // Создаем объект WebRequest.
    var wRequest = new Sys.Net.WebRequest();
    // Указываем адрес.      
    wRequest.set_url("getTarget.htm");
    alert("Target Url: getTarget.htm");
    // Указываем команду.
    wRequest.set_httpVerb("GET");
    // Указываем-callback функцию.
    wRequest.add_completed(OnWebRequestCompleted);
    // Очищаем содержимое элемента, который будет использоваться для вывода результата.
    resultElement.innerHTML = "";
    // Вызываем запрос.
    wRequest.invoke();  
}
// Эта функция вызывает POST запрос.
function PostWebRequest()
{
    // Создаем объект WebRequest.
    var wRequest = new Sys.Net.WebRequest();
    // Указываем адрес.      
    wRequest.set_url("postTarget.aspx");
    alert("Target Url: postTarget.aspx");
    // Указываем команду.
    wRequest.set_httpVerb("POST");
    // Указываем обработчик запроса.
    wRequest.add_completed(OnWebRequestCompleted);
    // Указываем тело POST.
    var requestBody = "Message=Привет, Мир!";
    wRequest.set_body(requestBody);
    wRequest.get_headers()["Content-Length"] = requestBody.length;
    // Очищаем содержимое элемента, который будет использоваться для вывода результата.   
    resultElement.innerHTML = "";
    // Вызываем запрос.
    wRequest.invoke();              
}
// Эта функция вызывается асинхронно, когда завершится запрос.
function OnWebRequestCompleted(executor, eventArgs) 
{    
    if(executor.get_responseAvailable()) 
    {
        // Отобразим статус запроса. 
       resultElement.innerHTML +=
          "Status: [" + executor.get_statusCode() + " " + 
                    executor.get_statusText() + "]" + "<br/>";
        // Отобразим заголовки запроса.
       resultElement.innerHTML += "Headers: ";
       resultElement.innerHTML += executor.getAllResponseHeaders() + "<br/>";
        // Отобразим тело запроса.
       resultElement.innerHTML += "Body:";
      if(document.all)
        resultElement.innerText += executor.get_responseData();
      else
        resultElement.textContent += executor.get_responseData();
    }
}
if (typeof(Sys) !== "undefined") Sys.Application.notifyScriptLoaded();

В табл. 11.1 перечислены основные классы, связанные с Веб-сервисами, которые можно вызвать из клиентского сценария.

В табл. 11.2 перечислены основные классы, связанные с Веб-сервисами, которые можно вызвать на сервере.

14.1.6. Предоставление доступа к Веб-службам в клиентском сценарии

Более удобный способ вызова Веб-сервисов заключается в использовании прокси-классов [8]. Как уже отмечалось, ASP.NET автоматически создаются прокси-классы JavaScript для Веб-служб. Эти прокси-классы являются производными от класса Sys.Net.WebServiceProxy. Чтобы вызвать метод Веб-сервиса, следует вызвать соответствующий метод прокси-класса JavaScript.

Из сценария можно предоставить доступ к Веб-службе, которая представлена файлом с расширением ASMX и класс которой определен с использованием атрибута ScriptServiceAttribute. Отдельные методы, вызываемые из сценария, должны быть дополнены атрибутом WebMethodAttribute.

В следующем примере показан порядок использования этих атрибутов в коде Веб-службы:

[ScriptService]
public class SimpleWebService : System.Web.Services.WebService
{
[WebMethod]
public string EchoInput(String input)
{
    // Здесь расположен код метода.
}
}

Чтобы разрешить вызов Веб-служб из сценария, следует зарегистрировать обработчик HTTP ScriptHandlerFactory в файле Web.config приложения. Этот обработчик используется для обработки вызовов Веб-служб из сценария. В следующем примере показан элемент файла Web.config, определяющий добавление обработчика:

<system.web>
  <httpHandlers>
    <remove verb="*" path="*.asmx"/>
    <add verb="*" path="*.asmx"
      type="System.Web.Script.Services.ScriptHandlerFactory"
       validate="false"/>
  </httpHandlers>
<system.web>

Вызовы Веб-служб, выполненные не из сценария ASP.NET AJAX, обработчик ScriptHandlerFactory делегирует используемому по умолчанию обработчику, в котором вместо формата JSON используется SOAP. Делегирование выполняется автоматически. Какие-либо дополнительные действия следует выполнять только в том случае, если требуется запретить использование протокола SOAP в Веб-службах. В этом случае в файле Web.config необходимо определить следующие параметры конфигурации:

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

14.1.6.1. Предоставление доступа к сервисам из клиентского сценария на Веб-странице ASP.NET

Чтобы разрешить вызов Веб-служб (ASMX) из клиентского сценария на Веб- странице ASP.NET, необходимо добавить на страницу элемент управления ScriptManager. Чтобы определить ссылку на Веб-службу, необходимо добавить дочерний элемент asp:ServiceReference к элементу управления ScriptManager. После этого необходимо установить URL-адрес Веб-службы в качестве значения атрибута ссылки на сервер path. Объект ServiceReference определяет необходимость создания прокси-класса JavaScript для вызова указанной Веб-службы в ASP.NET.

Добавим в начало страницы первым элементом формы объект ScriptManager:

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

Объект ServiceReference может ссылаться на Веб-службу только в том же домене, в котором находится страница. Путь Веб-службы может быть относительным, относительным к приложению, относительным к домену или абсолютным. При использовании абсолютного пути следует убедиться, что он указан в том же домене.

При отображении страницы, содержащей этот элемент управления ScriptManager, для Веб-службы SimpleWebService.asmx создается прокси-класс JavaScript. В прокси-классе реализуются методы, соответствующие методам Веб-службы SimpleWebService.asmx. Страница также содержит прокси-классы JavaScript, соответствующие типам данных сервера, которые используются в качестве входных параметров или возвращаемых значений методов Веб-служб. Это позволяет написать клиентский сценарий, инициализирующий эти параметры, и передать их вызову метода.

Свойство InlineScript объекта ServiceReference определяет порядок включения прокси-класса JavaScript на странице. Если для свойства InlineScript установлено значение false (используется по умолчанию), получение сценария прокси-класса выполняется с помощью отдельного запроса. Этот параметр рекомендуется использовать в том случае, если несколько страниц ссылаются на одну службу и включено кэширование.

Если для свойства InlineScript установлено значение true, сценарий прокси-класса включается на страницу в качестве встроенного блока сценария. Это позволяет повысить производительность за счет сокращения числа сетевых запросов. Это особенно актуально при наличии на странице большого числа ссылок на службы и отсутствии ссылок на эту службу на других страницах. Если для свойства InlineScript установлено значение true, необходимо использовать относительный путь. Путь, задаваемый относительно домена, должен содержать ссылку на то же Веб-приложение.

Вызов метода Веб-сервисы из сценария осуществляется асинхронным способом. Чтобы получить возвращаемое значение или определить факт возврата запроса, следует определить функцию обратного вызова при успешном выполнении запроса. Функция обратного вызова вызывается при успешном выполнении запроса и содержит значение (если есть), возвращаемое в результате вызова метода Веб-сервиса. Также можно определить функцию обратного вызова при неудачном завершении запроса, используемую для обработки ошибок. Кроме того, можно передать в функции обратного вызова сведения о контексте пользователя. Если метод Веб-сервиса возвращает сложный тип, функция обратного вызова при успешном выполнении запроса принимает возвращаемое значение в форме объекта JavaScript, соответствующего типу сервера.

14.1.6.2. Примеры

Рассмотрим большинство указанных выше аспектов использования Веб-сервисов на примерах.

В первом примере показан метод Веб-сервиса, возвращающий сложный тип. В рамках Веб-сервиса определен пользовательский сериализуемый тип ColorObject, а также метод GetDefaultColor, который возвращает некоторый объект с цветом. Клиент после полной отрисовки страницы вызывает сервис, получает значение цвета и сообщение, а также выводит сообщение от сервиса на экран, выделяя его переданным в формате RGB цветом.

В первой части примера показана страница, на которой выполняется вызов сервиса с использованием клиентского сценария. Она имеет ссылку на файл . asmx, который содержит описание сервиса, и на файл HandleColor.js, который содержит JavaScript -код, вызывающий веб-сервисы:

<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html  >
    <head id="Head1" runat="server">
        <title>Получение составного типа данных</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>Получение составного типа данных</h2>
        <form id="form1" runat="server">
            <asp:ScriptManager runat="server" ID="scriptManager">
                <Services>
                    <asp:ServiceReference  Path="HandleColor.asmx" />
                </Services>
                <Scripts>
                    <asp:ScriptReference Path="HandleColor.js" />
                </Scripts>
            </asp:ScriptManager>  
            <table style="font-size:12px">
                <tr>
                    <td>Цвет по умолчанию для Web-сервиса:</td>
                    <td>
                     <button id="Button1" 
                        onclick="GetDefaultColor(); return false;">Получить цвет по умолчанию</button>
                    </td>
                </tr>
            </table> 
           <hr />
            <!—Отображение текущего цвета.-->
            <p>
                <span style="background-color:Yellow">Цвет:</span>
                <span id="ResultId"></span>
            </p>
        </form>
    </body>
</html>

В следующей части примера показан клиентский сценарий страницы HandleColor.js, который используется для вызова службы:

// Эта функция извлекает значение по умолчанию для цвета
function GetDefaultColor()  
{
    // Вызываем нужный Веб-сервис
    Samples.AspNet.HandleColor.GetDefaultColor(SucceededCallback);  
}
// Это функция обратного вызова, обрабатывающая результат вызова сервиса
function SucceededCallback(result)
{
    // Извлечение данных, полученных от сервиса
    var message = result.message;
    var rgb = result.rgb;
    var timeStamp = result.timeStamp;
    // Преобразование RGB массива в строку
    var serverColor = rgb[0]+ rgb[1] + rgb[2];
    // Отображение результата
    var displayResult = document.getElementById("ResultId");
    displayResult.style.color = "yellow";
    displayResult.style.fontWeight = "bold";
    if (document.all) 
        displayResult.innerText = message + " " + timeStamp;
    else
       // Firefox
       displayResult.textContent = message + " " + timeStamp;
    displayResult.style.backgroundColor = "#" + serverColor;
}
if (typeof(Sys) !== "undefined") Sys.Application.notifyScriptLoaded();

В следующей части примера показана вызываемая на странице служба HandleColor.asmx, которая реализуется классом Samples.AspNet.HandleColor:

<%@ WebService Language="C#" Class="Samples.AspNet.HandleColor" %>
using System;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Web.Script.Services;
using System.Web.Script.Serialization;
namespace Samples.AspNet
{
    // Определяем объект "Цвет" для общения с клиентом
    public class ColorObject
    {
        public string message = "Цвет по умолчанию – синий.";
        public string[] rgb = new string[] { "00", "00", "FF" }; 
        public string timeStamp;
    }
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [GenerateScriptType(typeof(ColorObject))]
    [ScriptService]
    public class HandleColor : System.Web.Services.WebService
    {
        [WebMethod]
        public ColorObject GetDefaultColor()
        {
            // Создаем новый объект.
            ColorObject co = new ColorObject();
            // Указывает текущее время.
            co.timeStamp = DateTime.Now.ToString();
            return co;         
        }
    }
}

Результат работы разработанной страницы представлен на рис. 14.4.

В следующем примере дорабатывается созданный сервис и страница так, чтобы был реализован пример показа порядка вызова методов Веб-службы, которые содержат параметры соответствующих сложных типов. При этом добавлен дополнительный сериализуемый тип ColorHelper, который используется для передачи на клиент списка доступных цветов. Также демонстрируется использование клиентских обработчиков ошибок.

В первой части примера показана страница, на которой выполняется вызов сервиса с использованием клиентского сценария. Она имеет ссылку на файл HandleColor.asmx, который содержит описание сервиса, и на файл HandleColor.js, который содержит JavaScript -код, вызывающий веб-сервисы:

<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head id="Head1" runat="server">
        <title>Получение составного типа данных</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>Получение составного типа данных</h2>
        <form id="form1" runat="server">
            <asp:ScriptManager runat="server" ID="scriptManager">
                <Services>
                    <asp:ServiceReference Path="HandleColor.asmx" />
                </Services>
                <Scripts>
                    <asp:ScriptReference Path="HandleColor.js" />
                </Scripts>
            </asp:ScriptManager>
            <table style="font-size: 12px;">
                <tr align="center">
                    <td class="text">
                        Изменить цвет:
                    </td>
                    <td>
                        <select id="ColorSelectID" onchange="OnChangeDefaultColor(this);" runat="server">
                        </select>
                    </td>
                </tr>
            </table>
            <hr />
            <!—Отображение текущего цвета.-->
            <span style="background-color: Yellow">Цвет:</span>
            <span id="ResultId"></span>
        </form>
    </body>
</html>

В следующей части примера показан клиентский сценарий страницы HandleColor.js, который используется для вызова службы:

// Цвет по умолчанию для сервиса.
var defaultRgb;
// Элемент, отвечающий за отображение результата.
var displayResult;
// Получаем список доступных цветов и цвет по молчанию.
function GetServerColors() {
    // Получаем цвет по умолчанию.
    Samples.AspNet.HandleColor.GetDefaultColor(
        SucceededCallback, FailedCallback);
    // Получаем список доступных цветов.
    Samples.AspNet.HandleColor.GetColorList(
        SucceededCallback, FailedCallback);
}
// Эта функция отправляет на сервер выбранный пользователем объект цвет в элементе select
function OnChangeDefaultColor(comboObject) {
    // Создаем экземпляр объекта.
    var color = new Samples.AspNet.ColorObject();
    // Поучаем выбранный пользователем цвет
    var selectionIndex = comboObject.selectedIndex;
    var selectedColor = comboObject.options[selectionIndex].text;
    // Получаем RGB представление цвета.
    var selectionValue = comboObject.value;
    // И превращаем его в массив.
    var colorArray = selectionValue.split(",");
    // Присваиваем значения полей объекта
    color.message = "Новый цвет по умолчанию " + selectedColor + ".";
    color.rgb = colorArray;
    // Вызываем сетод Веб-сервиса для изменения цвета.
    Samples.AspNet.HandleColor.ChangeDefaultColor(
        color, SucceededCallback, FailedCallback);
}
// Эта фунуция обрабатывает результат работы методов сервиса
function SucceededCallback(result, userContext, methodName) {
    switch (methodName) {
        case ("GetColorList"):
            {
                // Получаем элемент select.
                var selectObject = document.getElementById("ColorSelectID");
                var i = 0;
                // Пробегаемся по списку для заполнению select данными
                for (var j=0; j < result.length; j++) {
                    var item = result[j];
                    var option = new Option(item.name, item.rgb);
                    selectObject.options[i] = option;
                    // Устанавливаем значение по умолчанию.
                    if (item == defaultRgb[0] + defaultRgb[1] + defaultRgb[2])
                        selectObject.options[i].selected = true;
                    i++;
                }
                break;
            }
        default:
            {
                var message = result.message;
                defaultRgb = result.rgb;
                var timeStamp = result.timeStamp;
                var serverColor = defaultRgb[0] + defaultRgb[1] + defaultRgb[2];
                displayResult.style.color = "yellow";
                displayResult.style.fontWeight = "bold";
                if (document.all)
                    displayResult.innerText = message + " " + timeStamp;
                else
                // Firefox
                    displayResult.textContent = message + " " + timeStamp;

                displayResult.style.backgroundColor = "#" + serverColor;
                break;
            }
    }
}
// Функция обратного вызова, используемая в случае, если Веб-сервис отработал с ошибками
function FailedCallback(error, userContext, methodName) {
    if (error !== null) {
        displayResult.innerHTML = "Произошла ошибка: " + error.get_message();
    }
}
// Получаем список цветов и цвет по умолчанию
function pageLoad() {
    displayResult = document.getElementById("ResultId");
    GetServerColors();
}
if (typeof (Sys) !== "undefined") Sys.Application.notifyScriptLoaded();

В следующей части примера показана вызываемая на странице служба HandleColor.asmx, которая реализуется классом Samples.AspNet.HandleColor:

<%@ WebService Language="C#" Class="Samples.AspNet.HandleColor" %>
using System;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Web.Script.Services;
using System.Web.Script.Serialization;
using System.Collections.Generic;

namespace Samples.AspNet
{
    // Определяем объект цвет для "общения с клиентом"
    public class ColorObject
    {
        public string message;
        public string[] rgb;
        public string timeStamp;
        public ColorObject()
        {
            this.message = "Цвет по умолчанию – красный.";
            this.rgb = new string[] { "FF", "00", "00" };
            this.timeStamp = DateTime.Now.ToString();
        }
    }
    // вспомогательный класс для отображения списка цветов
    public class ColorHelper
    {
        public string name;
        public string rgb;
        public ColorHelper()
        {
        }
    }
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [GenerateScriptType(typeof(ColorObject))]
    [GenerateScriptType(typeof(ColorHelper))]
    [ScriptService]
    public class HandleColor : System.Web.Services.WebService
    {
        [WebMethod]
        public ColorObject GetDefaultColor()
        {
            // Возвращаем новый объект.
            ColorObject co = new ColorObject();
            return co;
        }
        [WebMethod]
        public ColorObject ChangeDefaultColor(ColorObject color)
        {
            // Создаем новый объект.
            ColorObject co = new ColorObject();
            // Присваиваем переданные значения.
            co.message = color.message;
            co.rgb = color.rgb;
            // Указываем текущее время.
            co.timeStamp = DateTime.Now.ToString();
            return co;
        }
        [WebMethod]
        public List<ColorHelper> GetColorList()
        {

            //Создаем таблицу цветов.
            List<ColorHelper> result = new List<ColorHelper>();
            //Добавляем несколько вариантов цветов.
            result.Add(new ColorHelper() { rgb = "00,00,FF", name = "Синий" });
            result.Add(new ColorHelper() { rgb = "FF,00,00", name = "Красный" });
            result.Add(new ColorHelper() { rgb = "00,FF,00", name = "Зеленый" });
            result.Add(new ColorHelper() { rgb = "00,00,00", name = "Черный" });
            return result;
        }
    }
}

Результат работы сервиса и страницы представлен на рис. 14.5.

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

В результате получается, что ASP.NET служит для отображения страницы и манипуляции с данными, а за отображение отвечает JavaScript. Происходит уход от компонентной разработки, понижается понятность, структурированность и повторяемость кода. Для решения этих проблем разработан ряд технологий, такие как ExrJS.Direct, Jasp и другие. Рассмотрим одну из этих технологий.

14.1.7. Ключевые термины

ASP.NET, .NET Framework, Веб-служба, Веб-сервис, AJAX, JSON, Сериализация, XmlHttpExecutor, WebRequestManager, WebRequest, JavaScript.

14.2. Технология Jasp

14.2.1. Введение

Jasp является библиотекой для разработки Веб-приложений с использованием платформы Microsoft .NET Framework [9, 10]. Основным отличием Jasp от ASP.NET является ориентация библиотеки на клиентскую сторону, чтобы программисту было проще создавать "богатый" пользовательский интерфейс в первую очередь средствами языка JavaScript, CSS и в последнюю очередь HTML, сгенерированным на стороне сервера (как это часто бывает при разработке на ASP.NET ). Такие приложения зачастую состоят из небольшого количества страниц (чаще всего одной), и все необходимое подгружают по мере использования без перезагрузки страницы. Примером таких приложений могут п ослужить сервисы: GMail, Google Maps, Pusk.ru и другие.

Основной недостаток ASP.NET заключается в сложности разработки клиентских компонент (использующих JavaScript ).

Рассмотрим простой пример: предположим, на странице необходимо вводить дату, и в целях экономии места на странице было решено сделать текстовое поле с выпадающим вниз календарем. Есть два пути решения: создать наследника UserControl, и наследника WebControl. У каждого из вариантов есть плюсы и минусы. В первом случае несомненным плюсом является возможность создания разметки, скриптов и стилей прям в ASCX-файле, но при этом данный компонент нельзя использовать в других проектах (только если копировать код из одного проекта в другой). Во втором случае нет ASCX-файла, а все дочерние компоненты приходится создавать программно. С другой стороны такой компонент можно использовать повторно.

В обоих случаях, при реализации клиентской части компонента возникает ряд проблем:

Обобщим все возможные проблемы, при создании компонент на классическом ASP.NET:

Технология Jasp пытается решить все указанные проблемы. Компонент Jasp одновременно является как серверным (разработка в ключе классического ASP.NET ), так и клиентским ( JavaScript - компонентом ). Каждый компонент можно использовать и в других проектах (даже имеющий разметку и собственные ресурсы ) без всяких изменений. Присутствует возможность наследования, как серверной части, так и клиентских частей: JavaSctpt, CSS и разметки. Все ресурсы загружаются автоматически и по мере использования (синхронно или асинхронно). При первой загрузке страницы загружаются только необходимые ресурсы, оптимизирова нные и сгруппированные в несколько файлов. Jasp можно использовать со всеми распространенными JavaScript -библиотеками: jQuery, ExtJS, Prototype и т.п.

14.2.2. "Hello World" на Jasp

Создание нового приложения на Jasp ничем не отличается от создания обычного ASP.NET приложения. Можно даже не создавать новый WebSite/WebApplication, а использовать существующий. Главное, чтобы был добавлен Reference на сборку Jasp и присутствовали минимальные необходимые настройки в web.config для работы Jasp:

<configuration>
  <configSections>
    <section name="jaspSettings" type="Jasp.Configuration.SettingsSection"/>
  </configSections>
  <jaspSettings  />
  <system.web>
    <httpHandlers>
      <add verb="*" path="*.jasp" type="Jasp.Web.HttpHandler, Jasp"/>
    </httpHandlers>
  </system.web>
  <system.webServer>
    <handlers>
      <add name="JaspCommonHandler" path="*.jasp" verb="*" type="Jasp.Web.HttpHandler, Jasp" 
       resourceType="Unspecified" preCondition="integratedMode"/>
    </handlers>
  </system.webServer>
</configuration>

Для создания страницы необходимо создать класс, унаследованный от класса Jasp.Web.UI.Page. Имя класса должно совпадать с именем страницы.

Создадим страницу, выводящую "Hello world!".

using Jasp.Web.UI;
using Jasp.Web.UI.HtmlControls;
namespace Jasp.Examples
{
    public class HelloWorld : Page
    {
        protected override void OnInit()
        {
            Body.Controls.Add(new Literal("Hello world!"));
        }
    }
}

Чтобы зайти на страницу, вводим в браузере /HelloWorld.jasp. Пока не будем углубляться в детали сгенерированного HTML, а просто убедимся, что все работает – в браузере увидим "Hello world!", и при загрузке страницы не произойдет JavaScript -ошибок.

14.2.3. Создание страницы с разметкой, скриптом и стилями

Рассмотрим пример создания страницы, содержащую разметку, скрипты и стили.

Для примера, создадим страницу, текст которой будет анимирован с помощью эффектов jQuery. Для начала, добавим в проект JavaScript -файл jquery-1_2_6_min.js с библиотекой jQuery (в любое место проекта). Не забудем установить Build action в embedded resource (подробнее подключение ресурсов описывается ниже). Данный файл будет являться общим ресурсом для всех страниц или компонент.

Далее создадим класс для страницы, назовем его Example1:

using Jasp.Resources;
using Jasp.Web.UI;
namespace Jasp.Examples
{
    [Resources("jquery-1_2_6_min.js")]
    public class Example1 : Page
    {
    }
}

Добавим классу атрибут ResourcesAttribute с указанием имени файла с jQuery. Теперь, при загрузке страницы, Jasp будет добавлять этот файл к скриптам страницы.

Теперь создадим CSS файл Example1.css со стилями для текста страницы:

.text-style
{
  color:red;
  font-weight:bold;
  font-size:large;
}

Также создадим файл Example1.htm с разметкой, содержащий текст, который будет анимироваться:

<html>
<head>
  <title>Пример 1</title>
</head>
<body>
  <span id="text">Анимированный текст!</span>
</body>
</html>

Теперь создадим JavaScript -файл Example1.js с кодом, который будет анимировать текст:

{
  // функция, вызываемая при инициализации контрола
  $init: function(){
    // указатель на текущий контрол
    var self = this;
    // дожидаемся инициализации jQuery
    jQuery(document).ready(function(){
      // запускаем анимацию
      self.animateText();
    });
  },
  // функция для анимации текста
  animateText: function(){
    // указатель на текущий контрол
    var self = this;
    // производим анимацию    
    jQuery(self.$text.$dom).toggleClass('text-style').toggle(1000, function(){
      self.animateText();
    });
  }
}

После загрузки страницы, мы увидим мигающий текст.

Рассмотрим, каким образом Jasp подгружает CSS и JavaScript файлы.

14.2.4. Ресурсы в Jasp

При загрузке страницы, Jasp определяет, какие ресурсы используются на странице: это может быть HTML-разметка, один или несколько CSS или JavaScript файлов. Jasp группирует все CSS и JavaScript файлы в один CSS и один JavaScript файл и добавляет специальные ссылки в HTML разметку, по которым они подгружаются браузером:

<script type="text/javascript" src="?$scripts=7_5_2_3_4_6_v=-1720007920"> </script> 
<link rel="stylesheet" type="text/css" href="?$styles=v=-1720007920" />

По-хорошему, у всех страниц сайта должна быть одна базовая страница (аналог MasterPage ), содержащая одинаковый набор базовых стилей и скриптов. Таким образом, данные ресурсы "закэшируются" и для других страниц сайта.

Страницы могут отличаться набором компонент, которые на них расположены. При загрузке страницы Jasp также определяет, какие ресурсы используют все компоненты, расположенные на странице. HTML каждого компонента подставляется в соответствующее место в результирующий HTML, а все CSS и JavaScript файлы, по аналогии с ресурсами страницы, объединятся в один CSS и один JavaScript файл.

<script type="text/javascript" src="?$pageScripts=2_$r=v=-1720007920"> </script> 
<link rel="stylesheet" type="text/css" href="?$pageStyles=2_$r=v=-1720007920" />

У каждой страницы или компонента могут быть как личные ресурсы, которые подгружаются автоматически и могут использоваться только данным компонентом, или его наследниками, так и общие, которые могут использоваться сразу несколькими компонентами. Личные ресурсы должны называться также как имя класса компонента (без учета расширения). Естественно, ресурсы компонент, которые изначально не используются на странице, загружены не будут. Их загрузка произойдет автоматически при первом использовании.

14.2.4.1. CSS ресурсы

Зачастую в проектах бывает один или пару CSS файлов, в которые без разбора добавляются все стили из всего проекта, даже если стиль используется один раз для определенного элемента. Такой файл получается довольно большим и трудно поддерживаемым. В Jasp можно создать общий файл, куда поместить основные стили, а стили, специфичные для определенных компонент или страниц, помещать в личные CSS-файлы компонент.

Необходимо отметить, что Jasp подменяет клиентские идентификаторы компонент – поэтому стили с селекторами через идентификаторы работать не будут.

14.2.4.2. JavaScript ресурсы

JavaScript ресурс – это текстовый файл с расширением js, содержащий JavaScript -код компонента. Данный файл должен определять один единственный объект – экземпляр компонента. В простейшем случае это пустой объект:

{
}

Если в объекте определена функция $init, то она будет вызвана сразу же после вызова клиентского конструктора (конструкторы создаются автоматически и подменять или модифицировать их нельзя):

{  $init: function(){
    // код инициализации
  }
}

Также в контексте данного объекта могут быть определены и другие функции компонента.

14.2.4.3. HTML ресурсы

HTML ресурс – это текстовый файл с расширение html или htm, содержащий HTML разметку компоненты или страницы. Данный файл должен удовлетворять синтаксическим требованиям XML, но при этом, может не являться XHTML-документом. Также в этом файле могут встречаться вставки для создания экземпляров дочерних компонент.

14.2.4.4. Бинарные ресурсы

Также Jasp поддерживает в качестве ресурсов изображения и другие бинарные файлы. При первом старте сайта, такие файлы будут "распакованы" из всех сборок сайта по умолчанию в папку \deploy\<имя сборки> в корне сайта. В HTML, CSS и JavaScript можно использовать специальную конструкцию ~<имя сборки>/<путь к ресурсу>, например в CSS можно написать:

body {  
    background-image: url('~Jasp.Examples/Files/Images/background.gif')
}

В результирующий CSS попадет отформатированная ссылка на ресурс, содержащая абсолютный путь до файла (если сайт работает в виртуальной директории, то будет подставлено и имя директории):

body {  
    background-image: url('/deploy/Jasp.Examples/Files/Images/background.gif')
}

При разработке, нет необходимости каждый раз после изменения файла делать перекомпиляцию проекта – Jasp сам умеет следить за изменениями в ресурсах и автоматически подхватывать их.

Конечно, же, никто не мешает использовать обычный подход к ресурсам, т.е. просто хранить CSS/ JavaScript /HTML и т.п. файлы, но тогда теряется ряд преимуществ, которые предоставляет Jasp: автоматическая загрузка стилей, скриптов по мере использования; минимизация скриптов и разметки; GZIP для страниц, стилей и разметки; возможность использования ресурсов и компонент, использующих их, из других проектов.

Зачастую, разные проекты на нужды одной компании имеют похожий интерфейс. Используя Jasp, можно с легкостью создать библиотеку компонент и ресурсов, содержащую базовые страницы ( MasterPage с layout 'ом по умолчанию, страницы ошибок, 404, 500 и т.п.), компоненты, изображения, стили, скрипты, и другие общие для проектов ресурсы. Например, используя библиотеку ExtJS сразу в нескольких проектах, достаточно сложно поддерживать одинаковую версию ExtJS библиотеки (включая все изображения, скины, плагины и bugfix'ы), т.к. это огромный набор файлов. Используя Jasp, можно с легкостью создать сборку, содержащую все необходимые ресурсы. Это решит проблему синхронизации версий всех файлов между проектами, а также возможные проблемы обновления при выходе новой версии библиотеки. Кроме того, как уже говорилось ранее, Jasp оптимизирует всю работу с ресурсами, начиная от автоматической загрузки, кончая сжатием и клиентской оптимизацией.

14.2.5. Страницы и компоненты

14.2.5.1. Создание страниц

Для создания страницы, необходимо создать класс, наследующий от класса Jasp.Web.UI.Page, после чего, Jasp будет обрабатывать запрос к одноименной странице. Вложенность страниц в папки производится через пространства имен, т.е. достаточно создать папку в проекте, после чего все классы, создаваемые в папке, будут находиться в пространстве имен новой вложенности (по умолчанию в Visual Studio), также как и путь к странице. Тут необходимо учесть, что за базовое пространство имен (от которых начинается нулевой уровень вложенности страниц ), берется имя сборки. Например, для сборки с именем Jasp.Examples, страница с классом Jasp.Examples.Example1 будет обрабатываться по запросу /Example1.jasp, а с классом Jasp.Examples.OldExamples.Example2 по адресу /OldExamples/Example2.jasp. Естественно, имена страниц не чувствительны к регистру.

14.2.5.2. Создание компонент

Для создания компонент, необходимо создать класс, наследованный от класса Jasp.Web.UI.UserControl. В Jasp страница является обычным компонентом, так что все функции и возможности, доступные компоненту, как на серверной, так и на клиентской стороне доступны также и странице. Далее, все действия, описываемые для компонент, справедливы также и для страниц.

Каждому компоненту, за исключением страницы, можно создать сокращенное наименование ( alias, алиас) с помощью атрибута AliasAttribute, чтобы не указывать зачастую длинные полные имена, и использовать его в JavaScript -коде или разметке.

Как говорилось ранее, в Jasp каждому компоненту можно прикреплять ресурсы, которые автоматически будут загружаться, при его использовании. Для автоматической подгрузки общих ресурсов компонента, достаточно добавить атрибут ResourcesAttribute, в котором перечислить названия общих JavaScript или CSS ресурсов.

Также важно отметить, что на клиентской стороне Jasp не создает лишних глобальных переменных – вся работа происходит внутри одного глобального объекта Jasp. Это позволяет избежать конфликтов с другими библиотеками (в целях оптимизации, Jasp все же создает сокращенные глобальные "алиасы" для компонент, которые имеют формат $j<системный номер компонента>, но вероятность того, что данные "алиасы" могут вызвать конфликт с другими JavaScript -библиотеками крайне мала).

Создать экземпляр компонента можно следующими методами:

При использовании первых двух вариантов, ресурсы компонент загружаются при загрузке страницы. При использовании последнего варианта, для всех ресурсов компонента идет один запрос к серверу, который возвращает необходимые данные и ресурсы (скрипты, разметку и стили). В Jasp у каждого компонента есть коллекция с дочерними компонентами как на серверной стороне (свойство Controls ), так и на клиентской (массив $controls ). Также на клиентской стороне у родительского компонента присутствуют свойства с идентификаторами каждого дочернего компонента (начиная со специального символа $ ).

14.2.5.2.1. Создание экземпляров компонент программно

Для создания компонента программно, необходимо создать новый экземпляр класса и добавить его с помощью метода Add в коллекцию Controls родительского компонента или страницы. Правильнее всего, это делать в переопределенном методе OnInit:

protected override void OnInit()
{
  Controls.Add(new MyUserControl());
}

14.2.5.2.2. Создание экземпляров компонент через разметку

Для создания компонент в разметке достаточно создать тег, с полным именем компонента (включая пространство имен) и указанием атрибутов, которые он поддерживает:

<jasp.examples.controls.myusercontrol id="control1" title="Контрол 1" />

14.2.5.2.3. Создание экземпляров компонент на JavaScript

Для создания компонент на JavaScript, достаточно создать новый экземпляр с помощью оператора new, и передать необходимые параметры первым аргументом:

{
    $init: function() {
        var control = new Jasp.Examples.Controls.MyUserControl({
            title: 'Контрол 1'
        });
        // производим необходимые действия с контролом
    }
}

Если в аргументе задано свойство callback (типа function ), то компонент будет создан асинхронно, и callback будет вызван после создания компонента на сервере:

{
    $init: function() {
        new Jasp.Examples.Controls.MyUserControl({
            title: 'Контрол 1',
            callback: function(control) {
                // производим необходимые действия с контролом
            }
        });
    }
}

Если в аргументе задано свойство arg (типа array ), то при создании компонента будет вызван серверный конструктор с заданными параметрами из arg (поддерживается перегрузка только по числу параметров, по типу параметров перегрузка не поддерживается). По своей сути arg – это аргумент конструктора. При этом на сервере все дочерние компоненты, которые будут созданы при запросе (из разметки или программно), будут возвращены на клиент и также будут являться дочерними для создаваемого клиентского компонента. Вызываемый конструктор должен быть помечен атрибутом JsonRpcMethodAttribute.

Например, у нас есть следующий компонент:

public class MyUserControl : UserControl
{
    private int _x, _y;
    public MyUserControl()
    {
    }
    [JsonRpcMethod]
    public MyUserControl(int x, int y)
    {
        _x = x;
        _y = y;
    }
    protected override void OnLoad()
    {
        Title = string.Format("Сумма {0}", _x + _y);
    }
    public string Title
    {
        get { return (string)Data["title"]; }
        set { Data["title"] = value; }
    }
    ///// <summary>
    ///// Данная реализация свойства работает с компонентом title, определенным в разметке
    ///// </summary>
    //public string Title
    //{
    //    get { return ((HtmlControl)GetById("title")).InnerText; }
    //    set { ((HtmlControl)GetById("title")).InnerText = value; }
    //}
}

Одновременно создание компонента на сервере и на клиенте производится следующим образом:

{
    $init: function() {
        var control = new Jasp.Examples.Controls.MyUserControl({
            title: 'Контрол 1',
            arg: [3, 2]
        });
        // производим необходимые действия с контролом
    }
}

Как видно из примера, на сервере происходит сложение двух чисел, переданных в клиентский конструктор через параметр arg. Результат записывается в свойство Title, которое может передавать результат на клиентскую сторону в виде JSON -объекта через свойство Data либо через произвольный HTML элемент. Например, через конструктор удобно передавать идентификаторы либо другие объекты, характеризующие какие-либо сущности, далее загружать необходимые данные на сервере и возвращать их на клиентскую сторону вместе с компонент.

Если arg не определен, то произойдет только клиентское создание компонент, при котором дочерние компоненты, определенные на стороне сервера, созданы не будут. Например, компонент для ввода даты вряд ли потребует вызов серверного конструктора.

14.2.6. Передача данных на клиентскую сторону

Для передачи данных на клиентскую сторону, на сервере можно использовать словарь Data, который есть у каждого компонента. Все значения, записанные в этот словарь, будут доступны на клиентской стороне в виде JSON -объекта в свойстве $data.

Например, записав при загрузке текущую дату:

protected override void OnLoad()
{
  Data["serverTime"] = DateTime.Now;
}

До нее можно с легкостью добраться на клиентской стороне:

{
    $init: function() {
        alert(this.$data.serverTime);
    }
}

Данную методику можно использовать только в момент загрузки компонента, как при загрузке страницы, так и при его отложенной загрузке через JavaScript.

Если на клиентской стороне необходимо получить/отправить данные в произвольный момент, можно воспользоваться удаленным вызовом функции (RPC). Все методы компонента, помеченные атрибутом RpcMethodAttribute, можно вызывать удаленно.

Пример таких методов представлен ниже. Остается отметить, что такие методы, по сути, являются методами Веб-сервисов, для которых созданы прокси-классы в JavaScript:

public class MyUserControl : UserControl
{
    [JsonRpcMethod]
    public Person GetPersonById(int personId)
    {
        // возвращаем Person
    }
    [JsonRpcMethod]
    public void SavePerson(Person person)
    {
        // сохраняем Person
    }
}

Перегрузка функций поддерживается только по количеству параметров. По типу параметров перегрузка не поддерживается. В качестве параметров или возвращаемого значения могут быть произвольные объекты, которые впоследствии будут отформатированы в JSON -объекты.

14.2.7. Наследование компонент и страниц

Jasp поддерживает наследование компонент как на серверной стороне, так и на клиентской. У компонента наследуются все ресурсы от базового. С помощью наследования, можно, например, делать страницы, содержащие базовую разметку (по аналогии с MasterPage в ASP.NET ), но также и отдельные компоненты, которые содержат часть базовой разметки и могут быть использованы для производных компонент.

Для наследования компонент, достаточно унаследовать серверный класс. При этом все ресурсы компонента (разметка, стили и скрипты) будут дополнять или замещать ресурсы базового компонента.

14.2.7.1. Наследование разметки

По умолчанию, HTML разметка копируется от базового компонента. Но благодаря специальному тегу <replacement> можно заменять или удалять базовые компоненты. Например, у нас есть базовая разметка:

<body>
  <div id="div1">Первоначальный текст  </div>
</body>

И производная разметка:

<replacement id="div1">
  <div id="div2">Переопределенный текст</div>
  И другой текст  
</replacement>

При копировании разметки из базового компонента, вместо элемента с идентификатором div1 будет подставлена замена из тега replacement с одноименным идентификатором.

14.2.7.2. Наследование стилей

При добавлении CSS ресурса к наследуемому компоненту, Jasp будет добавлять его сразу после CSS ресурса родительского компонента. Тем самым, если создавать одноименные стили – они будут переопределяться. Данная практика наследования хорошо работает со стилями страницы, но при работе с компонент возникают проблемы – стили затираются и для родительского компонента, который может быть размещен на этой же странице, что неявно изменит его внешний вид. Решение для таких случаев – это создание стилей с другими именами.

14.2.7.3. Наследование JavaScript

Наследование JavaScript в Jasp реализовано через прототипы. Оно очень похоже на классическое наследование в объектно-ориентированном программировании (ООП). При определении новых методов, они будут переопределять родительские. В новом методе можно вызвать базовый метод. Например, JavaScript базового компонента:

{
    hi: function() {
        alert('Базовый привет!');
    }
}

И производного:

{
    hi: function() {
        alert('Привет!');
        BaseFooControl.prototype.call(this);
    }
}

Для библиотек, которые поддерживают наследование через прототипы (например, ExtJS) можно задать базовый класс для компонента из библиотеки с помощью атрибута ClientBaseAttribute:

[ClientBase("Ext.Window")]
public class FooControl : UserControl
{
    //....
    public FooControl(int fooId)
    {
        // подгружаем необходимые данные
    }
}

Клиентский код:

{
    onFooButtonClick: function() {
        // Создаем FooControl 
        // происходит вызов серверного конструктора – в нем можно подгрузить необходимые данные
        // и вызов $init – в нем инициализировать окно, подставить загруженные данные
        var fooControl = new FooControl({
            arg: [1] // параметры конструктора
        });
        // Показываем окно (метод show наследован из ExtJs)
        fooControl.show();
    }
    // ...
}

Благодаря этому, компонент на Jasp будет являться одновременно и компонентом ExtJS (либо другой библиотеки). Чтобы не было конфликтов с другими библиотеками, каждое свойство или функция на клиентской стороне начинается с $. Так, например, удается избежать конфликтов идентификаторов ( id ) или часто распространенных имен функций ( init ).

14.2.8. Конфигурирование Jasp

Jasp конфигурируется с помощью собственной секции в файле web.config.

Также необходимо добавить HttpHadler и WebServer Hadler, чтобы ASP.NET начал обрабатывать запросы Jasp. Если параметры не определены, Jasp конфигурируется в зависимости от конфигурации сборки. Если сборка Jasp собрана в Debug режиме, параметры оптимизированы для отладки, если сборка собрана в Release режиме, то параметры оптимизированы для производительности. В табл. 11.3 перечислены параметры конфигурации, которые поддерживает Jasp.

Параметр resourceFilter определяет класс, экземпляр которого будет заниматься фильтрацией текстовых ресурсов. Если нам нужно как-то отформатировать текстовый ресурс, например, удалить лишние пробелы или подменить ссылки, то можно создать класс, наследованный от класса Jasp.Resources.ResourceFilter и переопределять метод Filter(string name, StringBuilder data). Отфильтрованный ресурс впоследствии кэшируется. Для примера, переопределив этот параметр, можно производить замену путей в CSS-файлах библиотеки ExtJS автоматически, чтобы при обновлении этих файлов ничего не забыть.

Параметр exceptionFormatter используется для указания класса, экземпляр которого форматирует исключение при RPC-вызовах в JSON -объект. Если вам необходимо при возникновении исключения выводить дополнительные данные, например лог nHibernate, то это без труда можно сделать, переопределив метод Format класса Jasp.Web.ExceptionFormatter.

Узнав, что все ресурсы в Jasp должны быть embedded resource, многие думают, что для вступления в силу изменений в HTML, CSS или в JavaScript необходимо перекомпиляция проекта. За это отвечает параметр watchResources. Если он установлен в True, то Jasp следит за ресурсами, и при изменении автоматически их "подхватывает".

14.2.9. Ключевые термины

Jasp, .NET Framework, ASP.NET, jQuery, Ресурсы, Страницы, Компоненты, JSON, Наследование.

14.3. Краткие итоги

Веб-службы можно создавать, используя архитектуру ASP.NET, что позволяет им использовать разнообразную функциональность платформы.

При работе с Веб-сервисами существуют две фундаментальные роли:

ASP.NET позволяет создавать Веб-сервисы, к которым можно обращаться из клиентского сценария страниц.

Страницы взаимодействуют с сервером посредством уровня связи, использующего технологию AJAX для вызова Веб-служб.

Обмен данными между клиентом и сервером осуществляется асинхронно, как правило, в формате JSON.

Существует два подхода к вызовам методов Веб-сервиса:

Основные элементы уровня связи Веб-служб:

Элементы серверной архитектуры AJAX включают:

Веб-сервисы создаются в управляемом коде с помощью платформы ASP.NET:

Jasp является библиотекой для разработки Веб-приложений с использованием платформы Microsoft .NET Framework.

Основным отличием Jasp от ASP.NET является ориентация библиотеки на клиентскую сторону, чтобы программисту было проще создавать "богатый" пользовательский интерфейс в первую очередь средствами языка JavaScript, CSS и в последнюю очередь HTML, сгенерированным на стороне сервера.

При загрузке страницы, Jasp определяет, какие ресурсы используются на странице:

Для создания страницы, необходимо создать класс, наследующий от класса Jasp.Web.UI.Page.

Для создания компонент, необходимо создать класс, наследованный от класса Jasp.Web.UI.UserControl.

Экземпляры компонент могут создаваться:

Для передачи данных на клиентскую сторону, на сервере можно использовать словарь Data, который есть у каждого компонента.

Jasp поддерживает наследование компонент, как на серверной стороне, так и на клиентской.

Jasp конфигурируется с помощью собственной секции в файле web.config.