Приложения VoIP для iOS с использованием Twilio Client и Azure Mobile Services

В этом руководстве мы сосредоточимся на том, как интегрировать эти сервисы в iOS, дорабатывая простое приложение для списка дел. Мы также будем интегрировать Twilio Client, что позволит нам звонить по номерам телефонов прямо из нашего iOS-приложения. Нам предстоит много работы, так что давайте начнем!

**Первые шаги**

Если вы еще этого не сделали, зарегистрируйтесь в Windows Azure. Для новых пользователей доступна бесплатная пробная версия, так что вы сможете начать сразу. Чтобы создать приложение Windows Azure Mobile Services, сначала нужно создать приложение в панели управления Windows Azure. На панели инструментов нажмите ссылку «NEW» внизу экрана. Выберите создание нового мобильного сервиса, который находится в подменю «COMPUTE»:

Далее вы создадите новый сервер базы данных, который будет содержать данные вашего приложения. Если вы создаете базу данных впервые, конфигурация, подобная этой, должна подойти — запомните имя пользователя и пароль администратора базы данных на случай, если вам понадобится вручную получить доступ к базе данных позже:

**Настройка проекта Xcode**

При создании первого приложения AMS вам будет представлена панель быстрого старта для вашего мобильного приложения. Вы увидите варианты для начала работы с различными клиентскими платформами, но сегодня мы сосредоточимся на iOS. Обратите внимание, что для использования Xcode 4 и инструментов разработки iOS вам понадобится Mac с поддерживаемой версией OS 10 (на момент написания это 10.6 Snow Leopard). Выберите руководство быстрого старта для iOS:

**Использование Windows Azure Mobile Services для хранения данных**

Мы не будем рассматривать весь код сгенерированного примера приложения, но давайте рассмотрим некоторые ключевые моменты. Сейчас наше приложение имеет только один контроллер представления, который будет создан стандартным сторибордом приложения. В сгенерированном проекте этот файл называется «QSTodoListViewController.m». Первое событие жизненного цикла, которое нас интересует, — это «viewDidLoad», которое будет выполнено после инициализации контроллера представления из сториборда/xib файла:

Сервис Windows Azure Mobile Services инициализируется на шестой строке приведенного выше фрагмента кода. Этот метод класса создаст новый объект-одиночку, который будет обращаться к хранилищу данных списка дел в облаке. Для этого требуется специальный ключ бэкенда, встроенный в ваше приложение, как в этом коде ниже, взятом из «QSTodoService.m»:

Этот клиент будет использоваться для чтения, создания и обновления элементов списка дел из вашей базы данных. Чтобы создать элемент списка дел, вы обратитесь к клиенту Windows Azure Mobile Services для сохранения NSDictionary свойств в таблице базы данных. Обратите внимание, что свойства таблиц бэкенда не нужно заранее определять (по умолчанию) в хранилище данных — Windows Azure Mobile Services динамически добавит столбцы для любых свойств, добавленных в объект словаря, который мы передаем! Вы также заметите, что блоки Objective-C используются для любых операций, требующих доступа к сети, и будут выполняться асинхронно:

Этот код используется для обновления записи в таблице хранилища данных:

Для чтения элементов из хранилища данных мы создаем запрос (с использованием NSPredicate) для получения всех элементов списка дел, которые не завершены:

Вот так у нас появилось нативное iOS-приложение, интегрированное с бэкендом Windows Azure Mobile Services. А не было бы здорово, если бы наше приложение для списка дел было умнее с ссылками в текстовом содержимом? Что, если бы при обнаружении номера телефона в элементе списка дел мы могли бы нажать на него и сразу же позвонить по этому номеру прямо из нашего приложения?

SDK Twilio Client для iOS позволяет нам сделать именно это, но давайте начнем с изменения нашего табличного представления, чтобы отображать номера телефонов как кликабельные ссылки с использованием стороннего компонента, предназначенного для этого.

**Интеграция сторонних компонентов с CocoaPods**

CocoaPods — это управляемый сообществом репозиторий для библиотек Objective-C. Многие авторы библиотек делают свои программы доступными в виде «подов», чтобы пользователи могли быстро устанавливать эти модули (и их зависимости). Если у вас еще не установлен Cocoapods, настройте его, следуя инструкциям на главной странице. CocoaPods распространяется как Ruby gem, который легко установить из Терминала в OS X. Для большинства систем достаточно следующих двух команд для установки и настройки CocoaPods:

[sudo] gem install cocoapods

pod setup

CocoaPods поможет вам установить компоненты, от которых зависит ваш проект, используя конфигурационный файл под названием Podfile. Чтобы отредактировать этот файл, перейдите в Терминале в ту же директорию, где находится директория «supertodos.xcodeproj» (замените «supertodos» на название вашего приложения). На том же уровне, что и директория проекта Xcode, создайте файл с именем «Podfile». Откройте его в вашем любимом текстовом редакторе и введите следующее содержимое (это на самом деле Ruby-файл):

Установите эти поды (и их зависимости), выполнив команду «pod install» в Терминале. **ПРИМЕЧАНИЕ:** Используя Cocoapods, теперь вам нужно будет запускать проект через файл .xcworkspace, связанный с вашим проектом Xcode! Давайте сделаем это сейчас — закройте все работающие симуляторы и выйдите из Xcode (это не обязательно, но так мы избежим путаницы с несколькими окнами). Из Терминала выполните команду «open supertodos.xcworkspace», заменив «supertodos» на название вашего приложения. Когда Xcode запустится, вы должны увидеть рабочую область, похожую на эту:

**Использование TTTAttributedLabel**

TTTAttributedLabel поможет нам отображать ссылки в виде замены для UILabel. В нашем случае мы хотим автоматически связывать любые телефонные номера внутри меток элементов списка дел и реагировать на их нажатие. Поскольку мы будем программно создавать метки, откройте «MainStoryboard_iPhone.storyboard» и «MainStoryboard_iPad.storyboard» в Interface Builder, выберите метки с текстом «Label» и удалите их с клавиатуры. После удаления этих меток нам нужно написать код для отображения кликабельных ссылок.

Для начала настройки ячеек таблицы нам нужно отредактировать «QSTodoListViewController.m» и «QSTodoListViewController.h». В «QSTodoListViewController.h» мы импортируем заголовок TTTAttributedLabel и укажем, что собираемся реализовать части протокола TTTAttributedLabelDelegate:

В «QSTodoListViewController.m» мы начнем с импорта необходимого заголовка в начале файла:

Теперь, когда мы создаем ячейки табличного представления для основного элемента управления таблицей, мы будем использовать эти атрибутированные метки вместо встроенного UILabel. Замените текущую версию «tableView:cellForRowAtIndexPath:» следующей реализацией:

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

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

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

**Использование Twilio Client для VoIP-звонков**

Ранее, когда мы устанавливали под для TTTAttributedLabel, мы также установили под в разработке, содержащий SDK Twilio Client для iOS. Теперь мы собираемся использовать его, чтобы сделать исходящий звонок прямо из нашего iOS-приложения.

Для использования Twilio Client вашему приложению нужно иметь код, работающий на сервере, чтобы генерировать так называемый capability token. Это длинная строка, подписанная вашим Twilio Account SID и токеном аутентификации, которые вы получили при регистрации аккаунта.

Ради экономии времени мы не будем углубляться в настройку сервера. В течение примерно недели после публикации этого поста я предоставлю URL, который может генерировать токены, и он будет встроен в код ниже. Это серверное приложение написано на node.js и развернуто как веб-сайт Windows Azure! Вы можете ознакомиться с исходным кодом здесь.

Чтобы начать звонить, включите библиотеки Twilio Client в начало файла вашего контроллера представления:

Прежде чем сделать исходящий звонок, нам нужно получить capability token с сервера. При инициализации нашего представления мы сделаем HTTP-запрос для получения capability token и создадим Twilio Device (который действует как программный телефон в вашем мобильном приложении). В разделе UIView добавьте этот метод для инициализации устройства:

Теперь, когда номер телефона нажат, давайте сделаем звонок! Чтобы включить это, замените метод TTTAttributedLabelDelegate следующим:

Через несколько мгновений у вас должен быть исходящий звонок, соединяющий ваш iPad или iPhone с любым телефоном в сети PSTN!

**Заключение**

В этом примере мы создали приложение Windows Azure Mobile Services, интегрировали его в нативный iOS-проект и добавили базовую функциональность голосовых вызовов. Очевидно, что это лишь поверхностное знакомство с возможностями как Windows Azure Mobile Services, так и Twilio Client. Windows Azure Mobile Services предоставляет удобный бэкенд для мобильных приложений, устраняя множество серверного кода. Twilio Client избавляет от головной боли с инфраструктурой VoIP и добавляет голосовое взаимодействие в любое приложение. Вместе они являются отличным дополнением к инструментарию мобильного разработчика, что позволит сократить усилия и количество строк кода в их проектах. Надеюсь, вам понравится использовать оба сервиса!