すべてのプロダクト
Search
ドキュメントセンター

CloudFlow:インターフェースの概要

最終更新日:Sep 11, 2026

CloudFlow は、ローコードのビジュアルなワークフローデザイナーである Workflow Studio を提供します。WorkflowStudio を使用して、ワークフローを作成および編集し、各ステップのフィルタリングルールとエラー処理ルールを設定できます。このトピックでは、WorkflowStudio インターフェイスの概要を説明します。

Workflow Studio は、ビジュアルワークフローの構築、定義の編集、設定の管理を行うための 2 つの編集モード、[CloudFlow Studio] と [YAML] を提供しています。また、[ワークフローの設定] タブも提供しています。簡単に言うと、CloudFlow Studio では、ステートをワークフローキャンバスにドラッグすることでワークフローを設計できます。YAML モードでは、コードを使用してワークフローを定義し、正確に制御できます。[ワークフローの設定] タブでは、ワークフローの基本情報と実行ロールを設定し、ワークフローがそのロールの権限を引き受けられるようにします。

CloudFlow Studio

CloudFlow Studio は、ワークフローの構築時にワークフローを視覚化するグラフィカルインターフェースを提供します。この編集モードには、以下のコンポーネントが含まれています。

image

  • ① メニューバー

    WorkflowStudio で、[CloudFlow Studio]、YAML、[ワークフロー設定] のタブを切り替えます。

  • ② ステートブラウザー

    操作、[フロー]、[パターン] という 3 つのタブが含まれています。

    操作 タブには、弾性コンピューティング、ミドルウェア、データベース、人工知能などのサービスを含む、CloudFlow と統合された Alibaba Cloud サービスの API が一覧表示されます。これらの API をワークフローキャンバスにドラッグでき、各 API はタスク状態を表します。

    [Flow] タブには、実行フローを制御するが特定のタスクを実行しないステートが一覧表示されます。Choice、Parallel、Map、Pass、Wait、Succeed、Fail の 7 種類のフロー制御ステートが提供されています。

    [パターン] タブには、CloudFlow の事前構築済みモジュールが用意されています。これらのモジュールをキャンバスにドラッグして、ワークフローをすばやく作成できます。

  • ③ ワークフローキャンバス

    操作、[フロー]、および [パターン] タブから任意のノードをキャンバスにドラッグできます。また、ワークフロー内の既存のステートの順序を並べ替えて、タスクフローをカスタマイズすることもできます。

  • ④ インスペクターパネル

    ワークフローキャンバス上でステートを選択すると、右側の [インスペクターパネル] でそのプロパティを設定および表示できます。

  • ⑤ 機能ボタンセクション

    保存、[終了]、[実行]などの一般的なアクションボタンが含まれます。

以下のセクションでは、CloudFlow Studio エディターの 3 つの主要な領域について説明します。

ステートブラウザー

States ブラウザで、操作、[フロー]、または [パターン] タブのリストからステートノード (API) またはフローノードを選択し、キャンバスにドラッグします。また、ブラウザ上部の検索ボックスを使い、キーワードで特定のノードを検索することもできます。

image

ワークフローキャンバス

ワークフローキャンバスでは、ノードをドラッグアンドドロップすることで、ビジネス用のフローチャートをカスタマイズできます。また、オンラインデバッグもサポートしており、編集しながらデバッグして、実行可能なワークフローを生成できます。

フローチャートの生成

ステートブラウザーからステートノード (API) またはフローノードを選択し、キャンバス上の目的の位置にドラッグします。水平線または垂直線が表示されたら、マウスを離します。フローチャートを生成すると、基盤となるコードが自動的に生成されます。

image.png

また、キャンバスの左上隅にあるボタンをクリックして、拡大、縮小、フローチャートの中央揃え、選択したステートノード (API) またはフローノードの削除、または最後のアクションの取り消しを行うこともできます。

image.png

ワークフローのデバッグ

ステートのパラメーターを設定した後、オンラインでデバッグできます。ステートにカーソルを合わせ、右側の image.png アイコンをクリックして、デバッグを開始します。デバッグが完了したら、image.png をクリックして結果を表示します。

image.png

インスペクターパネル

ステートブラウザからワークフローキャンバスにステートノード (API) またはフローノードをドラッグした後、設定を行う必要があります。キャンバス上でノードを選択すると、その設定オプションが右側のインスペクターパネルに表示され、[基本設定]、[入力設定]、[出力設定]、およびエラー処理が含まれます。

image

このトピックでは、InvokeFunction タスクステートを例として使用します。次の表に、設定する主要な設定項目を示します。他の設定項目にはデフォルト値を使用できます。

カテゴリ

パラメーター

説明

例

[基本設定]

[ステータス名]

ステートの名前です。ステートの機能を表す名前を指定します。

InvokeFunction

[呼び出しパラメーター]

呼び出す関数、そのバージョンとエイリアス、および呼び出し方法を選択し、関数を起動するペイロードを入力します。

[YAML 編集に切り替え] をクリックして、YAML スクリプトで関数名、バージョン、エイリアス、および呼び出しメソッドを指定することもできます。

以下のコードは、YAML スクリプトの例を示しています。

invocationType: Sync
resourceArn: acs:fc:cn-beijing:1034354682****:functions/GPU-demo/LATEST
body:
  key: value

[関数]

呼び出す関数の名前です。

myfunction

[バージョンまたはエイリアス]

呼び出す関数のバージョンまたはエイリアスです。

LATEST

[関数呼び出しメソッド]

関数を呼び出すメソッドです。有効な値は「同期呼び出し」と「非同期呼び出し」です。関数呼び出しメソッドの詳細については、「関数の呼び出しとトリガー」をご参照ください。

同期呼び出し

[リクエストペイロード]

関数をトリガーするためのペイロードです。YAML 形式と JSON 形式がサポートされています。

{
  "key1": "value1",
  "key2.$": "$.myStateInput.key",
  "key3": 100
}

[次のステート]

ワークフロー内の次のステートです。変更はリアルタイムで反映されます。

Parallel

[入力設定]

ステートの入力をフィルタリングする方法を設定します。次のオプションを使用できます:

  • JSONPath を使用して一部のパラメーターを選択:下のコードエディターで、フィルター式を入力して JSONPath を使用し、パラメーターオブジェクトの一部を選択してノードの入力として渡します。

  • 元の入力をノード入力として使用:ステートの元の入力をそのまま入力として使用します。

  • パラメーターフィルターを使用してパラメーターを構築:パラメーターフィルターを使用して新しい入力オブジェクトを構築します。YAML 形式と JSON 形式がサポートされています。例:

  • FieldA: 123
    FieldB: string
    FieldC.$: $Input

[出力設定]

ステートの出力をフィルタリングする方法を設定します。次のオプションを使用できます:

  • JSONPath を使用して一部のパラメーターを選択:下のコードエディターで、フィルター式を入力して JSONPath を使用し、ステートの結果の一部を選択してその出力として渡します。

  • 元の入力を出力に渡す:ステートの元の入力をそのまま出力として渡し、次のステートに渡します。

  • パラメーターフィルターを使用してパラメーターを構築:パラメーターフィルターを使用して新しい出力オブジェクトを構築します。YAML 形式と JSON 形式がサポートされています。例:

  • FieldA: 123
    FieldB: string
    FieldC.$: $Input

[エラー処理]

[エラー時のリトライ]:エラーが発生した場合のリトライポリシーを設定します。下の [リトライの追加] をクリックして、1 つ以上のリトライポリシーを追加します。

[エラータイプ]

照合するエラータイプです。1 つ以上のエラータイプを選択できます。

FC.BadResponse

[最大リトライ数]

リトライの最大回数です。

5

[リトライ間隔 (秒)]

初回リトライの間隔 (秒) です。最大値は 86400 です。

3

[バックオフ乗数]

リトライ間隔を増加させる乗数です。

1

[最大バックオフ (秒)]

指数バックオフ戦略を使用する場合の、リトライ間の最大待機時間です。

5

[エラー/例外のキャッチ]:特定のエラーまたは例外が発生したときに指定されたステートに遷移するルールを設定します。下の [キャッチルールの追加] をクリックして、1 つ以上のキャッチルールを追加します。

[エラータイプ]

キャッチするエラータイプです。1 つ以上のエラータイプを選択できます。

FC.EntityTooLarge

[フォールバックステート]

指定されたエラーがキャッチされたときに遷移先のステートです。

Hello World

[結果]

指定されたエラーがキャッチされたときにフォールバックステートへの入力として渡す結果です。YAML 形式と JSON 形式がサポートされています。

{
"key": "hello world"
}

YAML

YAML モードは、コードエディターと、YAML で定義するワークフローのリアルタイムグラフを提供します。このモードには、以下のコンポーネントが含まれています。

image

  • ① メニューバー

    WorkflowStudio で、[CloudFlow Studio]、YAML、[ワークフロー設定] のタブを切り替えます。

  • ② YAML コードエディター

    YAML を使用してワークフロー定義を記述および編集します。

  • ③ グラフインスペクター

    ワークフローのリアルタイムグラフを表示します。このビューでワークフローからステートを削除することもできます。

  • ④ 機能ボタンセクション

    保存、[終了]、[実行]などの一般的なアクションボタンが含まれます。

以下のセクションでは、YAML タブの 2 つの主要な領域について説明します。

YAML コードエディター

YAML コードエディターを使用すると、YAML 形式を使用して Workflow Studio でワークフローを記述および編集できます。ワークフロー定義を更新すると、グラフインスペクターがワークフローのリアルタイムグラフをレンダリングします。CloudFlow Studio に切り替えて、更新されたワークフローグラフを表示することもできます。

CloudFlow Studio でステートを並べ替え、削除、または追加した場合、またはグラフインスペクターでステートを削除した場合、YAML コードは自動的に更新されます。

グラフインスペクター

グラフインスペクターは、ワークフローのアーキテクチャのリアルタイムビューを提供します。YAML エディターでワークフロー定義を記述すると、このセクションはワークフローのライブグラフをレンダリングします。グラフでステートを削除すると、コードエディターのワークフロー定義が自動的に更新されます。同様に、YAML エディターでステートを並べ替え、削除、または追加してワークフロー定義を更新すると、グラフが自動的に更新されます。

ワークフロー定義の YAML が無効な場合、グラフインスペクターはレンダリングを一時停止します。

ワークフローの設定

[ワークフローの設定] タブでは、ワークフローの基本情報や実行ロールを設定できます。このタブには、以下の設定項目が含まれています。

image

  • ① メニューバー

    WorkflowStudio で、[CloudFlow Studio]、YAML、[ワークフロー設定] のタブを切り替えます。

  • ② 基本設定

    ワークフローの用途に関する詳細な説明を入力できます。この説明はワークフローリストに表示され、ワークフローの目的を特定しやすくなります。

  • ③ ロール設定

    • 既存のロールを選択:ドロップダウンリストからロールを選択します。ロールに関連付けられているポリシーに、ワークフローが引き受ける必要がある権限が含まれていることを確認してください。

    • ロールの作成:このオプションを選択すると、Resource Access Management (RAM) コンソールの「ロール」ページにリダイレクトされ、新しいロールを作成できます。詳細については、「実行ロールの作成」をご参照ください。

  • ④ 機能ボタンセクション

    保存、[終了]、[実行]などの一般的なアクションボタンが含まれます。