FJCT_ニフクラ mobile backend(mBaaS)お役立ちブログ

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

RPGツクールMZからNCMBを呼び出す

f:id:mbaasdevrel:20210513211859p:plain

RPGツクールは昔からあるRPGを作成するためのプラットフォームです。MVからHTML5に対応し、Webアプリケーションとしてリリースできるようになりました。RPGツクール最新作であるMZでもそれは変わりません。

今回はそんなRPGツクールMZを使って、NCMBにデータを保存するプラグインを作ってみます。ごく基本的なやり方なので、クラウドとRPGツクールを組み合わせる際の参考にしてください。

ファイル構成

RPGツクールの js/plugins ディレクトリの中にJavaScript SDKとプラグインファイル(今回はmBaaS.jsとしています)を保存します。

f:id:mbaasdevrel:20210513211543p:plain

mBaaS.jsの内容

まずプラグインの説明などを記述します。 @param はプラグイン設定時に利用する変数になります。ここではNCMBを初期化するアプリケーションキーとクライアントキーを指定しています。

//=============================================================================
// RPG Maker MZ - Save Data to mBaaS
//=============================================================================
/*:ja
 * @target MZ
 * @plugindesc ボタンをクリックするとNCMBにデータ保存するプラグイン
 * @author Atsushi Nakatsugawa
 *
 * @param applicationKey
 * @desc NCMBのアプリケーションキー
 * @default *******************
 *
 * @param clientKey
 * @desc NCMBのクライアントキー
 * @default *******************
 *

設定の続きです。次にプラグインコマンドとして呼び出す機能を設定します。今回は save コマンドでメッセージを保存します。

 * @help mBaaS.js
 * このプラグインは、ボタンをクリックするとNCMBにデータ保存するプラグインです
 * @command save
 * @desc データを保存します
 *
 * @arg message
 * @text 保存するメッセージ
 * @desc 保存するメッセージを指定します
 * @type variable
 * @default Hello
*/

プラグインはRPGツクールのプラグイン管理で読み込みます。

f:id:mbaasdevrel:20210513211620p:plain

読み込み時に先ほど設定した変数を設定できます。

f:id:mbaasdevrel:20210513211648p:plain

スクリプトについて

初期化

まずスクリプト全体を (() => {})() で囲みます。これはJavaScriptの変数スコープを制限することで、他の機能へ悪影響を及ぼさないためです。

(() => {
  // この中に記述します
})();

プラグイン初期化時のパラメータを受け取る

プラグイン初期化時に設定したアプリケーションキーとクライアントキーを受け取るには PluginManager.parameters を使います。

const pluginName = 'mBaaS';
onst params = PluginManager.parameters(pluginName);

そして、動的にJavaScript SDKを読み込みます。JavaScriptを読み込み完了すると onload が呼ばれますので、このタイミングでNCMBを初期化します。今回は匿名認証を使って認証も行っています。

let ncmb;
const js = document.createElement('script');
js.type = 'text/javascript';
js.src = './js/plugins/ncmb.min.js';
document.querySelector('head').appendChild(js);
js.onload = () => {
  ncmb = new NCMB(params.applicationKey, params.clientKey);
  ncmb.User.loginAsAnonymous();
}

プラグインコマンドの設定

プラグインコマンドは PluginManager.registerCommand で設定します。

PluginManager.registerCommand(pluginName, 'save', async (args) => {
  // この中に記述します
});

データを保存する

プラグインコマンドで送られてくるデータは args で受け取れます。今回はそのメッセージをデータストアに保存しています。

const user = ncmb.User.getCurrentUser();
const Data = ncmb.DataStore('Data');
const data = new Data;
const acl = new ncmb.Acl;
acl
  .setUserReadAccess(user, true)
  .setUserWriteAccess(user, true);
await data
  .set('message', args.message)
  .set('acl', acl)
  .save();

保存したデータをゲームに反映する際には $gameVariables.setValue を使って変数を書き込むと良いでしょう。下記は変数10へのセットになります。

$gameVariables.setValue(10, data.objectId);

なお、mBaaSの処理は非同期であるために、メッセージ表示などを行っても処理完了前に実行されてしまいます。メッセージを表示する際などは、JavaScriptから実行すると良いでしょう。

$gameMessage.add(`保存したオブジェクトIDは${data.objectId}です`);

プラグインコマンドは適当なイベント処理時に呼び出します。

f:id:mbaasdevrel:20210513211718p:plain

そして save コマンドを指定して、変数も設定します。

f:id:mbaasdevrel:20210513211750p:plain

これで好きなタイミングでmBaaSにデータ保存できるようになります。

まとめ

RPGツクールは多機能で、コーディングせずにRPGが作成できます。さらにプラグインを使うことで、標準では提供されない機能を補完できます。クラウドにデータを保存したり、画像などをアップロードする、認証機能を使いたい際にはぜひNCMBと組み合わせてみてください。

RPGツクールMZ

中津川 篤司

中津川 篤司

NCMBエヴァンジェリスト。プログラマ、エンジニアとしていくつかの企業で働き、28歳のときに独立。 2004年、まだ情報が少なかったオープンソースソフトの技術ブログ「MOONGIFT」を開設し、毎日情報を発信している。2013年に法人化、ビジネスとエンジニアを結ぶDXエージェンシー「DevRel」活動をスタート。