初めまして!新入社員の平出です!
皆さん、Monacaアプリ開発してますか!?アプリを作ってみたは良いけど、ログイン機能はサーバー連携が必要で、実装するのが面倒くさいなあと思っていないでしょうか?そうした、メンドクサさを省いてくれるサービスがあるんです!それがニフティクラウドmobile backendというクラウドサービスです。今回はニフティクラウドmobile backendを使ってAndroidアプリへログイン機能を組み込むサンプルアプリを作りました。こちらを用いて、チュートリアル形式でログイン機能の組み込みが体験できます!ぜひ、試してみてください!
ニフティクラウドmobile backendとは?
ニフティクラウドmobile backendとは、mBaaS(mobile backend as a Service)と呼ばれるクラウドサービスで、スマートフォンアプリでよく利用される汎用的な機能をクラウドから提供するサービスです。
クラウド上に用意された機能をAPIで呼び出すだけで利用できるので、サーバー開発・運用不要でよりリッチなバックエンド機能をアプリに実装することができます。 ここからはニフティクラウドmobile backendではなくmBaaSと呼ばせていただきます。JavaScript SDKも用意しており、Monacaからも簡単に利用できます。
今回の概要
今回は、Monacaを用いて作ったアプリとmobile backendを連携して、ログイン機能を実装するサンプルプロジェクトの紹介となります。
作業の流れとしては以下のたった四つだけです!
- 開発環境の準備
- サンプルプロジェクトをインポート
- アプリケーションキーとクライアントキーを設定して初期化
- 動作確認
これから、この四つの流れを細かく見てきましょう!
1.開発環境の準備
今回準備して頂きたい環境は以下の二つとなります。
これら二つの利用登録をお願いします。
2.サンプルプロジェクトをインポート
準備が済んだら、Monacaでプロジェクトのインポートを選択し、新規プロジェクトを作成します。
その後、「URLからインポートする」を選択し、URLにhttps://github.com/ncmbadmin/sample_monaca_login_template/archive/master.zipを指定します。
3.アプリケーションキーとクライアントキーを設定して初期化
インポートが終了したら、app.jsファイルを開きます(www>js>app.js)。そして、下図の赤い四角で囲んだ部分に各キーを設定して初期化を行います。
各キーの取得は新しいアプリを作成することで可能です。また、アプリ設定から確認することもできます。
4.動作確認
以上で全ての作業が終了しました。後は、実際にデモを動かしてサーバーにログイン情報が登録されているかの確認を行いましょう。
まずは、Monaca側で新規登録を行います。
登録が成功したらダイアログが表示されます。サーバー側で実際にデータが格納されているか確認しましょう。
会員管理画面で上図のように表示されていたら、成功です!
Monacaアプリにプッシュ通知も実装できるmBaaS
今回はMonacaアプリでログイン機能の実装を行いました! これ以外にも、プッシュ通知を組み込むこともできます。
その参考となるドキュメントもございますのでそちらもぜひご活用ください!