mBaaSはスマートフォンアプリを作るのに最適です。そしてスマートフォンアプリは個人が楽しむゲームやチャットなどだけでなく、業務用途でも広がりを見せています。そこでmBaaSも業務システムを作るために使ってみましょう。
今回から何回かに分けて、日報システムを作ってみます。他の業務システムへも応用はさほど難しくないでしょう。
今回のゴール
今回はログイン画面を作ります。業務システムなので、不特定多数がユーザを作れるのはよくありません。そのため、管理者グループを作り、そのグループに所属する人たちがユーザを作成できる形にします。
管理ユーザは管理画面で
管理ユーザ自体はmBaaSの管理画面で作成します。 admin というグループを作成し、その中に所属する形にします。
また、日報システムを使うユーザは何らかの部署に所属する形にしますので、 必要に応じて部署をロールとして作成します。今回はSalesとTechを作っています。
ユーザ作成時の処理
ユーザの作成処理はメールアドレスを入力する欄を作って、そこで登録します。注意点として、そのユーザに対して管理者グループの読み取り、書き込み権限を付けておきましょう。この処理はスマートフォンで行うのは面倒だと思います。そこで Electron を使ってWeb技術を使いながらもデスクトップアプリのように動くようにします。
管理者のログイン処理
管理者のログイン画面です。ユーザIDとパスワードを使ってログインします。一度ログインすればセッションによってしばらくログイン状態になります。
ユーザ作成処理
ユーザの作成処理は管理者によって入力されたメールアドレスを使って行います。その際、部署を選択できるようにします。この部署は新しいグループとして定義されます。既存の部署に所属させる場合にはドロップダウンから選択します。
この選択した部署は UserRole というクラスにメールアドレスとセットで残しておきます。このデータを初回ログイン時にチェックして、ユーザデータと所属するロールを関連づけます。
const UserRole = ncmb.DataStore('UserRole'); const userRole = new UserRole; userRole .set('role', app.role) .set('email', app.email) .save() .then((data) => { ncmb.User .requestSignUpEmail(app.email) }) .then((d) => { app.email = ''; })
メールは業務担当者のところに送られ、その後のパスワード登録までは個人個人で行います。
パスワード登録が終わったらログイン処理になります。
初回のログイン処理
ログインしたら、まずフラグをチェックします（ updated フラグ）。このフラグは何らかの部署に所属しているかどうかのチェックです。このフラグがなかったら、はじめてのログインになりますので、部署に所属させます。また、ユーザ情報は他の利用者からも閲覧したいと思いますので、全体に対して読み取り権限をつけておきます。
ncmb.User .loginWithMailAddress(app.user.email, app.user.password) .then((userData) => { app.loggedIn = true; // すでに更新されている場合は以下の処理はスキップ if (userData.updated) return; // UserRoleクラスからデータを検索します return getUserRole(app.user.email); }) .then((userRole) => { if (!userRole) return; app.roleName = userRole.role; // ユーザデータの権限を設定します const user = ncmb.User.getCurrentUser(); const acl = new ncmb.Acl; acl .setRoleReadAccess('admin', true) .setRoleWriteAccess('admin', true) .setRoleReadAccess(userRole.role, true) .setUserReadAccess(user, true) .setUserWriteAccess(user, true); // ロールデータとユーザはこの後も使うので、 // スコープを合わせるためにPromise.allを使います const promises = []; promises.push(user .set('acl', acl) .set('authData', {}) .set('updated', true) .update()); promises.push(ncmb.Role .equalTo('roleName', userRole.role) .fetch() ); return Promise.all(promises); }) .then((results) => { if (!results) return; // ユーザをあらかじめ指定していたグループに所属させます let user, role; // 非同期処理は結果の順番が保証されないので以下のように判定します if (results[0] instanceof ncmb.User) { user = results[0]; role = results[1]; } else { user = results[1]; role = results[0]; } return role.addUser(user).update(); })
これで部署の権限下で動作するようになります。
このような手順を踏むことで業務システムに合ったログインフローが実現できます。
ここまでのコードはNCMBMania/dailyReport: mBaaSを使った日報システムです。にアップロードされています。管理用アプリはElectron、クライアントアプリはMonaca + Vue.jsで作成しています。実装時の参考にしてください。
