イントロダクション（Application Development Framework）

クイックスタート

クイックスタートについて

このページでは、MobileSUITE mBaaS機能をCordovaアプリと連携させる手順を紹介します。

アプリの新規作成

  • mBaaS管理画面を開きます。
  • mBaaS管理画面が表示されたら、「アプリの新規作成」を行います。
    • すでに別のアプリを作成済みの場合は、ヘッダーの「＋新しいアプリ」をクリックします。

新規アプリケーション作成

  • 「アプリ名」を入力し「新規作成」をクリックすると、APIキー（アプリケーションキーとクライアントキー）が発行されます。

APIキー発行

  • APIキーは後ほど初期化コードで使います。

Cordovaアプリの作成

  • cordova createコマンドを使用して、新しいCordovaプロジェクトを作成します。
## sample code
> cordova create hello com.fujitsu.ms.hello HelloWorld

SDKの取得方法

  • SDKは、ダウンロードサイトから取得してください。

SDKの読み込み

  • Cordovaプロジェクトのwwwディレクトリのindex.htmlに以下のコードを書き込んでください。以下はwww/js配下に置いた場合の例です。
<body>
    <div class="app">
        <h1>Apache Cordova</h1>
        <div id="deviceready" class="blink">
            <p class="event listening">Connecting to Device</p>
            <p class="event received">Device is Ready</p>
        </div>
    </div>
      <!-- SDKの読み込み -->
    <script type="text/javascript" src="js/ncmb.min.js"></script>
    <script type="text/javascript" src="cordova.js"></script>
</body>

APIキーの設定とSDKの初期化

  • jsディレクトリの中にあるindex.jsに以下のコードを記述します。
onDeviceReady: function() {
    this.receivedEvent('deviceready');
    // SDKの初期化
    var ncmb = new NCMB("YOUR_APPLICATION_KEY","YOUR_CLIENT_KEY");
},
APIキーの確認と設定
  • 上の「YOUR_APPLICATION_KEY」と「YOUR_CLIENT_KEY」は、mBaaS管理画面で「アプリの新規作成」を行ったときに発行されたAPIキーに置き換えます。
    • アプリ作成時のAPIキー発行画面を閉じてしまった場合は、「アプリ設定」＞「基本」で確認できます。
    • 「コピー」ボタンを使用してコピーしてください。

APIキー確認

  • これで連携作業は完了です！
  • サンプルコードを書いて実際にMobileSUITE mBaaS機能を使ってみましょう。

サンプルコードの実装

サンプルコード（データストア）
  • APIキーの設定とSDK初期化コードの下にサンプルコードを書くと、すぐに動作確認が可能です。
    onDeviceReady: function() {
        this.receivedEvent('deviceready');
        // SDKの初期化
        var ncmb = new NCMB("YOUR_APPLICATION_KEY","YOUR_CLIENT_KEY");
        // ↓　ここにサンプルコードを実装　↓
    },
  • 次のコードはMobileSUITE mBaaS機能のデータストアに保存先の「TestClass」というクラスを作成し、「message」というフィールドへ「Hello, NCMB!」というメッセージ（文字列）を保存するものです。
    onDeviceReady: function() {
        this.receivedEvent('deviceready');
        // SDKの初期化
        var ncmb = new NCMB("YOUR_APPLICATIONKEY","YOUR_CLIENTKEY");
        // クラスのTestClassを作成
        var TestClass = ncmb.DataStore("TestClass");

        // データストアへの登録
        var testClass = new TestClass();
        testClass.set("message", "Hello, NCMB!");
        testClass.save()
                .then(function(){
                    // 保存に成功した場合の処理
                  })
                .catch(function(err){
                    // 保存に失敗した場合の処理
                  });
    },
Cordovaアプリを起動してmBaaS管理画面から確認する
  • Cordovaアプリが起動したら、mBaaS管理画面で「データストア」から、データが保存されていることを確認できます。

DBサンプル結果

レスポンスの検証設定

JavaScript SDK の v2.2.0 から、 mBaaS機能からの通信が
改ざんされていないかを確認するために
レスポンスヘッダーのシグネチャを検証する機能が実装されました。

データやファイルの保存・取得時に、検証を行うか設定することができます。
デフォルトでは無効化されていますので、必要な時に有効化・無効化を切り替えてください。
以下のように enableResponseValidation に true を設定することで、
レスポンスの検証が有効になります。

ncmb.enableResponseValidation(true);

2つのシグネチャが一致しない場合は E100001 エラーを返却するようになっていますが、
一部のエラーが発生した場合はレスポンスヘッダーにシグネチャが存在しないため、
E100001 が必ず返却されてしまうことになります。
詳しくはREST APIリファレンスをご覧ください。
　

注意

サイズが大きいファイルのダウンロード時にレスポンスの検証を実施すると、
端末のメモリ容量が不足してしまい、アプリの動作が不安定になります。
そのため、ダウンロード実行前にenableResponseValidationをfalseに設定して、
一時的にレスポンスの検証を無効化してください。
　

プッシュ通知機能について

JavaScript SDKにはプッシュ通知を受信する機能は実装されておりません。
プッシュ通知受信用プラグインを利用すると、 Application Development Frameworkで開発したハイブリッドアプリでプッシュ通知の受信が可能になります。

プッシュ通知受信用プラグインはダウンロードサイトから取得し、使用方法は、「Application Development Framework アプリケーション開発ガイド」を参照してください。