FileMaker Pro 18 Advancedからkintoneのアプリに写真をアップロードする

こんにちは、エミックの松尾です。以前の記事で、kintone REST APIを使用してFileMaker Pro 18 Advancedからkintoneのアプリにレコードを追加する方法について解説しました。その続きとして、今回の記事では、FileMaker Pro 18 Advancedからkintoneのアプリに写真をアップロードする方法について記しています。

FileMaker カスタム Appにオブジェクトフィールドを追加

今回は、以前の記事で作成したFileMaker カスタム App（PhotoReports.fmp12）に写真データ保存用のフィールドを追加するところから始めます。

はじめに、FileMaker Pro 18 Advancedで「PhotoReports.fmp12」を開きます。

FileMakerではオブジェクトフィールドを使えばファイルをフィールドに保存できます。オブジェクトフィールドを追加するには、［ファイル］メニューの［管理］＞［データベース...］を選びます。

［データベースの管理］ダイアログボックスが表示された後、今回はフィールド名の欄に「添付ファイル」と入力し、［タイプ］を「テキスト」から「オブジェクト」に変更してから［作成］をクリックします。

［OK］をクリックするとフィールドが追加されます。今回は説明を省略しますが、レイアウト上に添付ファイルフィールドが追加されていない場合には、レイアウトモードでフィールドを配置して調整するようにしてください。

追加した添付ファイルフィールドにJPEG形式の写真ファイルをドラッグ＆ドロップすればファイルがレコードに保存されます。

ファイルアップロード用のスクリプトステップを追加

フィールド追加作業が完了したら、すでに作成済みのスクリプト（「kintoneに登録」）を編集します。既存のスクリプトを編集するには［スクリプト］メニューの［スクリプトワークスペース...］を選びます。

次に「kintoneに登録」を選択します。

ファイルのデータを変数に格納するために［変数を設定］スクリプトステップを追加します。スクリプトステップの検索欄に「変数」と入力して、［変数を設定］スクリプトステップをダブルクリックします。

［変数を設定］スクリプトステップをドラッグしてスクリプトの最初に移動します。

［変数を設定］スクリプトステップの右側に表示されている歯車アイコンをクリックすると、変数を設定するためのダイアログボックスが表示されます。［名前］に「$file」、［値］に「PhotoReports::添付ファイル」と入力してから、［OK］をクリックします。

kintoneには、レコード登録用のAPIとは別に、添付ファイルフィールドにファイルをアップロードするためのAPIが用意されています。そのAPIを利用するために、［変数を設定］スクリプトステップの次に［URL から挿入］スクリプトステップを追加します。

ファイルアップロード

スクリプトステップの検索欄に「URL」と入力して、［URL から挿入］スクリプトステップをダブルクリックします。

オプションの［ターゲット］をチェックすると、［ターゲットの指定］ダイアログボックスが表示されます。以前と同様、［変数］をチェックして、変数の欄に「$response」と入力します。

［OK］を押してダイアログボックスを閉じた後、［URL を指定］の右にある［指定...］をクリックして、kintoneでファイルのアップロードに使うURIを入力します（例：「https://example.cybozu.com/k/v1/file.json」）。「example」の代わりに実際に使用しているkintoneのサブドメインを指定してください。

［SSL 証明書の検証］にチェックをつけます。

［cURL オプションの指定］の右にある［指定...］をクリックして、次の文字列をコピーした後、［計算式の指定］ダイアログボックス内にペーストします。「YOUR_TOKEN」という文字列については実際のAPIトークンに置き換えてください。

"-X POST --header \"Content-Type: multipart/form-data\" --header \"X-Cybozu-API-Token: YOUR_TOKEN\" -F \"file=@$file;filename=" & GetContainerAttribute ( PhotoReports::添付ファイル ; "filename" ) & "\""

文字列をペーストした後、［OK］を押します。また、スクリプト実行時にダイアログボックスが表示されないように、［ダイアログあり］オプションの「オン」をクリックして「オフ」に変更しておきます。

アップロードしたファイルとレコードの関連付け

ファイルをアップロードするAPIを用いると、アップロードしたファイルのファイルキーを取得できます。kintoneでは、そのファイルキーを利用してレコードの登録や更新を行うと、ファイルとレコードが関連付けられるようになっています。

スクリプトステップの設定を一部調整するために、3ステップ目にある［URL から挿入］スクリプトステップの歯車アイコンをクリックします。

［cURL オプションの指定］の右にある［指定...］をクリックして、次の文字列をコピーします。

;
["添付ファイル"; JSONSetElement ( ""; "value"; "[" & JSONSetElement ( "" ; "fileKey" ; JSONGetElement ( $response; "fileKey") ; JSONString )& "]"; JSONArray ); JSONObject]

［計算式の指定］ダイアログボックス内にある「["文字列__複数行_"; JSONSetElement ( ""; "value"; PhotoReports::メモ; JSONString ); JSONObject]」の行末にマウスカーソルを移動してからコピーした文字列をペーストします。

［OK］を押した後、［スクリプト］メニューの［スクリプトの保存］を選ぶと、編集したスクリプトの内容を保存できます。

スクリプトが動作するか確認する

［スクリプト］メニューの［kintoneに登録］を選択すると、スクリプトが実行されます。スクリプトを実行して［OK］を押した後に、実際にkintoneでレコードが作成されていて、さらにそのレコードで写真が表示されていれば成功です。

まとめ

FileMaker Pro 18 Advancedからkintoneのアプリに写真をアップロードする方法について解説しました。kintoneでは、ファイルをアップロードするAPIで取得したファイルキーを利用してレコードの登録や更新を行うと、ファイルとレコードが関連付けられるようになっています。今回作成したFileMaker カスタム AppをFileMaker Goに転送して使えば、インターネットに接続できない環境で撮影した写真を後でkintoneに登録する、といった使い方もできます。