5
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

ニフクラ mobile backend を使ったAndroidのサンプルアプリを作ってみる(2)

Last updated at Posted at 2016-02-02

ニフクラ mobile backend (NCMB)のエバンジェリストをやってます小山です。

前回から引き続き、Android のサンプルアプリを作っていきます。

今回は前回作成した「掲示板もどきアプリ」のコードを修正して、次の2つの機能について NCMB を利用するように変更していきます。

  • ユーザ認証
  • 投稿メッセージの保存/読込

ニフクラ mobile backend ダッシュボードでの設定

アプリの作成

まずはNCMB ダッシュボードにログインして、NCMB 側のアプリの作成と設定をしましょう。

画面上部のナビゲーションバーの「+新しいアプリ」をクリックします。
11.ncmb-console.png

「アプリの新規作成」という画面が表示されますので、アプリ名に作りたいアプリ名を入力して「新規作成」ボタンを押します。今回はAndroidのアプリケーション名に合わせて「Ncmboard」にしました。
12.ncmb_newapp.png

アプリが作成されると、「アプリケーションキー」と「クライアントキー」という2つの API キーが表示されます。この2つは Android アプリケーション側から NCMB にアクセスするのに必要なのでメモっておきます。

もしメモを忘れても、ダッシュボードの左端にある「アプリ設定」からいつでも参照できます。

ユーザの登録

今回作成した Ncmboard アプリは、ユーザの新規作成機能は持っていないので、NCMB ダッシュボードでアプリで使用するユーザを登録します。

ダッシュボードの左側の「会員管理」ボタンを選択して表示される上部の「+新しい会員」メニューから「+新しい会員の新規作成」を選択します。
13.newuser.png

ユーザ名とパスワードをクリックして、任意のものを登録します。

アプリの変更

さて、それでは前回作成した Ncmboard アプリの「NCMB化」に入りましょう。

前回にも書きましたが、このサンプルアプリのコードは GitHub で公開されています。

non_ncmbrizedncmbrized の2つのブランチがあって、それぞれ NCMB 対応前、対応後を表しています。今回の記事では対応後である ncmbrized ブランチのコードについて解説していきます。

ソースコードの修正部分は以下の diff で確認できます。

ニフクラ mobile backend Android SDK のインストール

まず NCMB Android SDK である NCMB.jar を取得します。NCMB のクイックスタートのページの中ごろにある「Android SDKダウンロードはこちら」というボタンから、NCMB_latest.zip をダウンロードして下さい。

クイックスタート (Android)

NCMB_latest.zip を展開すると NCMB.jar ファイルが現れますので、それを Android Studio で作成したプロジェクトディレクトリの app/libs にコピーします。

AndroidManifest.xml の編集

アプリケーションにインターネットのアクセスを許可するため、AndroidManifest.xml の <application> タグの直前に以下を追加します。

AndroidManifest.xml
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

ニフクラ mobile backend SDKの初期化

まずは MainActivity クラスの onCreate() メソッドで NCMB の初期化処理を行います。APP_KEY と CLIENT_KEY は、上記で取得したものに置き換えて下さい。

MainActivity#onCreate()
        // initialize NCMB
        String app_key = "APP_KEY";
        String client_key = "CLIENT_KEY";
        NCMB.initialize(this.getApplicationContext(), app_key, client_key);

プロパティの追加・変更

投稿されたメッセージを保存する NCMB オブジェクトのクラス名を messages という定数文字列として定義しておきます。

MainActivity.java
    /** Object class name for messages */
    private static final String NCMB_CLASSNAME_MESSAGES = "messages";

現在のユーザを、ユーザ名という単なる文字列から NCMBUser オブジェクトで持つように変更します。

MainActivity.java
    private String currentUserName = null;

MainActivity.java
    /** Current user object */
    public NCMBUser currentUser = null;

ユーザ認証

入力されたユーザ名とパスワードを、NCMBUser.loginInBackground() メソッドに渡してユーザ認証を行います。メソッド名が xxxInBackground となっているものは非同期処理を行うもので、結果はコールバックに渡されます。ログインの場合は LoginCallback#done() メソッドに対して、

  • ログインに成功した場合は、第1引数に該当する NCMBUser オブジェクト、第2引数は null
  • ログインに失敗した場合は、第1引数は null、第2引数はエラーの内容が含まれる例外オブジェクト

がわたります。成功した場合は、プロパティ変数 currentUser にその結果を保持しておきます。

MainActivity#showLoginDialog()
                             NCMBUser.loginInBackground(username, password, new LoginCallback() {
                                    @Override
                                    public void done(NCMBUser ncmbUser, NCMBException e) {
                                        if (e != null) {
                                            // Login failed
                                            Toast.makeText(MainActivity.this,
                                                    "Invalid username or passwrd",
                                                    Toast.LENGTH_LONG)
                                                    .show();
                                            showLoginDialog();
                                        } else {
                                            // Login successed
                                            currentUser = ncmbUser;
                                        }
                                    }
                                });

メッセージの投稿

ユーザから投稿されたメッセージは、NCMBObject に入れてサーバ側に保存します。NCMBObject は NCMB のデータストアの読み書きをするためのクラスで、任意の「クラス名」を指定することで保存された一連のオブジェクトをグループ化します。今回投稿メッセージに対しては「messages」というクラス名を指定しています。

NCMBObject を作成した後、put() メソッドを用いてメッセージのデータを格納し、saveInBackground() メソッドを用いて保存を実行しています。

データの保存が成功したら、全体を再読込して表示リストを更新します。

MainActivity.java
    NCMBObject messageObj = new NCMBObject(NCMB_CLASSNAME_MESSAGES);
        messageObj.put("userId", currentUser.getObjectId());
        messageObj.put("userName", currentUser.getUserName());
        messageObj.put("message", item.getMessage());

        messageObj.saveInBackground(e -> {
            if (e != null) {
                Toast.makeText(MainActivity.this,
                        "Message post failed",
                        Toast.LENGTH_LONG)
                        .show();
                return;
            }
            // update all messages
            loadMessages();
        });

NCMB のダッシュボードをみると、データストアの中に保存されたメッセージを確認することができます。

14.datastore.png

メッセージデータの読み込み

もし別端末から新しいメッセージが追加されていた場合も、このタイミングで手元に読み込まれて表示されることになります。

今回はとにかく全件読み込んでしまうので、メッセージの数が増えるととんでもないことになりますが(笑)、SDK としては一度の取得件数を制限することももちろん可能です。

MainActivity.java
    protected void loadMessages() {
        NCMBQuery<NCMBObject> query = new NCMBQuery<>(NCMB_CLASSNAME_MESSAGES);
        query.findInBackground((list, e) -> {
            if (e != null) {
                Toast.makeText(MainActivity.this,
                        "Failed loading messages",
                        Toast.LENGTH_LONG)
                        .show();
            } else {
                List<MessageItem> tmpMessages = new ArrayList<>();
                for (NCMBObject obj : list) {
                    MessageItem item = new MessageItem();
                    item.setUserName(obj.getString("userName"));
                    item.setUserId(obj.getString("userId"));
                    item.setMessage(obj.getString("message"));
                    try {
                        item.setTimestamp(obj.getUpdateDate());
                    } catch (NCMBException ncmbException) {
                        ncmbException.printStackTrace();
                    }

                    tmpMessages.add(item);
                }

                // update messages
                messages.clear();
                messages.addAll(tmpMessages);
                messageAdapter.notifyDataSetChanged();
            }
        });
    }

対応はこれだけです。これで NCMB でユーザ認証を行い、投稿したメッセージを NCMB に保存し、保存されたメッセージを NCMB から読み込むことができるアプリに変更できました。

おわりに

いかがでしたでしょうか。mBaaS と言ってもまったく難しいことはなく、既存のアプリの簡単な変更で対応ができることをお分かりいただけましたでしょうか。

NCMB には今回使用した機能の他にも、

  • 大きめのデータ(画像など)を保存するファイルストレージ
  • スマホへのプッシュ通知
  • 位置情報検索

などの機能があります。これらの機能を利用することは、よりスマホらしいアプリを簡単に作ることに役立ってくれるでしょう。

5
6
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?