ユースケース例：ファイルアップロード
次の例では、ユーザーがプロフィール写真をアップロードし、それを外部システムに保存し、ユーザーがページを送信する前にプレビューできるようにする Workflow app の設定方法を説明します。
ファイルアップロード時のアクション有効化
次の手順を実行して、ファイルアップロードでレシピ実行アクションを有効にします：
新しいWorkflow appを作成するか、既存のWorkflow appを選択します。
file コンポーネントを選択し、アクションパネルに移動します。アクションのトリガーイベントは、Value changedとして事前選択されています。
アクションドロップダウンメニューを使用してRun recipeを選択します。
レシピドロップダウンメニューを使用して、レシピを作成をクリックします。これにより、新しいタブでSet up your recipeページが開きます。
ファイルアップロードのアクション設定
アプリにアップロードされたファイルを処理するレシピを設定
このレシピに一意のNameを入力します。
Locationドロップダウンメニューを使用して、レシピがアプリページと同じフォルダにあることを確認します。
ビルドを開始をクリックします。
Workatoは、New component event（リアルタイム）トリガーとReturn data to componentアクションが事前設定されたレシピを生成します:
レシピの概要
新規コンポーネントイベントトリガーを変更する
New component eventトリガーを選択します。
Setupタブに移動します。
セットアップタブには、レシピの入力パラメーターと出力パラメーターが表示されます。これらを使用して、ページからファイルなどのデータを受け取り、データをページに返します。
Input parametersに移動し、Add input parametersをクリックします。
ページデータを定義します。この例では、レシピで使用するファイルです。各入力パラメーターについて、Name、Data type、Optional のステータスを指定する必要があります。任意で Label と Hint を指定することもできます。
データ型として File を選択し、アプリにアップロードされたファイルをレシピに渡します。
入力パラメータの設定
アプリでアクションを設定する
アップロードされたファイルを処理するために、1つ以上の Action in an app ステップを設定するには、次の手順を実行します。例えば、アップロードされたプロフィール写真を組織の人事管理ソフトウェアに保存できます。
レシピ内のアプリとアクションを選択ステップをクリックします。
使用する予定のアプリを検索して選択します。アプリで使用可能なアクションのリストが表示されます。
使用するアクションを選択します。例えば、ドキュメントストレージまたはコンテンツ管理システムでのファイルアップロード、ダウンロード、添付ファイルアクションなどです。
コンポーネントイベントレシピに使用する予定のコネクションタイプを選択します。
コネクションタイプを選択
- エンドユーザーのコネクション: Workflow appsレシピは、アプリケーションに接続するユーザーのIDと権限に基づいてアクションを実行します。エンドユーザーは、自分の認証情報で認証して外部アプリ内のデータを取得または変更します。
- このレシピのコネクション: このオプションは、レシピビルダーによって確立されたコネクションを使用し、通常のアプリコネクションと同じ原則に従います。
OAuth 2.0認可コードグラントを使用するアプリコネクションのみが、エンドユーザーのコネクションで利用できます。詳細については、検証済みユーザーアクセスを参照してください。
既存のコネクションを選択するか、+ New connection をクリックして新しいコネクションを作成します。
要件に基づいてアクションを設定します。
必要に応じて追加のステップを追加します。
コンポーネントにデータを返すアクションを変更する
レシピデータをアプリに返すには、次の手順を完了します:
Return data to componentアクションを選択します。
Consider this action as successful?ドロップダウンを使用して、アクションが正常に完了したかどうかを定義します。
Save、Exitの順にクリックします。
アプリでプロフィール写真をプレビューするように設定
ファイルコンポーネントをイメージコンポーネントにマッピングすることで、アップロードされたプロフィール写真をアプリでプレビューできるように設定できます。
INFO
イメージコンポーネントがサポートするのは、.png、.jpg、.jpeg などの画像ファイルタイプのみです。
ページエディタに戻り、ページに新しい Image コンポーネントを追加します。
プロパティパネルの Source セクションに移動し、Page data を選択します。
画像ソースとして Page data を選択
Image data ドロップダウンメニューを使用して、表示するファイルコンポーネント入力を選択します。
画像の Alt text を入力します。
Visible トグルを使用して、常に画像を表示するか、特定の条件下でのみ表示するかを指定します。例えば、このコンポーネントの表示条件を Conditional に設定し、ファイルがアップロードされた後にのみ表示されるようにできます。
任意。 Image fitting 設定を変更し、画像をコンテナに合わせて Resize to fit するか Expand to fill するかを指定します。
任意。 Horizontal alignment を変更します。
任意。 Vertical alignment を変更します。
アップロードされた画像のプレビュー
最終更新日: