WebからJavaScriptで利用する Amazon Mobile Analytics #アドカレ2015

アドベントカレンダー2015：AWSモバイル

#JavaScript

#Amazon Mobile Analytics

#AWS

深澤豪

2015.12.08

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

Amazon Mobile Analyticsとは

Amazon Mobile Analytics は、アプリケーションの使用状況データを大規模に収集して視覚化し、開発者が簡単に把握できるようにするサービスです。

例えばECサービスのスマートフォンアプリで購入ボタンをタップした時に、価格と品名と個数を送信するような使い方をします。このデータが数多く集まると雨の日は傘が売れること（これは当たり前ですが）などが分かり、梅雨の季節には傘の在庫を多く揃える、または過去に傘を定期的に買っている顧客に対してよく買っている柄物系のカテゴリの傘を通知するなどのアクションが取れます。
Amazon Mobile Analytics（以下MA）の一番のメリットは他のAWSのサービス、特にデータウェアハウスであるAmazon Redshiftとの親和性です。Auto Exportと呼ばれるRedshiftに取り込むまでの設定もAWS マネジメントコンソールから本当に簡単に行えます。Auto Exportされた生データはS3にも保存されるため、他のデータ解析ツールを活用することも可能です。この時に”購入した”などのイベントを集めたサービスとは別ルートからのデータである、例えば在庫管理システムのデータをRedshiftなどに取り込み、アプリからMA経由で取得したイベントデータと合わせて解析対象とすることができます。すると在庫状況と合わせてユーザーへの通知を行うかどうかの決定などができます。
AWS マネジメントコンソールでも取得されたイベントデータの閲覧は可能です。
また料金もリーズナブルで1億イベントまで無料の他、それを超えても100万イベントあたり1USドルとなっています。
注意点としてはMAで扱う時間がUTCであること、またバージニアリージョンのみで利用可能なことが挙げられます。時間は日本で使うのであれば必要に応じてJST変換、バージニアリージョンの課題はレイテンシですがMAの特性上、裏で非同期で通信するものなので問題になる事は少ないはずです。

Amazon Mobile Analytics SDK for JavaScript

モバイルアプリ開発でMAを使う場合、iOS/Androidはネイティブの各SDKを利用し、WebViewがある場合にHTMLで開発された内部のイベントを追跡するためにAmazon Mobile Analytics SDK for JavaScriptを使います。その場合、WebView内部を統合してAndroid/iOSの各プラットフォームのデータとして扱う事が可能です。
またSDKは、オフライン時にローカルデータとしてイベント情報を保存したり、定期的に自動送信したりする機能を持っています。

使ってみる

Mobile Analytics App の作成

https://github.com/aws/aws-sdk-mobile-analytics-js の手順に従います。

1 App Nameを設定します。

2 次の画面ではIAM Role(AWSリソースへのアスセス権限)を設定します。デフォルトの状態で、Mobile Analyticsへのデータの送信とCognito[Sync]の利用が許可されます。他のAWSサービスもそうですが、Mobile Analyticsを利用するためには認証情報が必要です。アプリケーションに認証情報を埋め込むことなく、ここで設定した権限を一時的に発行してくれるのがCognitoです。
Cognitoの概要についてのとても分かりやすい記事はこちらです。

3これだけで設定は終わりです。最後にサンプルのコードが表示されるので、今回はJavaScriptのタブを表示します。サンプルコードには実際に使われるCognitoのIdentityPoolIdやMAのappIdが含まれているのでコピペでOKです。

4 Cognitoを確認してみるとIdentity Poolが自動的に作成されています。

ソース

aws-sdk-mobile-analytics.min.js, aws-sdk.min.jsをダウンロードして設定します。

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Amazon Mobile Aaytics Sample</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
  <button type="button" id="favorite">気に入った</button>
  <button type="button" id="buy">買う</button>
<!-- aws-sdk-mobile-analytics.min.jsとaws-sdk.min.jsの2つを読み込みます。 -->
<script src="aws-sdk-mobile-analytics.min.js" acync></script>
<script src="aws-sdk.min.js" acync></script>
<script>
(function(){

AWS.config.region = 'us-east-1';
AWS.config.credentials = new AWS.CognitoIdentityCredentials({
    IdentityPoolId: 'us-east-1:215xxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx' //Amazon Cognito Identity Pool ID
});

var options = {
    appId : 'xxx6e7xxxx7xxxeaxxxxxxx76', // Mobile Analytics の appId 必須
    submitCallback : function(){
        console.log("success!");
    }
};

var mobileAnalyticsClient = new AMA.Manager(options);

// カスタムイベント		
var favorite = document.getElementById('favorite');
favorite.onclick = function() {
	 mobileAnalyticsClient.recordEvent('Favorites registered', {
            'screen' : 'Product',
            action : 'Favorited',
            item : 'Coffee beans'
        });
}

// 収益化イベント
var buy = document.getElementById('buy');
buy.onclick = function() {
	alert('Buy');
	mobileAnalyticsClient.recordMonetizationEvent(
        {
            productId : 'Coffee beans', 
            price : 520,
            quantity : 3,
            currency : 'JPY'
        }, 
        {
        	roast : 'Dark'
        },
        {
        	grams : 100
        }
    );
}

// 画面遷移前に明示的に送信
onbeforeunload = function(){
    mobileAnalyticsClient.submitEvents();
}

})();
</script>
</body>
</html>

AWS.config.region Cognitoのリージョンを設定をします。特にが理由がない限りはMAと同じus-east-1が良さそうです。
AWS.config.credentials認証情報を設定します。Cognitoを使うので、IdentityPoolIdだけ設定値を渡します。
var options色々とオプションはありますが、appIdのみ必須項目です。MAの識別IDです。
var mobileAnalyticsClient = new AMA.Manager(options); MAのクライアントを生成します。このクライアントでイベントの操作をします。
mobileAnalyticsClient.recordEventカスタムイベントを記録します。引数は(イベント名, Attribute, Metric)です。Attributeは商品名などの属性値、Metricは価格や数量などの数値をオブジェクトで設定します。
mobileAnalyticsClient.recordMonetizationEventマネタイズイベントを設定します。おそらくRedshiftなどで見る場合は同様のことがカスタムイベントでも可能ですが、これを設定することで明示的にマネジメントコンソール上でAverage Reveue Per User (ARPU)などを測定可能です。引数は(商品情報,Attribute, Metric)です。商品情報のみ固定のプロパティでproductId,price,quantity,currency(Option)を設定する必要があります。

基本的にはこれだけですが、その他設定項目についてはAPIドキュメントを参照してください。

マネジメントコンソールでの表示

おおっ、今日は$50の売上があったようですね！

まとめ

AWSマネジメントコンソールが使いやすいようにサンプルコードまでをお膳立てしてくれます。今回は紹介していませんが、S3へUploadやRedshiftへの連携も同様に簡単に行えます。おかげでイベントやAttribute/Metricの設計の方に多くの時間を使うことができます。Google Analyticsと比較してどうなの？と気になってる方も多いと思いますが、是非一度使ってみてはいかがでしょうか。

※ Amazon Mobile Analytics SDK for JavaScript は Developer Previewです（2015/12/8現在）