kintoneと連携したモバイルアプリをUnifinityで作成する方法について、ご紹介いたします。
連携にあたっては、kintoneにて用意されているREST APIという仕組みを利用します。
今回は、kintoneのREST APIを利用するにあたって必要なユーザー認証(パスワード認証)の方法をご紹介します。
解説で使用しているサンプルプロジェクトを以下よりダウンロードすることができます。ぜひご活用ください。
作成するアプリの概要
・ kintoneのREST APIを利用するにあたって必要な情報をユーザーに入力させ、
・ その情報をユーザー認証のための形式に変換するとともに、
・ ユーザーに何度も入力させないようこれらの情報をDB(データベース)に格納する
アプリを作成します。
kintoneの設定
スタンダードコースをご契約いただいていれば、kintone側の設定は不要です。
kintoneで用意しているユーザー認証の仕組みの詳細は以下をご参照ください。
https://cybozu.dev/ja/kintone/docs/rest-api/overview/authentication/#step7
Unifinityの連携設定
1. 画面作成
まずはkintoneのユーザー認証を行うために必要な項目を入力する画面を作成します。
※ 基本的なUnifinityの操作は、こちらのチュートリアル動画をご覧ください。
① kintoneのログイン名・パスワードを入力するテキストボックスを画面に配置します。
今回は、各テキストボックスに関して、ユーザーへのガイドのためプレースホルダーを設定しています。
また、パスワードを入力させるテキストボックスについては、オブジェクトの動作設定タブの中にあるパスワードにチェックをいれると、入力されたパスワードが非表示になります。
② 入力された情報を、ユーザー認証の形式に変換するためのボタンを設置します。
今回は、ユーザーへのガイドのため、ボタンにログインと表示させています。
画面作成は、一旦、これで完了です(3.の処理作成後、更新する箇所があります)。
2. DB作成
入力されたログイン名・パスワード及びユーザー認証の情報を記憶させるため、Unifinity内のDBを作成します。
① ログイン名・パスワード記憶用DBを作成します。
データファイルを作成後、項目名・物理項目名に分かりやすい名称を入力してください。
② ユーザー認証情報記憶用DBを作成します。
こちらも①と同様です。1項目のみの作成で結構です。
DB作成は、これで完了です。
3. 処理作成
画面で作成したボタンを押下した際の動作を作成します。
それぞれの項目ごとに、一つ一つの処理を解説していきます。
① 入力されたログイン名・パスワードを、DBに記憶させる。
#2,#3 | 「コントロール/内容取得」を使って、DBに記憶する内容を選択します。 今回は、1. で作成した「ユーザー認証」画面の「ログイン名」「パスワード」を入力する項目を選択します。 |
#4 | 「データベース/削除」を使い、これまで記憶されていたデータをクリアします。(この処理を行わないと、入力されたログイン名・パスワードが累積されていきます) |
#5 | 「データベース/追加」を使い、2.①で作成したDBの該当項目に、#2・#3で選択した内容を追加します。 |
以上の処理で、ログイン名・パスワードがDBに記憶されます。
② 入力された内容を、ユーザー認証の形式に変換する。
kintoneのユーザー認証形式は、”リクエストヘッダに「X-Cybozu-Authorization」を追加し、「ログイン名:パスワード」をBASE64エンコードしたもの”なので、その形式に変換していきます。
#7,#8 | 「データベース/取得」を使い、DBに記憶された「ログイン名」「パスワード」を読み込みます。 |
#9 | 「文字列関数/連結」を使い、「ログイン名:パスワード」という文字列を生成します。 |
#10 | 「文字列関数/Base64エンコード」を使い、#9で生成した文字列をBase64形式に変換します。 |
#11 | 「文字列関数/連結」を使い、「X-Cybozu-Authorization: 」を#10の前に連結します。 |
結果として、以下のようなデータが生成され、変換完了です。
// ログイン名が「Administrator」、パスワードが「cybozu」の場合 X-Cybozu-Authorization:QWRtaW5pc3RyYXRvcjpjeWJvenU=
③ ユーザー認証の形式に変換したデータを、DBに記憶させる。
#13 | 「データベース/削除」を使い、これまで記憶されていたデータをクリアします。(この処理を行わないと、入力されたユーザー認証データが累積されていきます) |
#14 | 「データベース/追加」を使い、2.②で作成したDBの該当項目に、#11で生成した内容を追加します。 |
以上の処理で、ユーザー認証情報がDBに記憶されます。
4. 紐づけ
ここまで出来たら、あとは画面とDB・処理を紐づけるのみです。
① 画面とDBとの紐づけをします。(任意)
ログインIDやパスワードについて初回入力後は入力不要とする場合、テキストボックスにDBの値を連動させることで実現できます。
具体的には、ログイン名を入力するテキストボックス選択後、内容タブのテーブルを選択し、そこで2.①で作成したDBのテーブル名・フィールド名を選択します(パスワードも同様)。
これによって、DBにデータが記憶されていれば、ログイン名を入力するボックスに自動でデータが入力されます。
② 画面と処理との紐づけをします。
ボタンを押した際に、実行される処理を選択します。
具体的には、処理を実行させたいボタンを選択後、動作設定タブの実行処理から3. で作成した処理を選択します。
以上で、アプリは完成です。
アプリを実行し、ログイン名「Administrator」パスワード「cybozu」と入力いただき、ログインボタンを押下していただくと、DBに下記のデータが格納されているかと思います。
次回は、実際にkintoneのレコードを登録するアプリの作成方法をご紹介します。
なお、解説で使用したサンプルプロジェクトは、以下よりダウンロードすることができます。