[iOS] Twilio Client SDK for iOS のサンプルを動かしてみた

Twilio Client SDK for iOS とは

Twilio Client SDK for iOS とは Twilio サービスを iOS から使うための公式ライブラリです。Twilio サービスを使うとさまざまなアプリに IP 電話機能をつけることができます。
ということで、iOS 版にも Android 版と同様のサンプルがあるのでまずは動かしてみたいと思います！

用意するもの

• Twilio アカウント (無料から始められます)
• Xcode (iOS SDK 4.2 以上)
• Twilio Client SDK for iOS
• iOS 端末 (4.2以上) とプロビジョニングファイル (iOS デベロッパー登録が必要)

サンプルアプリを動かしてみる

ということで、サンプルアプリである HelloMonkey というアプリを作ってみたいと思います。今回実装する内容は以下のとおりです。

1. Twilio アプリサーバーから Capability Token を取得する
2. Capability Token を使って Twilio サービスに接続する
3. Twilio が Twilio アプリサーバーに登録してある TwiML を取りにいく
4. クライアントアプリが TwiML の内容を読み上げる

サーバーサイドの実装

まずはサーバーサイドの実装です。QuickStart では Capability Token を取得するための API と TwiML を返す API の2つの API が必要となります。Android であれ iOS であれ Web アプリであれ、基本的には同じもので良いです。PHP の場合は以下のような API にします。

auth.php

<?php

// Found in the 'helper-libs' folder, or download twilio-php from http://twilio.com/docs/libraries
require "Services/Twilio/Capability.php";

$accountSid = "アカウントのSID"; 
$authToken = "アカウントの認証トークン";

// The app outgoing connections will use:
$appSid = "TwilioアプリのSID"; 

// The client name for incoming connections:
$clientName = "monkey"; 

$capability = new Services_Twilio_Capability($accountSid, $authToken);

// This would allow incoming connections as $clientName: 
$capability->allowClientIncoming($clientName);

// This allows outgoing connections to $appSid with the "From" parameter being $clientName 
$capability->allowClientOutgoing($appSid, array(), $clientName);

// This would return a token to use with Twilio based on 
// the account and capabilities defined above 
$token = $capability->generateToken(3600);

echo $token;
?>

$appSid は Twilio アプリを登録のときに生成される SID を入力します。Twilio アプリの登録は Twilio ユーザー画面から行うことができます。

hello.php

<?php
header('Content-type: text/xml');
?>
<Response>
    <Say language="ja-jp" voice="woman">電話ってこれね、おばさま！</Say>
</Response>

hello.php は TwiML を返す API です。TwiML の Say タグ内に入れた文字列が読み上げられます。TwiML の書きかたについてはこちらを参照しましょう。

なお Ruby on Rails で作りたいかたは こちら を、Node.js で実装したいかたは こちら を参照してください！

クライアントアプリの実装

まずは こちら から Twilio Client SDK for iOS をダウンロードしましょう。ダウンロードしたファイルを解凍すると QuickStart/HelloMonkey フォルダの中に HelloMonkey.xcodeproj があるので開きます。

Twilio のサンプルアプリはそのままでは動きません。「ベースは作ってあるからそれに従って実装してね」というスタンスなので、少しだけ実装しなければいけません。ということでまずは MonkeyPhone クラスから実装していきます。このクラスは Twilio サービスへの接続を行うクラスです。 init メソッドでは auth.php への GET 処理を実装していて、ここで Capability Token を取得しています。URL は自分のサーバーの URL に変更しましょう。またその他に connect メソッドと disconnect メソッドを実装します。

MonkeyPhone.h

#import <Foundation/Foundation.h>

#import "TCDevice.h"
#import "TCConnection.h"

@interface MonkeyPhone : NSObject
{
@private
	TCDevice* _device;
    TCConnection* _connection;
}

-(void)connect;
-(void)disconnect;

@end

MonkeyPhone.m

#import "MonkeyPhone.h"

@implementation MonkeyPhone


-(id)init
{
	if ( self = [super init] )
	{
// Replace the URL with your Capabilities Token URL
		NSURL* url = [NSURL URLWithString:@"http://companyfoo.com/auth.php"];
		NSURLResponse*  response = nil;
		NSError*  	error = nil;
		NSData* data = [NSURLConnection sendSynchronousRequest:
						[NSURLRequest requestWithURL:url] 
											 returningResponse:&response 
														 error:&error];
		if (data)
		{
			NSHTTPURLResponse*  httpResponse = (NSHTTPURLResponse*)response;
			
			if (httpResponse.statusCode == 200)
			{
				NSString* capabilityToken = [[[NSString alloc] initWithData:data
																	 encoding:NSUTF8StringEncoding] 
											   autorelease];
				
				_device = [[TCDevice alloc] initWithCapabilityToken:capabilityToken
															 delegate:nil];
			}
			else
			{
				NSString*  errorString = [NSString stringWithFormat:
											@"HTTP status code %d",                          
											httpResponse.statusCode];
				NSLog(@"Error logging in: %@", errorString);
			}
		}
		else
		{
			NSLog(@"Error logging in: %@", [error localizedDescription]);
		}
	}
	return self;
}


-(void)dealloc
{
	[_device release];
	[super dealloc];
}

-(void)connect
{
    _connection = [_device connect:nil delegate:nil];
    [_connection retain];
}


-(void)disconnect
{
    [_connection disconnect];
    [_connection release];
    _connection = nil;
}


@end

あとはこのクラスを HelloMonkeyViewController クラスから呼び出します。 connect を Dial ボタンが押されたタイミングで、また disconnect を Hangup ボタンが押されたタイミングでそれぞれ呼び出します。

HelloMonkeyViewController.m

#import "HelloMonkeyViewController.h"
#import "HelloMonkeyAppDelegate.h"
#import "MonkeyPhone.h"

@implementation HelloMonkeyViewController

@synthesize dialButton = _dialButton;
@synthesize hangupButton = _hangupButton;
@synthesize numberField = _numberField;

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
	// Limit to portrait for simplicity.
    return (interfaceOrientation == UIInterfaceOrientationPortrait);
}

- (void)viewDidUnload
{
	self.dialButton = nil;
	self.hangupButton = nil;
	self.numberField = nil;

	[super viewDidUnload];
}

-(IBAction)dialButtonPressed:(id)sender
{
    HelloMonkeyAppDelegate* appDelegate = (HelloMonkeyAppDelegate*)[UIApplication sharedApplication].delegate;
    MonkeyPhone* phone = appDelegate.phone;
    [phone connect];
}

-(IBAction)hangupButtonPressed:(id)sender
{
    HelloMonkeyAppDelegate* appDelegate = (HelloMonkeyAppDelegate*)[UIApplication sharedApplication].delegate;
    MonkeyPhone* phone = appDelegate.phone;
    [phone disconnect];
}

@end

これで実装は終わりです！あとは実行してみましょう！と、エラーが。

使われているライブラリが正しく参照できていないようです。ということで参照させましょう。プロジェクトをクリックし、TARGETS の HelloMonkey を選択し BuildPhases タブを選択します。そしてその中の Link Binary With Libraries を開き、追加ボタンをクリックします。

追加するライブラリ一覧が出てくるので、Add Other... ボタンをクリックします。そして Twilio Clinet SDK for iOS の中にある Libraries フォルダから libcypto.a libssl.a libTwilioClient.a を選択します。

これでもう一度実行すればエラーなく起動できるようになると思います！あとは Dial ボタンをクリックすると自分のサーバーに実装した TwiML の内容を読み上げてくれます。ちょっと時間がかかる場合もあるので、音声が聞こえない場合も焦らずログでエラーが出るまでは気長に待ちましょう…。

まとめ

まずは QuickStart の前半戦のみ試してみました。Android 版とほぼ同じ感じで実装できますね。今後 Android アプリや Web アプリとの通話などを試していこうと思います。

参考

• Twilio クライアント for iOS クイックスタート チュートリアル | Twilio Docs