Windows Azure Mobile Services – краткое руководство по использованию. Часть 2.

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

Загрузите C# версию GetStartedWithData Developer Code Samples (рисунок 1).

Увеличить

Рис. 1. Developer Code Samples

Откройте проект в Visual Studio 2012 Express для Windows 8.

Откройте MainPage.xaml.cs.

Обратите внимание на то, что объекты TodoItem хранятся в памяти - ObservableCollection<TodoItem>.

Нажмите F5.

Введите текст в Insert a TodoItem и нажмите Save (рисунок 2).

Увеличить

Рис. 2. Интерфейс приложения

Сохраненный текст отображается в Queryandupdatedata.

Доступ к данным с использованием мобильного сервиса

Установите Mobile Services SDK.

В Visual Studio в Project нажмите AddReference, разверните Windows, нажмите Extensions, отметьте WindowsAzureMobileServicesManagedClient и нажмите OK (рисунок 3).

Увеличить

Рис. 3. Добавление зависимостей в приложение

Нажатие на кнопку добавит клиент мобильных сервисов в проект.

В MainPage.xaml.cs и App.xaml.cs добавьте следующий код:

using Microsoft.WindowsAzure.MobileServices;

На портале управления перейдите в MobileServices и выберите ваш мобильный сервис.

Перейдите на вкладку Dashboard и запишите SiteURL, а также, нажав Managekeys запишите Applicationkey(рисунок 4).

Увеличить

Рис. 4. Портал управления Windows Azure

В Visual Studio раскомментируйте в файле App.xaml.cs определяющий переменную MobileService код и вставьте соответствующие значения URL и application, скопированные с портала управления, в конструктор MobileServiceClient.

В MainPage.xaml.cs закомментируйте строку, определяющую коллекцию items и раскомментируйте следующие строки кода:

private MobileServiceCollectionView<TodoItem> items;

private IMobileServiceTable<TodoItem> todoTable =

App.MobileService.GetTable<TodoItem>();

В этом коде создается коллекция для мобильных сервисов (item) и проекси-класс для таблицы TodoItem (todoTable).

В методе InsertTodoItem удалите определяющую свойство TodoItem.Id строку, добавьте модификатор async , и раскомментируйте строку кода:

await todoTable.InsertAsync(todoItem);

В методе RefreshTodoItems раскомментируйте:

items = todoTable.ToCollectionView();

Этот код определяет привязку к коллекции сущностей в todoTable, содержащую все записи, возвращаемые мобильным сервисом.

В метод UpdateCheckedTodoItem добавьте модификатор async modifier to и раскомментируйте:

await todoTable.UpdateAsync(item);

Теперь приложение использует мобильный сервис как бэкенд для хранилища.

Запуск приложения

В Visual Studio нажмите F5.

Введите текст в InsertaTodoItem и нажмите Save. Это приведет к добавлению сущности мобильному сервису.

На портале управления перейдите на MobileServices и выберите ваш мобильный сервис.

Перейдите на вкладку Data и нажмите Browse (рисунок 5).

Увеличить

Рис. 5. Просмотр данных в таблице TodoItem

Замените в файле MainPage.xaml.cs метод RefreshTodoItems на следующий код, который будет осуществлять фильтрацию:

private void RefreshTodoItems()

{

    // Запрос отфильтровывает сущности

    items = todoTable

       .Where(todoItem => todoItem.Complete == false)

       .ToCollectionView();





ListItems.ItemsSource = items;





}

В приложении отметьте одну из сущностей в списке и нажмтие Refresh.

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

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

Проверка данных

Хорошим тоном является проверка длины данных, приходящих от пользователя. Зарегистрируем скрипт ,проверяющий длину данных в строке, отправляемой мобильному сервису, и выводящем ошибку для слишком длинных строк, в данном случае длиннее 10 символов.

На портале управления перейдите на MobileServices и выберите ваше приложение (рисунок 6).

Увеличить

Рис. 6. Портал управления Windows Azure

На вкладке Data нажмите на таблицу TodoItem (рисунок 7).

Увеличить

Рис. 7. Портал управления Windows Azure

Нажмите Script и выберите Insert (рисунок 8).

Увеличить

Рис. 8. Портал управления Windows Azure

Замените скрипт на код ниже и нажмите Save.

function insert(item, user, request) {

    if (item.text.length > 10) {

        request.respond(statusCodes.BAD_REQUEST, 'Text length must be under 10');

    } else {

        request.execute();

    }

}

В скрипте проверяется длина значения свойства TodoItem.text и генерируется ошибка в том случае, если она превышает 10 символов, иначе выполняется метод execute.

Обновление клиента

Откройте в Visual Studio 2012 Express для Windows 8 проект из предыдущей части.

Запустите приложение, нажав F5 key и попробуйте ввести строку длиннее 10 символов в поле InsertaTodoItem, после чего нажмите Save.

Будет выброшено исключение MobileServiceInvalidOperationException, так как код ответа с сервера будет 400 (Bad Request) .

Вставьте в MainPage.xaml.cs следующий код:

using Windows.UI.Popups;

Замените метод InsertTodoItem:

private async void InsertTodoItem(TodoItem todoItem)

{

// Происходит вставка в БД нового TodoItem.

// По завершению операции сущность добавляется в CollectionView

try

{

await todoTable.InsertAsync(todoItem);

items.Add(todoItem);

}

catch (MobileServiceInvalidOperationException e)

{

MessageDialog errormsg = new MessageDialog(e.Response.Content,

string.Format("{0} (HTTP {1})",

e.Response.StatusDescription,

e.Response.StatusCode));

var ignoreAsyncOpResult = errormsg.ShowAsync();

}

}

В этом коде обрабатывается исключение MobileServiceInvalidOperationException,выдавая ошибку во всплывающем окне.

Добавление даты к сущности

В Scripts на портале управления, замените скрипт Insert и нажмите Save.

function insert(item, user, request) {

    if (item.text.length > 10) {

        request.respond(statusCodes.BAD_REQUEST, 'Text length must be under 10');

    } else {

        item.createdAt = new Date();

        request.execute();

    }

}

Запустите приложение, нажав F5, после чего введите строку из более чем 10 символов в поле InsertaTodoItem и нажмите Save.

Обратите внимание, что нового поля даты в интерфейсе нет.

На портале управления на вкладке Browse выберите таблицу todoitem.

В базе столбец createdAt есть, и вставленная последней сущность имеет значение даты.

Обновление интерфейса приложения

Клиент мобильного сервиса игнорирует данные в ответе, которые нельзя сериализовать в свойства определенного типа. Добавим в интерфейс возможность отображать эти новые данные.

Замените в MainPage.xaml.cs класс TodoItem:

public class TodoItem

{

    public int Id { get; set; }





[DataMember(Name="text")]

public string Text { get; set; }





[DataMember(Name="complete")]

public bool Complete { get; set; }





[DataMember(Name="createdAt")]

public DateTime? CreatedAt { get; set; }





}

Новое определение класса содержит nullable DateTime.

Атрибут DataMemberAttribute сообщает клиенту о том, что необходимо соотнести новое свойство CreatedAt со столбцом createdAt из таблицы TodoItem.

Добавьте под элементом CheckBoxComplete в файле MainPage.xaml следующий код, который отобразит в текстовом поле новое поле CreatedAt:

Нажмите F5 для запуска приложения.

Замените RefreshTodoItems:

private void RefreshTodoItems()

{

    // В этом запросе отфильтровываются “завершенные”

// задачи и сущности без даты

    items = todoTable

       .Where(todoItem => todoItem.Complete == false

           && todoItem.CreatedAt != null)

       .ToCollectionView();





ListItems.ItemsSource = items;





}

Запустите приложение. Все сущности с неопределенным значением даты исчезли из списка в интерфейсе.