Xamarin.Android アプリ用 Azure Mobile Engagement の使用Get Started with Azure Mobile Engagement for Xamarin.Android Apps

このトピックでは、Azure Mobile Engagement を使用してアプリの使用状況を把握する方法と、Xamarin.Android アプリケーションのセグメント化されたユーザーにプッシュ通知を送信する方法について説明します。This topic shows you how to use Azure Mobile Engagement to understand your app usage and how to send push notifications to segmented users of a Xamarin.Android application. このチュートリアルでは、Mobile Engagement を使用した簡単なブロードキャスト シナリオのデモンストレーションを行います。This tutorial demonstrates the simple broadcast scenario using Mobile Engagement. このシナリオでは、基本的なデータを収集し、Google Cloud Messaging (GCM) を使ってプッシュ通知を受信する空の Xamarin.Android アプリを作成します。In it, you create a blank Xamarin.Android app that collects basic data and receives push notifications using Google Cloud Messaging (GCM).

注意

Azure Mobile Engagement サービスは 2018 年 3 月に停止予定であり、現在は既存のお客様のみご利用いただけます。The Azure Mobile Engagement service will be retired March 2018 and is currently only available to existing customers. 詳細については、「Mobile Engagement」を参照してください。For more information, see Mobile Engagement.

このチュートリアルには、次のものが必要です。This tutorial requires the following:

注意

このチュートリアルを完了するには、アクティブな Azure アカウントが必要です。To complete this tutorial, you must have an active Azure account. アカウントがない場合は、無料試用版のアカウントを数分で作成することができます。If you don't have an account, you can create a free trial account in just a couple of minutes. 詳細については、「Azure の無料試用版サイト」をご覧ください。For details, see Azure Free Trial.

Android アプリ用のモバイル エンゲージメントの設定Setup Mobile Engagement for your Android app

  1. Azure Portal にログオンします。Log on to the Azure Portal.
  2. [新規][Web + モバイル][Mobile Engagement] の順にクリックします。Click on New, then Web + Mobile, and then Mobile Engagement.

  3. 表示される [New Mobile Engagement App Collection (新しい Mobile Engagement アプリ コレクション)] ブレードで、Azure クラシック ポータルで作成するように、アプリではなくアプリ コレクションを作成します。In the New Mobile Engagement App Collection blade that appears, you will be creating an App Collection instead of an App like in the Azure classic portal. 次の情報を入力します。Enter the following information:

    • 名前: 名前 of your アプリケーション コレクションName: Name of your application collection
    • プラットフォーム: クリックすると開く [プラットフォーム] ブレードでアプリのターゲット プラットフォームを選択します。Platforms: Select target platforms for your app on the Platforms blade which will open up. 例:E.g. アプリを iOS と Android の両方に対応させる場合は、両方のプラットフォームを選択すると、このアプリ コレクションの下に 2 つのアプリが作成されます。if you want an app for both iOS & Android then select both platforms and you will get two apps created under this app collection.

    • サブスクリプション: Azure サブスクリプションを選択します。Subscription: Select the Azure subscription.
    • リソース グループ: この Azure リソース (Mobile Engagement アプリ コレクション) を追加する Azure リソース グループを選択します。Resource group: Select the Azure Resource group in which you want this Azure resource (Mobile Engagement App Collection). 新しいリソース グループを作成することもできます。You can choose to create a new one.
    • 場所: このアプリ コレクションとアプリについてのデータが格納されるリージョン。Location: Region where the data about this app collection & app will be stored.
  4. [参照] をクリックし、"Mobile Engagement" を検索して Mobile Engagement アプリ コレクションを参照します。Browse through the Mobile Engagement app collections by clicking Browse and search for Mobile Engagement

  5. Mobile Engagement アプリ コレクションの一覧が表示されるので、アプリ コレクションを作成した同じ Azure サブスクリプションがあることを確認します。You will be shown a list of Mobile Engagement App Collections - make sure you have the same Azure subscription where you created your App Collection.

  6. 前の手順で作成したアプリ コレクションをクリックして、アプリ コレクション リソースのブレードを開きます。ブレードには、このアプリ コレクション内に存在するさまざまなアプリが表示されます。Click on the App Collection that you created in the prior step to open up the App Collection resource blade which will show the different apps present inside this app collection.

  7. 開発対象とするプラットフォーム向けに作成したアプリをクリックします。Click on the App created for the platform you are developing for.

  8. 上部の [接続情報] コマンド ボタンをクリックして [接続情報] ブレードを開き、そこに表示される接続文字列をコピーします。Click on Connection Info command button at the top to open up the Connection Info blade and copy the connection string from there.

アプリを Mobile Engagement のバックエンドに接続しますConnect your app to the Mobile Engagement backend

このチュートリアルでは、データを収集してプッシュ通知を送信するために必要な最小限のセットである「基本的な統合」について説明します。This tutorial presents a "basic integration", which is the minimal set required to collect data and send a push notification.

統合のデモンストレーションを行うために、Xamarin Studio で基本的なアプリを作成します。We will create a basic app with Xamarin Studio to demonstrate the integration.

新しい Xamarin.Android プロジェクトを作成するCreate a new Xamarin.Android project

  1. Xamarin Studio を起動して、[File (ファイル)] -> [New (新規)] -> [Solution (ソリューション)] の順に移動します。Launch Xamarin Studio Go to File -> New -> Solution

  2. [Android App (Android アプリ)] を選択し、選択されている言語が [C#] であることを確認してから、[Next (次へ)] をクリックします。Select Android App then make sure the selected language is C# and click Next.

  3. アプリ名組織 ID を入力します。Fill in the App Name and the Organization Identifier. [Google Play Services] チェック ボックスがオンになっていることを確認し、[Next (次へ)] をクリックします。Make sure to checkmark Google Play Services and then click Next.

  4. 必要に応じて [Project Name (プロジェクト名)][Solution Name (ソリューション名)][Location (位置)] を変更し、[Create (作成)] をクリックします。Update the Project Name, Solution Name and Location if required and click Create.

Xamarin Studio で、Mobile Engagement の統合先のアプリが作成されます。Xamarin Studio will create the app in which we will integrate Mobile Engagement.

アプリを Mobile Engagement のバックエンドに接続するConnect your app to Mobile Engagement backend

  1. [Solution (ソリューション)] ウィンドウの Packages フォルダーを右クリックし、[Add Packages (パッケージの追加)] を選択します。Right click the Packages folder in the Solution windows and select Add Packages...

  2. Microsoft Azure Mobile Engagement Xamarin SDK を探してソリューションに追加します。Search for the Microsoft Azure Mobile Engagement Xamarin SDK and add it to your solution.

  3. MainActivity.cs を開き、次の using ステートメントを追加します。Open MainActivity.cs and add the following using statements:

     using Microsoft.Azure.Engagement;
     using Microsoft.Azure.Engagement.Activity;
    
  4. OnCreate メソッドに、Mobile Engagement バックエンドとの接続を初期化する次のコードを追加します。In the OnCreate method, add the following to initialize the connection with Mobile Engagement backend. ConnectionStringを必ず追加してください。Make sure to add your ConnectionString.

     EngagementConfiguration engagementConfiguration = new EngagementConfiguration();
     engagementConfiguration.ConnectionString = "YourConnectionStringFromAzurePortal";
     EngagementAgent.Init(engagementConfiguration);
    

アクセス権限とサービス宣言を追加するAdd permissions and a service declaration

  1. Properties フォルダーの下にある Manifest.xml ファイルを開きます。Open up the Manifest.xml file under the Properties folder. [Source] (ソース) タブを選択して、XML ソースを直接更新します。Select Source tab so that you directly update the XML source.
  2. 次のアクセス許可を、プロジェクトの Manifest.xml 内の <application> タグの直前または直後に追加します (Manifest.xml は Properties フォルダーの下にあります)。Add these permissions to the Manifest.xml (which can be found under the Properties folder) of your project immediately before or after the <application> tag:

     <uses-permission android:name="android.permission.INTERNET"/>
     <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
     <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
     <uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED" />
     <uses-permission android:name="android.permission.VIBRATE" />
     <uses-permission android:name="android.permission.DOWNLOAD_WITHOUT_NOTIFICATION"/>
    
  3. 次の設定を <application>タグと</application> タグの間に追加して、エージェント サービスを宣言します。Add the following between the <application> and </application> tags to declare the agent service:

     <service
          android:name="com.microsoft.azure.engagement.service.EngagementService"
          android:exported="false"
          android:label="<Your application name>"
          android:process=":Engagement"/>
    
  4. 貼り付けたばかりのコードの label 内の "<Your application name>" をアプリケーション名に置き換えます。In the code you just pasted, replace "<Your application name>" in the label. この内容は [設定] メニューに表示されます。デバイスで実行されているサービスをユーザーはここで確認できます。This is displayed in the Settings menu where users can see services running on the device. たとえば、このラベルに「サービス」という語句を追加できます。You can add the word "Service" in that label for example.

画面を Mobile Engagement に送信するSend a screen to Mobile Engagement

データを送信してユーザーがアクティブであることを確認するには、少なくとも 1 つの画面を Mobile Engagement のバックエンドに送信する必要があります。In order to start sending data and ensuring the users are active, you must send at least one screen to the Mobile Engagement backend. これを行うには、MainActivityActivity ではなく EngagementActivity から継承するようにします。For doing this - ensure that the MainActivity inherits from EngagementActivity instead of Activity.

public class MainActivity : EngagementActivity

EngagementActivity からの継承ができない場合は、.StartActivity メソッドと .EndActivity メソッドを、それぞれ OnResumeOnPause に追加する必要があります。Alternatively, if you cannot inherit from EngagementActivity then you must add .StartActivity and .EndActivity methods in OnResume and OnPause respectively.

    protected override void OnResume()
        {
            EngagementAgent.StartActivity(EngagementAgentUtils.BuildEngagementActivityName(Java.Lang.Class.FromType(this.GetType())), null);
            base.OnResume();             
        }

        protected override void OnPause()
        {
            EngagementAgent.EndActivity();
            base.OnPause();            
        }

リアルタイム監視を使用してアプリを接続するConnect app with real-time monitoring

このセクションでは、Mobile Engagement のリアルタイム監視機能を使用して、アプリを Mobile Engagement バックエンドに接続する方法について説明します。This section shows you how to connect your app to the Mobile Engagement backend by using the Mobile Engagement's real-time monitoring feature.

  1. Azure Mobile Engagement アカウントで、Mobile Engagement ポータルで監視および管理するアプリを選択していることを確認します。In your Azure Mobile Engagement account, make sure you select the app you wish to monitor and manage in the Mobile Engagement portal. 下部にある [エンゲージ] ボタンをクリックして、Mobile Engagement ポータルに移動します。Navigate to your Mobile Engagement portal by clicking the Engage button at the bottom.

  2. Mobile Engagement ポータルに移動します。You will land in the Mobile Engagement portal. [監視] タブが選択されていない場合は、 [監視]をクリックします。If the Monitor tab is not selected, click on the Monitor.
  3. モニターがアプリを起動するデバイスをリアルタイムで表示する準備が整いました。The monitor is ready to show you any device in real time, which will start your app.
  4. アプリを起動します。Start your app now. 統合が適切に行われていれば、モニターには 1 つのセッションが表示されます。これは、アプリが Mobile Engagement バックエンドに接続され、バックエンドにデータを送信していることを意味します。You should see one session in the monitor if your integration is correct which means that your app is now connected to the Mobile Engagement backend and is sending data to it.

プッシュ通知とアプリ内メッセージングを有効にするEnable push notifications and in-app messaging

Mobile Engagement を導入すると、プッシュ通知とアプリ内メッセージングを利用して、ユーザーにキャンペーン情報を提供できます。Mobile Engagement allows you to interact with and REACH your users with push notifications and in-app messaging in the context of campaigns. このモジュールは、Mobile Engagement ポータルで REACH として呼び出されます。This module is called REACH in the Mobile Engagement portal. 次のセクションでは、それらを受信するようにアプリをセットアップします。The following sections sets up your app to receive them.

API キーを使用して Google Firebase プロジェクトを作成するCreate a Google Firebase project with API key

注意

この手順を完了するには、検証済みの電子メール アドレスを持つ Google アカウントが必要になります。To complete this procedure, you must have a Google account that has a verified email address. 新しい Google アカウントを作成するには、accounts.google.com にアクセスしてください。To create a new Google account, go to accounts.google.com.

  1. Cloud Console に移動し、Google アカウントの資格情報でサインインします。Navigate to the Firebase Console and sign-in with your Google account credentials.
  2. [新規プロジェクトを作成] をクリックして新しいプロジェクトを作成します。Click on Create new Project button to create a new project. 代わりに、[Google プロジェクトをインポート] をクリックして既存のプロジェクトをインポートすることもできます。Alternatively, you can also click on Import Google Project to import and existing project.
  3. プロジェクトを新しく作成する場合には、[プロジェクト名] を入力し、[国 / 地域] を選択します。If you opted for creating a new project then provide a Project name and choose a Country/Region.
  4. プロジェクトのページの左上に設定を編集するための歯車があるので、それをクリックします。On your project page, click the Settings cog wheel at the top left. メニューで [プロジェクトの設定] をクリックします。In the menu, click on Project settings.
  5. 上部にある [クラウド メッセージング] タブをクリックします。Click on the Cloud Messaging tab at the top.
  6. サーバー キー送信者 ID をメモします。この情報は、後で "Android マニフェスト ファイル" で必要になります。Make a note of the Server Key and the Sender ID that you will use later in the Android Manifest file.

マニフェスト ファイルを更新して通知を有効にするUpdate manifest file to enable notifications

Manifest.xml の <application> タグと </application> タグの間に、次のアプリ内メッセージングのリソースをコピーします。Copy the in-app messaging resources below into your Manifest.xml between the <application> and </application> tags.

    <activity android:name="com.microsoft.azure.engagement.reach.activity.EngagementTextAnnouncementActivity" android:theme="@android:style/Theme.Light" android:exported="false">
          <intent-filter>
            <action android:name="com.microsoft.azure.engagement.reach.intent.action.ANNOUNCEMENT"/>
            <category android:name="android.intent.category.DEFAULT" />
            <data android:mimeType="text/plain" />
          </intent-filter>
    </activity>
    <activity android:name="com.microsoft.azure.engagement.reach.activity.EngagementWebAnnouncementActivity" android:theme="@android:style/Theme.Light" android:exported="false">
        <intent-filter>
            <action android:name="com.microsoft.azure.engagement.reach.intent.action.ANNOUNCEMENT"/>
            <category android:name="android.intent.category.DEFAULT" />
            <data android:mimeType="text/html" />
        </intent-filter>
    </activity>
    <activity android:name="com.microsoft.azure.engagement.reach.activity.EngagementPollActivity" android:theme="@android:style/Theme.Light" android:exported="false">
        <intent-filter>
            <action android:name="com.microsoft.azure.engagement.reach.intent.action.POLL"/>
            <category android:name="android.intent.category.DEFAULT" />
        </intent-filter>
    </activity>
    <activity android:name="com.microsoft.azure.engagement.reach.activity.EngagementLoadingActivity" android:theme="@android:style/Theme.Dialog" android:exported="false">
        <intent-filter>
            <action android:name="com.microsoft.azure.engagement.reach.intent.action.LOADING"/>
            <category android:name="android.intent.category.DEFAULT"/>
        </intent-filter>
    </activity>
    <receiver android:name="com.microsoft.azure.engagement.reach.EngagementReachReceiver" android:exported="false">
        <intent-filter>
            <action android:name="android.intent.action.BOOT_COMPLETED"/>
            <action android:name="com.microsoft.azure.engagement.intent.action.AGENT_CREATED"/>
            <action android:name="com.microsoft.azure.engagement.intent.action.MESSAGE"/>
            <action android:name="com.microsoft.azure.engagement.reach.intent.action.ACTION_NOTIFICATION"/>
            <action android:name="com.microsoft.azure.engagement.reach.intent.action.EXIT_NOTIFICATION"/>
            <action android:name="com.microsoft.azure.engagement.reach.intent.action.DOWNLOAD_TIMEOUT"/>
        </intent-filter>
    </receiver>
    <receiver android:name="com.microsoft.azure.engagement.reach.EngagementReachDownloadReceiver">
        <intent-filter>
            <action android:name="android.intent.action.DOWNLOAD_COMPLETE"/>
        </intent-filter>
    </receiver>

通知のアイコンを指定します。Specify an icon for notifications

次の XML スニペットを Manifest.xml の <application> タグと </application> タグの間に貼り付けます。Paste the following XML snippet in your Manifest.xml between the <application> and </application> tags.

    <meta-data android:name="engagement:reach:notification:icon" android:value="engagement_close"/>

これにより、システムおよびアプリ内通知の両方に表示されるアイコンが定義されます。This defines the icon that is displayed both in system and in-app notifications. これはアプリ内通知では任意ですが、システム通知では必須です。It is optional for in-app notifications however mandatory for system notifications. Android では無効なアイコンが設定されたシステム通知は拒否されます。Android will rejects system notifications with invalid icons.

いずれかの描画可能なフォルダーにあるアイコン (engagement_close.png など) を使用してください。Make sure you are using an icon that exists in one of the drawable folders (like engagement_close.png). mipmap フォルダーはサポートされていません。mipmap folder isn't supported.

注意

ランチャー アイコンは使用しないでください。You should not use the launcher icon. このアイコンの解像度は異なっており、通常はサポート対象外の mipmap フォルダー内にあります。It has a different resolution and is usually in the mipmap folders, which we don't support.

実際のアプリでは、 Android の設計ガイドラインに従って、通知に適したアイコンを使用します。For real apps, you can use an icon that is suitable for notifications per Android design guidelines.

ヒント

適切な解像度のアイコンを使用するには、 これらの例を参考にしてください。To be sure to use correct icon resolutions, you can look at these examples. [Notification] セクションまでスクロールして 1 つのアイコンをクリックし、PNGS をクリックして描画可能なアイコンのセットをダウンロードします。Scroll down to the Notification section, click an icon, and then click PNGS to download the icon drawable set. アイコンのバージョンごとに、使用する描画可能なフォルダーと解像度を確認できます。You can see what drawable folders with which resolution to use for each version of the icon.

GCM のプッシュ通知を受信するようにアプリを設定するEnable your app to receive GCM push notifications

  1. Firebase プロジェクト コンソールから取得した Sender ID を置き換えた後、Manifest.xml の <application> タグと </application> タグの間に次を貼り付けます。Paste the following into your Manifest.xml between the <application> and </application> tags after replacing the Sender ID obtained from your Firebase project console. \n は意図的に付けられています。プロジェクト番号の末尾には必ずこれを付けてください。The \n is intentional so make sure that you end the project number with it.

     <meta-data android:name="engagement:gcm:sender" android:value="************\n" />
    
  2. 次のコードを、Manifest.xml の <application> タグと </application> タグの間に貼り付けます。Paste the code below into your Manifest.xml between the <application> and </application> tags. をパッケージ名に置き換えます。Replace the package name .

     <receiver android:name="com.microsoft.azure.engagement.gcm.EngagementGCMEnabler"
     android:exported="false">
         <intent-filter>
             <action android:name="com.microsoft.azure.engagement.intent.action.APPID_GOT" />
         </intent-filter>
     </receiver>
    
     <receiver android:name="com.microsoft.azure.engagement.gcm.EngagementGCMReceiver" android:permission="com.google.android.c2dm.permission.SEND">
         <intent-filter>
             <action android:name="com.google.android.c2dm.intent.REGISTRATION" />
             <action android:name="com.google.android.c2dm.intent.RECEIVE" />
             <category android:name="<Your package name>" />
         </intent-filter>
     </receiver>
    
  3. 強調表示された最新のアクセス権限セットを、 <application> タグの前に追加します。Add the last set of permissions that are highlighted before the <application> tag. <Your package name> をアプリケーションの実際のパッケージ名で置き換えます。Replace <Your package name> by the actual package name of your application.

     <uses-permission android:name="com.google.android.c2dm.permission.RECEIVE" />
     <uses-permission android:name="<Your package name>.permission.C2D_MESSAGE" />
     <permission android:name="<Your package name>.permission.C2D_MESSAGE" android:protectionLevel="signature" />
    

Mobile Engagement に GCM API キーへのアクセス権限を付与するGrant Mobile Engagement access to your GCM API Key

Mobile Engagement にプッシュ通知の送信を許可するには、API キーへのアクセス権限を付与する必要があります。To allow Mobile Engagement to send push notifications on your behalf, you need to grant it access to your API Key. これは、キーを構成して Mobile Engagement ポータルに入力することで実行します。This is done by configuring and entering your key into the Mobile Engagement portal.

  1. Azure クラシック ポータルで、このプロジェクトに使用しているアプリを対象としていることを確認し、下部にある [エンゲージ] ボタンをクリックします。From your Azure Classic Portal, ensure you're in the app we're using for this project, and then click the Engage button at the bottom:

  2. ここで [設定] -> [ネイティブ プッシュ通知] セクションをクリックし、GCM キーを入力します。Then click the Settings -> Native Push section to enter your GCM Key:

  3. 次に示す [GCM 設定] セクションの [API キー]編集アイコンをクリックします。Click the Edit icon in front of API Key in the GCM Settings section as shown below:

  4. ポップアップ画面で、前に取得した GCM サーバー キーを貼り付け、 [OK]をクリックします。In the pop-up, paste the GCM Server Key you obtained before and then click Ok.

アプリへ通知を送信するSend a notification to your app

アプリにプッシュ通知を送信する単純なプッシュ通知キャンペーンを作成します。We will now create a simple push notification campaign that sends a push notification to our app.

  1. Mobile Engagement ポータルで [ リーチ ] タブに移動します。Navigate to the REACH tab in your Mobile Engagement portal.
  2. [新しいお知らせ] をクリックして、プッシュ通知キャンペーンを作成します。Click New announcement to create your push notification campaign.

  3. 次の手順に従って、キャンペーンの最初のフィールドを設定します。Set up the first field of your campaign through the following steps:

    a.この問題では、ターゲット (またはクラス) ラベルは "tip_amount" です。a. キャンペーンの名前を付けます。Name your campaign.

    b.b. [配信タイプ] として [システム通知] > [簡易] を選択します。これは、タイトルと数行のテキストを表示する単純な Android のプッシュ通知です。Select the Delivery type as System notification -> Simple: This is the simple Android push notification type that features a title and a small line of text.

    c.c. [配信時刻][指定なし] を選択し、アプリが起動されているかどうかに関係なく、アプリが通知を受信できるようにします。Select Delivery time as Any time to allow the app to receive a notification whether the app is started or not.

    d.d. 通知テキストに、プッシュ通知内で太字で表示されるタイトルを入力します。In the notification text type the Title which will be in bold in the push.

    e.e. 次に、メッセージを入力します。Then type your Message

  4. スクロール ダウンし、[コンテンツ] セクションで [通知のみ] を選択します。Scroll down, and in the Content section, select Notification only.

  5. 最も基本的なキャンペーンの設定が完了しました。You're done setting the most basic campaign possible. もう一度下にスクロールし、 [作成] ボタンをクリックしてキャンペーンを保存します。Now scroll down again and click the Create button to save your campaign.
  6. 最後の手順として、 [アクティブ化] をクリックしてキャンペーンをアクティブにし、プッシュ通知を送信します。Last step: click Activate to activate your campaign to send push notifications.