ニフクラmBaaSお役立ちブログ

スマホアプリ開発にニフクラmBaaS。アプリ開発に役立つ情報をおとどけ!

Monaca × mBaaSで良くある質問にお答えします

私たちのニフティクラウド mobile backendはHTML5/JavaScriptでiOS/Androidアプリが開発できるMonacaと連携しており、開発したアプリに手軽にサーバサイドの機能が実装できるようになっています。手軽とは言え、実装していく中では様々な問題が発生します。それらを解決できるのがGitHub上にあるユーザコミュニティです。

今回はユーザコミュニティの中でもMonaca開発に際して良くあがる質問についてお答えします。

プッシュ通知の実装について

Monacaアプリへのプッシュ通知実装は無料で提供している NiftyMB を組み込めば実現できます。そして以下にsetDeviceTokenでデバイストークンを取得できます。

window.NCMB.monaca.setDeviceToken(
  " #####application_key#####",
  " #####client_key#####",
  " #####sender_id#####" 
);

このメソッドはMonacaアプリからデバイストークンを取得し、mBaaSのInstrationクラスにデバイストークンを保存する処理まで行います。

デバイストークンが取得できない

window.NCMB.monaca.setDeviceTokenを実行した後、window.NCMB.monaca.getInstallationIdを実行するとデバイストークンを保存したオブジェクトのIDが取得できます。ただしwindow.NCMB.monaca.setDeviceTokenは非同期で処理されますので、window.NCMB.monaca.setDeviceTokenを実行直後にwindow.NCMB.monaca.getInstallationIdを実行してもデータは取得できないことがあります。そのため、

var ncmbTimer = setInterval(function() {
  window.NCMB.monaca.getInstallationId(function(id) {
    if (id) {
      clearInterval(ncmbTimer);
      // ここに処理を記述
    }
  });
}, 5000);

のようにして繰り返し実行するのが良いでしょう。

Monacaアプリで撮影した写真をmBaaSに保存する

Monacaが提供しているネイティブのカメラ機能を使って写真を撮影し、そのデータを保存する場合はBase64で取得されるデータをBlobに変換してあげる必要があります。

function toBlob(base64) {
  var bin = atob(base64.replace(/^.*,/, ''));
  var buffer = new Uint8Array(bin.length);
  for (var i = 0; i < bin.length; i++) {
    buffer[i] = bin.charCodeAt(i);
  }
  // Blobを作成
  try{
    var blob = new Blob([buffer.buffer], {
      type: 'image/png'
    });
  }catch (e){
    return false;
  }
  return blob;
}

// 写真撮影処理
function snapPicture () {
  navigator.camera.getPicture (onSuccess, onFail,
    { quality: 50, destinationType: Camera.DestinationType.DATA_URL}
  );

// 写真撮影が成功した時に呼ばれるコールバック
function onSuccess (imageData) {
  NCMB.initialize("apkey", "clientkey");
  var byteCharacters = toBlob(imageData);
  var NCMBFile = new NCMB.File("name", byteCharacters, "image/png");
  NCMBFile.save().then(function() {
    // ファイルの保存が成功
    alert("saved");
  },
  function(error) {
    // ファイルの保存が失敗
    alert(error);
  });
}

// 写真撮影が失敗した時に呼ばれるコールバック
function onFail (message) {
  alert ('エラーです: ' + message);
}

プッシュ通知でobjectIdが取得できないAndroid端末がある

window.NCMB.monaca.setDeviceTokenが失敗する原因としては、

  • registrationIdの取得に失敗している
  • installaionの登録に失敗している

のいずれかが考えられます。その際の調査方法としては、

  • 登録先のmobile backendのアプリを新しいものにしてみる
  • 端末のGoogleアカウント設定を確認してみる
  • Monacaの新しいアプリで試してみる

などを行う必要があります。


質問の多くはプッシュ通知周りになるようです。アプリのサイズが大きくなり、コード量が増えていくとデバッグもしづらくなっていきます。プッシュ通知はmBaaSを使ってなるべく早い段階で実装してしまうのがお勧めです。

ユーザコミュニティではこの他、iOSAndroidなど多くの質問を扱っています。ぜひmBaaSを使っていて不明点、疑問点が出たら質問を寄せてください!

NIFTYCloud-mbaas/UserCommunity