mBaaS - otak-lab

【Monaca】Onsen UI + JavaScriptで買い物リストを作るその4

今回は、localStorageからニフクラ mobile backendのデータストアにデータを保存するように改造します。

mbaas.nifcloud.com

ニフクラ mobile backend

https://mbaas.nifcloud.com

スマホアプリ開発に必要な機能をクラウド上で提供するので、面倒なサーバー開発が一切不要。アプリ開発をよりスマートにスピーディに。

ncmb.min.jsというファイルが必要ですので、githubからダウンロードしてください。

GitHub

GitHub - NIFCLOUD-mbaas/ncmb_js: ニフクラ mobile backend JavaScript SDK

https://github.com/NIFCloud-mbaas/ncmb_js

ニフクラ mobile backend JavaScript SDK . Contribute to NIFCLOUD-mbaas/ncmb_js development by creating an account on GitHub.

【Monaca】ncmb-push-monaca-plugin v2.0.0 ご利用の方は今すぐアップデートを！

4月下旬ころに「ギャンブル収支管理」のユーザーからメールが届いた。
Playストアからダウンロードすると、「エラーコード-505」が発生するとのこと。
メールにてAndroid端末の設定や初期化などお願いしたが、解決できなない状況が続いた。
そして、Net Dreamers様の提供アプリ「netkeiba.com-無料で使える人気競馬アプリ」をインストール後に「ギャンブル収支管理」をインストールすると、「プロバイダの認証が重複しています」や「エラーコード-505」というエラーにより、インストールまたはアップデートできなくなる現象が発生することがわかった。

二つのアプリに共通する箇所について調査したところ、プッシュ通知ではないかと判断し、ncmb-push-monaca-pluginのリリースを調べてみたところ、v2.0.0の不具合による現象と判明した。

v2.0.1
変更点
Cordova 5.2環境でGoogle Play Service 8.3を利用している場合に、applicationIdが指定されていないことにより
Google Play Service 8.3を含むアプリケーションを複数インストールすることができなくなってしまうため、
プラグイン内部で使用するGoogle Play Serviceのバージョンを8.1にダウングレードしました。

現在、v2.0.2なのでv2.0.0を利用してアプリを開発した方は、早急なアップデートを行った方がよい。

Android mBaaS Monaca NIFTY ギャンブル収支管理プラグイン

【Monaca】Nifty mBaaS データストアの検索条件に日付を指定する

Nifty mBaaSのデータストアで利用可能なデータ型は、データストア（Monaca）:基本的な使い方に記載されているとおり。

データストアで利用可能なデータ型

データストアでは、以下の値が利用可能です。

種類サンプル

文字列 ABC

配列 [“orange”, “apple”, “grape”]

数字 123

日付 2013-09-06T01:51:03.606Z

真偽値 true または false

オブジェクト {“name”:”orange”}

緯度経度（位置情報） 33.857619,122.378986

種類	サンプル
文字列	ABC
配列	[“orange”, “apple”, “grape”]
数字	123
日付	2013-09-06T01:51:03.606Z
真偽値	true または false
オブジェクト	{“name”:”orange”}
緯度経度（位置情報）	33.857619,122.378986

検索条件「登録日時：createDateが一致」に日付を指定する場合、equalTo(“createDate”, “2016-06-14T12:00:00.000Z”)と日付型に従ってデータを設定しても何も返ってこない。

ドキュメントを隅から隅まで読みまくる。
・・・これか！！！
下記のようにデータを設定する必要がある。わかりにくいな。
※REST API リファレンス 5.1 日付を参照。

    { "__type": "Date", "iso": "2016-06-14T12:00:00.000Z" }

1	{ "__type": "Date", "iso": "2016-06-14T12:00:00.000Z" }

    var GameScore = ncmb.DataStore("GameScore");
    GameScore.equalTo("createDate", { "__type": "Date", "iso": "2016-06-14T12:00:00.000Z" })
        .order("score",true)
        .fetchAll()
        .then(function(results) {
            console.log("Successfully retrieved " + results.length + " scores.");
            for (var i = 0; i &lt; results.length; i++) {
                var object = results[i];
                console.log(object.score + " - " + object.get("playerName"));
            }
        }).catch(function(err) {
            console.log(err);
        });

1

2

3

4

5

6

7

8

9

10

11

12

13

var GameScore = ncmb.DataStore("GameScore");

GameScore.equalTo("createDate", { "__type": "Date", "iso": "2016-06-14T12:00:00.000Z" })

.order("score",true)

.fetchAll()

.then(function(results) {

console.log("Successfully retrieved " + results.length + " scores.");

for (var i = 0; i < results.length; i++) {

var object = results[i];

console.log(object.score + " - " + object.get("playerName"));

}

}).catch(function(err) {

console.log(err);

});

mBaaS Monaca NIFTY データストア

【Monaca】Nifty mBaaSのプッシュ通知を実装する

Onsen UI + AngularJS
Cordovaプラグイン：ncmb-push-monaca-plugin v2.0.1（※バージョン要注意）

Niftyのサンプルでは、document.addEventListener(“deviceready”, …..となっているが、ons.ready()はイベントの最後に実行されるので、その中にプッシュ通知の処理を記述しても問題ない。
プッシュ通知によって受け取ったJSONデータをons.notification.alert()を使ってダイアログ表示する。
JSONデータはダイアログ表示に必要な形式で作成し、新しいプッシュ通知画面のJSONの項目に設定して送信する。

type: 将来に使用
title: ダイアログのタイトル
message: ダイアログのメッセージ(HTML形式)
button1: ダイアログのボタン
button2: 将来に使用
button3: 将来に使用

JSONデータ

{"type":"1","title":"Monacaで作ったアプリ","message":"今日も暑いですね。<br>水分を補給しましょう。","button1":"OK"}

1	{"type":"1","title":"Monacaで作ったアプリ","message":"今日も暑いですね。<br>水分を補給しましょう。","button1":"OK"}

ons.ready(function() {
    var appKey    = "アプリケーションキー";
    var clientKey = "クライアントキー";
    var senderId  = "12桁のプロジェクト番号";
    window.NCMB.monaca.setHandler(showPushNotification);
    function showPushNotification(jsonData) {
        // JSON.parse()は不要
        var data = angular.copy(jsonData);
        data.func = function(){};
        // プッシュ通知ダイアログ表示
        ons.notification.alert({
            messageHTML:    data.message,
            title:          data.title,
            buttonLabel:    data.button1,
            animation:      "default",
            callback:       data.func
        });
    }
    window.NCMB.monaca.setDeviceToken(appKey, clientKey, senderId);
    window.NCMB.monaca.setReceiptStatus(true);
    // ID取得
    var installationId = "";
    var count = 0;
    var result = setInterval(function() {
        window.NCMB.monaca.getInstallationId(function(id) {
            if (id) {
                clearInterval(result);
                installationId = id;
            }
        });
        count++;
        if (count > 9) {
            clearInterval(result);
        }
    }, 5000);
}

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

ons.ready(function() {

var appKey = "アプリケーションキー";

var clientKey = "クライアントキー";

var senderId = "12桁のプロジェクト番号";

window.NCMB.monaca.setHandler(showPushNotification);

function showPushNotification(jsonData) {

// JSON.parse()は不要

var data = angular.copy(jsonData);

data.func = function(){};

// プッシュ通知ダイアログ表示

ons.notification.alert({

messageHTML: data.message,

title: data.title,

buttonLabel: data.button1,

animation: "default",

callback: data.func

});

}

window.NCMB.monaca.setDeviceToken(appKey, clientKey, senderId);

window.NCMB.monaca.setReceiptStatus(true);

// ID取得

var installationId = "";

var count = 0;

var result = setInterval(function() {

window.NCMB.monaca.getInstallationId(function(id) {

if (id) {

clearInterval(result);

installationId = id;

}

});

count++;

if (count > 9) {

clearInterval(result);

}

}, 5000);

}

JSON mBaaS Monaca NIFTY プッシュ通知

2024年4月
月	火	水	木	金	土	日
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30

タグ: mBaaS

データストアで利用可能なデータ型