読者です 読者をやめる 読者になる 読者になる

アプリカンブログ

HTML5でiOS/Androidアプリが開発できるプラットフォーム、アプリカンのブログです。

アプリカンでプッシュ通知を受け取る(Android編)

アプリマーケティングにおいて大事な要素になるプッシュ通知。アプリカンで作成したアプリでももちろん使うことができます。サイト上ではpopinfoを紹介していますが、AWSや独自の開発、アピアリーズニフティクラウド mobile backendなどのmBaaSサービスを使ったプッシュ通知も可能です。

そこで今回はAndroidでのプッシュ送信方法について紹介します。なおGoogleのアカウントは既にお持ちであることを前提としています。

アプリカンでの設定

プッシュ通知はアプリカンシミュレータでは確認できません。そのためアプリ設定に加えてビルド設定も行います。プロジェクトのビルド設定にあるAndroidアプリ設定を開きます。

Androidアプリ設定

アプリ設定

パッケージ名の更新は一度しかできませんので間違えないように入力してください。

続いてパーミッション設定を開きます。PUSHをクリックするとGCM(Google Cloud Messaging)が有効になります。

PUSHをチェックする

最後に追加オプション設定を開き、PUSH通知機能を使用する設定にしてください。

プッシュ通知を有効に

なお、GCM Sender IDはGoogle Developer ConsoleのプロジェクトOverviewにあるProject Numberになります。

GCM Sender IDの確認

Androidキーストア設定

次にAndroidキーストア設定を行います。キーストアファイルは以下のコマンドで生成できます。

$ keytool -genkey -keyalg RSA -keystore Applican.keystore -alias keyalias -validity 10000
キーストアのパスワードを入力してください:  
新規パスワードを再入力してください: 
姓名を入力してください。
  [Unknown]:  Atsushi Nakatsugawa
組織単位名を入力してください。
  [Unknown]:  Company
組織名を入力してください。
  [Unknown]:  MOONGIFT
都市名または地域名を入力してください。
  [Unknown]:  Yokohama
都道府県名を入力してください。
  [Unknown]:  Kanagawa
この単位に該当する2文字の国コードを入力してください。
  [Unknown]:  JP
CN=Atsushi Nakatsugawa, OU=Company, O=MOONGIFT, L=Yokohama, ST=Kanagawa, C=JPでよろしいですか。
  [いいえ]:  Y

<keyalias>の鍵パスワードを入力してください
    (キーストアのパスワードと同じ場合はRETURNを押してください):  
新規パスワードを再入力してください: 

上記例の場合、Applican.keystoreというファイルが生成されますのでアップロードしてください。エイリアス名は上記例の場合、keyaliasになります。

Androidキーストア設定

アプリのコード

今回はプッシュ通知の確認になりますので以下のようなHTMLになりました。

<!DOCTYPE HTML>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1, initial-scale=1.0, user-scalable=no">
    <title>Sample</title>
    <script type="text/javascript" charset="utf-8" src="js/applican.js"></script>
  </head>
  <body>
    <script>
      document.addEventListener("deviceready", onDeviceReady, false);
      function getPushTokenSuccess(res){
        alert(res);
        var token = res.pushToken;
        prompt("トークンはこちらです", token);
      }
      function getPushTokenError(err) {
        alert(err);
      }
      function onDeviceReady(){
        applican.device.getPushToken(getPushTokenSuccess, getPushTokenError);
      }
    </script>
  </body>
</html>

applican.device.getPushToken にてプッシュ通知に使うレジストレーションIDが得られます。取得できた時のコールバックは getPushTokenSuccess になります。本来、こういったトークンはサーバサイドに保存するのですが、今回は用意していませんのでJavaScriptのプロンプトに表示してコピーすることにします。

アプリのビルド

HTMLコードを上記のものとしてアプリカンの管理画面でアップロードし、ビルドを行います。

ビルド中

ビルドが終わるとビルド履歴に表示されます。

ビルド完了

ビルドが終わったら Androidデバイスからアプリカンにログインし、アプリをインストールします。

Androidで実行

Androidアプリをインストールする際にはプッシュ通知を扱うパーミッション確認が出ます。

アプリを起動するとレジストレーションIDが取得できて、その結果がプロンプトに表示されます。この文字をコピーしてメールやメモなどのアプリを通じて母艦で送ります。

トークン

これで準備は完了です。

プッシュ通知を飛ばしてみる

プッシュ通知を飛ばす方法は幾つかありますが、今回はローカルから送信してみます。使うのは GCM) というRubyライブラリです。インストールは gem install gcm でできます。

下準備として、Credentialの作成を行います。Google Developer Consoleにアクセスして、APIs & authのCredentialを開きます。そしてPublic API accessのCreate new Keyをクリックします。

Public APIを生成する

出てきたウィンドウでServer keyをクリックします。

新しいキーの確認

少し待つとキーが生成されます。これをコピーします。

生成されたキー

簡単なスクリプトを記述します。ファイル名をpush.rbとします。

require 'gcm'
gcm = GCM.new("API_KEY")
registration_ids = [ 'レジストレーションID' ]
option = { :data => {message: 'こんにちはアプリカン', uri: 'local://index.html?test=test'} }
response = gcm.send_notification(registration_ids, option)
puts response
if response[:body]
  puts JSON.parse(response[:body])
end

API_KEY、レジストレーションIDはそれぞれ既に取得されているものに置き換えてください。スクリプトを実行します。

$ ruby push.rb

この処理の場合外部サービスを経由せずに直接GCMに接続しているのですぐに通知が確認できます。

プッシュ通知を受信

ここで大事なのは uri: 'local://index.html?test=test' というペイロードです。uriというキーで local://index.html?hogehoge といった形でプッシュ通知を送るとアプリカンアプリ側でこの内容を受け取れるようになります。例えば、deviceReadyを次のように変更します。

function onDeviceReady(){
  alert(location.search);
  applican.device.getPushToken(getPushTokenSuccess, getPushTokenError);
}

このようにしてプッシュ通知を開くとダイアログが次のように表示されます。

プッシュ通知で処理分けする

この文字列は好きなように送れますのでユーザIDをつけたり、イベント名や開く画面を指定すると言ったような使い方もできます。単純にアプリを開くだけでなく、様々な使い方が考えられるでしょう。


いかがでしょうか。アプリカンでのプッシュ通知は管理画面の設定とアプリ側でのトークンの取得だけで簡単にできます。もちろん本格運用する際にはサーバサイドの仕組みが必要になるでしょう。ぜひアプリマーケティングにお役立てください。

アプリカン | アプリ開発支援プラットフォーム