画像から文字列を読み取ることは、やること「OpenAI を画像付きで呼び出してテキストを生成する」で可能なのですが、文字列を単純に読み取るだけでは、読み取った値をフィールドにセットしたり、レコード更新などのマッピングに利用することが難しい形で文字列が生成されやすいです。


そこで、この記事ではOpenAIにJSON形式の文字列を返してもらうことでカスタマインで扱いやすい形(JSON形式の文字列)として取得し、その後にやること「JSONを読み込む」を使い、読み込んだ結果を複数のフィールドにセットする方法をご案内します。


アプリ例


読み取る画像の例


AIに渡す文字列

AIに渡す指示文字列（「メッセージ」パラメーター）は、具体的な指示内容も含めるようにします。

たとえば、次の様な指示メッセージを設定します。


JSON文字列は{キー:値}の組み合わせで表現されます。

JSON文字列のキーには、利用するアプリのフィールドコードを指定しておくと、後のマッピングがしやすくおすすめです。


指示内容はあくまで一例です。お試しいただきながら、内容に応じて適切な指示メッセージをご検討ください。


##指示内容

この画像の中の文字を以下のJSON文字列の内容で抜き出して、抜き出した文字を以下のJSON形式で記載したものを返してください。

結果の値にはコードブロックは使わないでください。


##抜き出しの注意点

日付の場合は、「YYYY-MM-DD」の形式に変換して抜き出すこと。

宛先の場合は、「様」「御中」などの敬称は付けずに名前だけを抜き出すこと。

金額の場合は、「￥」マークや区切りのカンマ「,」を含まない、数値のみで抜き出すこと。


#結果出力JSON記載例

{

  "name": "山田太郎",

  "age": 30

}


#必要なJSON文字列のキー

・日付

・宛先

・金額

・但し書き

・郵便番号

・住所

・会社名



カスタマイズ例

いくつかのポイントに分けて解説します。


ボタンを設置し、自レコードを取得

まず、処理を開始するためのボタンを設置し、ボタンを押した時にやること「キーを指定してレコードを取得する」で自レコードを取得します。

このレコード取得は、後のアクションでAIに画像を渡すために行なっています。


確認ダイアログを表示し、読み込み中画面を表示する

OpenAIを呼び出して処理するのは時間がかかるので、確認ダイアログや読み込み中画面を表示することをおすすめします。


ダイアログで「キャンセル」を押した時には何もせず全体の処理を終わらせます。


OpenAIを呼び出す

やること「OpenAI を画像付きで呼び出してテキストを生成する」を利用してテキストを生成します。

生成されるテキストは、先ほど指定しておいた指示文章に従い、JSON形式の文字列になっている想定です。


今回のアクションで返ってくる想定のJSON形式の文字列

{

  "日付": "2024-10-05",

  "宛先": "城 太朗",

  "金額": "90000",

  "但し書き": "カスタマイズ代",

  "郵便番号": "5300011",

  "住所": "大阪府大阪市北区大深町3-1 グランフロント大阪 タワーC 16階",

  "会社名": "アールスリーインスティテュート"

}



また詳細画面で実施するため、「セット先フィールド」には何も選択しないようにしておきます。


JSONを読み込む


やること「OpenAI を画像付きで呼び出してテキストを生成する」でJSON形式の文字列が返って来るはずなので、アクションの結果をやること「JSONを読み込む」で読み込みます。


JSONから読み込んだ値をマッピングしてレコードを更新する

「JSONを読み込む」のアクションの結果を利用します。

返ってくるJSON文字列のキーにはフィールドコードを指定しておいたため、

= $67.フィールドコード

でマッピングが可能です。


生成された文字列も確認したいため、文字列複数行フィールドにも併せてマッピングしておきましょう。


読み込み中画面を終了しリロードする


カスタマイズ実行結果

実行前


実行後



まとめ

JSON形式になっていれば、そのままアクションの結果を利用してマッピングに使えるので、かなり色々なことに活用ができます。

いろいろと試してみてください！


お試しいただいてご不明な点がございましたら、チャットでお気軽にお問合せください。