Anyflow Embed Docs
管理画面を開く
  • 👋イントロダクション
    • はじめに
    • 初期セットアップ
    • 用語集
  • 🔰トライアルツアー
    • トライアルツアー初級編
      • STEP1|アカウント作成 〜 ソリューション作成
      • STEP2|エンドユーザー変数
      • STEP3|ifステップ
      • STEP4|変数の活用、デバッグ
      • 動画チュートリアル
    • トライアルツアー中級編
      • STEP1 | 独自のアクションを追加する
      • STEP2 | My Event を理解する
      • STEP3 | My Event を実装する
    • トライアルツアーが終わったら
  • 🍳レシピ
    • CRM
      • SalesforceのToDoデータを取得する
      • Salesforceの取引先データを取得する
      • Salesforceの取引先データを登録する
      • Salesforceの商談を取得する
      • Salesforceのリードを取得する
      • HubSpotのコンタクトデータを取得する
      • HubSpotの会社データを取得する
      • HubSpotの取引データを取得する
    • コミュニケーション
      • Slack チャンネルにファイルをアップロードする
      • Slack チャンネルのメンバー情報一覧を取得する
      • 独自のSlackBotを設定する
    • 人事労務
      • SmartHRの部署データを取得する
      • SmartHRの従業員データを取得する
      • freee人事労務の従業員データを取得する
      • freee人事労務の勤怠データを取得する
    • 会計
      • freee会計の事業所データを取得する
      • freee会計の取引先データを取得する
      • freee会計の取引データを取得する
      • freeeコネクタのスコープを変更する
    • グループウェア
      • Google DriveのOAuthアプリを作成する
  • 🎨ソリューションエディタ
    • ソリューションエディタとは
    • トリガー
      • 自社プロダクト起点
        • Clickトリガー
        • Requestトリガー
          • Responseステップ
        • My Eventトリガー
          • アクセストークンの発行
        • Webhookトリガー
        • Request / My Event / Webhook トリガーの違い
      • 外部プロダクト起点
        • ポーリングトリガー
        • リアルタイムトリガー
      • スケジューラートリガー
      • トリガー条件
    • アクション
      • APIの呼び出し
        • 専用アクション
        • カスタムアクション
        • HTTPアクション
      • データの変換
        • Pythonアクション
        • 変数アクション
        • リストアクション
        • 日付と時刻アクション
        • CSVアクション
      • データの記録
        • キーバリューストア(KVS)アクション
        • ログアクション
        • メールアクション
    • ロジック
      • if
      • 繰り返し
      • エラー監視
      • 停止
    • 変数
      • 標準変数
      • エンドユーザー変数
    • 共通仕様
      • スキーマ定義
      • 固定リストと動的リスト
      • Formula
  • 🖼️ウィザードエディタ
    • ウィザードエディタとは
    • ウィジェット
      • アシスト
      • 複数選択アシスト
      • テーブルアシスト
      • チェックボックス
      • マッピング
      • コンディション
      • CSV(ファイル全体)
      • CSV項目(ヘッダーのみ)
    • ウィザードの仕様
    • 詳細設定
      • Markdown記法
      • テキストの入力パターンを指定する
      • デフォルト値を指定する
  • 🔌コネクタ
    • 対応コネクタ一覧
    • SaaSコネクタ固有の注意点
      • SaaS側でIPアドレス制限をしている場合
      • 自社独自のOAuthクライアントが必須のSaaS
      • cybozu.com製品で認証エラーとなる場合
      • kintoneコネクタとkintone(OAuth)コネクタの違い
      • ZoomコネクタとZoom(カスタム)コネクタの違い
      • SlackBotコネクタの違い
      • 2種類のSmartHRコネクタについて
    • OAuth画面をカスタムする
  • 🚀リリース
    • テスト
    • デプロイ
    • デプロイ環境
    • エンドユーザーへの提供方法
    • 自社プロダクトへの組み込み
      • JWTや公開鍵を生成する
      • SDK組み込みツアー
    • Anyflowドメインでの提供
  • 🧰運用/保守
    • 実行履歴
      • エンドユーザー向け実行履歴
      • ベンダー向け実行履歴
    • エラーへの対応
      • 連携先アプリの認証エラー
      • アクションの自動リトライ
      • ソリューションの再実行
    • イベント通知
    • ソリューション実行の上限値
    • ソリューションの削除
  • 📄ポリシー
    • 障害時の対応
    • エンドユーザーの問い合わせ
    • サービスレベル/稼働率
    • サービスの責任範囲
    • セキュリティポリシー
  • ⚙️Anyflow SDK
    • Anyflow SDK v0.13.0
      • エラータイプ
      • リファレンス
      • マイグレーションガイド
      • よくあるご質問
  • ⚙️Anyflow API
    • Vender Server API
      • Open API Specification
    • End User API
      • Open API Specification
    • Webhook
      • Open API Specification
GitBook提供
このページ内
  • 概要
  • 0.中級用の準備を行う
  • 1.HTTPコネクタを設定する
  • 1-1. このツアーで利用するAPIについて
  • 1-2. HTTPコネクタを追加する
  • 1-3. リクエストヘッダーを設定する
  • 1-4. リクエストボディを設定する
  • 1-5. レスポンスの設定を行う
  • 2.レスポンスをSlackで投稿する
  • 3.テスト実行する
  • 3-1.成功することの確認
  • 3-2.失敗することの確認
  • 4.エラーに対応する
  • 4-1.エラー監視ステップの導入
  • まとめ
  • ネクストステップ
  1. トライアルツアー
  2. トライアルツアー中級編

STEP1 | 独自のアクションを追加する

前へトライアルツアー中級編次へSTEP2 | My Event を理解する

最終更新 1 か月前

概要

初級トライアルツアーで作成したソリューションをさらにアップデートさせていきましょう。

目指すべきゴールを端的に示すと以下の通りです。

種類
Before
After

トリガー

Google Drive (ファイル/フォルダが作成された際に実行)

同様

アクション

Slack Bot (ファイル名を投稿)

HTTP(独自アクションの追加) & Slack Bot(独自アクションのレスポンスを投稿)


0.中級用の準備を行う

中級用のツアーを始める準備を行います。

から、初級STEP4で作成したソリューションの複製を行います。

コピーが完了するとソリューションエディタが開きます。

ソリューションの名称は中級用の名前に変更しておきましょう。

Slackのアクションを2ステップ目に移動させます。

ifのステップは今回は利用しないため削除します。


1.HTTPコネクタを設定する

HTTPコネクタは任意のAPIを実行できるため、自社のコネクタがAnyflow Embedに登録されていなくても自社のAPIを呼び出すことができます。

1-1. このツアーで利用するAPIについて

今回の中級トライアルツアーでは、HTTPコネクタでリクエストするAPIとして、Anyflowがデモ用に作成したAPIを利用します。

このAPIは架空の名刺管理ツールのAPIとして作成しており、名刺画像を受け取って、そこに含まれるリード情報を解析し返却するような挙動をします。

※返却される値はランダムな値であり、実際に名刺画像を読み取った結果ではありません。

あくまでも例として挙げているため、自社のAPIが利用可能な場合はそちらを使ってツアーを進めていただくことも可能です。

1-2. HTTPコネクタを追加する

1ステップ目と2ステップ目の間で「ステップを追加」し、アクションとして「HTTP」を追加します。

表示名は任意です。今回は名刺読み取りAPIとしておきます。

1-3. リクエストヘッダーを設定する

HTTPメソッドはPOSTを選択します。

認証用のTokenをエンドユーザーから入力してもらうために、エンドユーザー変数を作成しておきます。ウィザードへの配置も忘れずに行ってください。

POSTを選択するとさらに設定項目が表示されますので、以下の内容を設定します。

項目
設定

リクエストURI

リクエストURLパラメータキー

設定不要

リクエストヘッダーキー

┗ Content-Type

application/json

┗ Authorization

Bearer {Token} ※Bearerと{Token}の間には半角スペースを入れてください

リクエストタイプ

json

1-4. リクエストボディを設定する

リクエストボディの入力方法はデフォルトにします。

リクエストボディ定義は、「JSONで追加」を選択します。

JSONを入力するモーダルが表示されるので、以下のJSONをコピーして貼り付けます。

<JSON>

{
    "file_name": "business-card.png",
    "file_content": "iVBORw0KGgoAAAANSUhEUgAAATYAAACjCAMAAAA3vs..."
}

「生成する」を押すとリクエストボディの定義が自動で生成されます。

リクエストボディには、Google Driveトリガーで取得した値を設定します。

file_name : Name

1-5. レスポンスの設定を行う

リクエスト側と同じ要領で、レスポンス側も設定を行います。

レスポンスヘッダー定義:設定不要

レスポンスタイプ:json

レスポンスボディ定義:以下のJSONを追加します。

{
    "status": "success",
    "code": 200,
    "message": "名刺データを読み取りました。",
    "data": {
        "id": 1,
        "company": "株式会社AAA",
        "department": "開発部",
        "name": "田中 太郎",
        "email": "[email protected]"
    }
}


2.レスポンスをSlackで投稿する

HTTPで取得したレスポンスをSlackで投稿します。

例として、レスポンスの{data}に含まれる要素を一通り追加しています。


3.テスト実行する

今回のAPI仕様を踏まえると、ソリューションが成功するためには以下が必要になります。

  1. ウィザードのToken欄に正しいトークン(anyflowtesttoken)が入力されていること

  2. Google Drive にアップロードされたファイルが画像ファイル(png/jpeg)であること

これを踏まえて、成功パターンと失敗パターンのテスト実行を行います。

3-1.成功することの確認

ウィザードのToken欄にanyflowtesttokenを入力します。

Google Driveには画像ファイル(.png/.jpeg)をアップロードします。

Slackに以下の様なメッセージが投稿されていれば成功です。

3-2.失敗することの確認

以下どちらかを実施します

  • ウィザードのToken欄に正しくないトークン文字列(例:invalidtoken)を入力する

  • Google Driveに画像ファイル以外のファイル(例:.txt)をアップロードする

いずれもSlackにはメッセージが投稿されず、ソリューションが失敗になっているはずです。


4.エラーに対応する

上記の様に、様々な理由でソリューションはエラーになり得ます。

Anyflow Embedではそれぞれのケースに対応する機能を持っています。(詳細はこちら)

今回は

  • エラー監視ステップの導入

  • Google Drive トリガーへの条件付与

によりエラーへの対応を追加します。

4-1.エラー監視ステップの導入

ステップ1と2の間に「エラー」ステップを追加します。

「エラー監視」と「エラーならば」のステップが追加されるので、エラー監視の内側にHTTPとSlackのステップを移動します。

「エラーならば」の内側に、新たにSlackコネクタを配置し、エラー時のメッセージを設定します。

// 例
エラーが発生しています。
以下のURLから内容を確認してください。
https://your-product.com/integration/

これによりエラーが発生した際に「エラーならば」の内側のステップが実行され、Slackメッセージが送られますが、ソリューションの結果としては「成功」のステータスになってしまいます。

停止ステップを使うとソリューションを強制的に停止させ、実行ステータスを「成功」「失敗」のどちらかに固定することができます。

「エラーならば」の内側で停止ステップを追加します。

実行ステータスは「失敗にする」を選択します。

改めてテストを行います。

ウィザードのToken欄には、正しくないトークン文字列(例:invalidtoken)を入力します。

ステータスが「失敗」になっていて、Slackにエラー通知が発生していれば完了です🎉

今回の場合、エンドユーザーがGoogle Driveを日常的に使うなかで、画像以外のファイルをUPしてしまうことは容易に考えられます。

その度に毎回通知が飛ぶのはユーザー体験を損ねるため、処理を修正します。

ステップ1を選択し「トリガー条件」を開きます。

条件を満たす場合のみトリガーを有効化できるため、2つの条件を設定します。

if Mime type 等しい image/png

OR Mime type 等しい image/jpeg

改めてテストを行います。

Google Driveに画像ファイル以外のファイル(例:.txt)をアップロードします。

.txtファイルをUPしたにもかかわらずトリガーの待機状態が維持されており、

.png/.jpegファイルをUPした場合にトリガーの待機状態が解除されていたら、完了です🎉


まとめ

中級編 STEP1 お疲れ様でした。

今回のセクションでは、HTTPコネクタやエラーへの対応について学ぶことができました。

HTTPコネクタを使うと独自のアクションを組み込んだソリューションを作成することができます。

今回はデモ用API での紹介でしたので、ぜひ実際のAPIでも試してみてください。

初級編と比べてボリュームも増えていますので、不明点があればAnyflow CSチームにご連絡ください。


ネクストステップ

次は、独自のトリガーを組み込む方法をご紹介します。

にお進みください。

独自アクションを追加するにはを利用します。

を確認しながら設定を行います。

file_content:b64encode(File contents) ※を使って記述します

正しくないトークンを入力した場合
画像ファイル以外をアップロードした場合

Anyflow EmbedのSDKが設置されている画面のURLを添えておくと、からエンドユーザー自身でエラー内容を確認することができます。

これを「失敗」のステータスにするために、を追加します。

テスト結果のステータスが「失敗」になっている
Slackにエラーの投稿がされている

🔰
HTTPコネクタ
[デモ用] 名刺画像からリード情報を読取るAPI - Anyflow Demo
デモ用のAPI仕様書o
Formula
ソリューション実行履歴
停止ステップ
STEP2 | My Event を理解する
https://mock.apidog.com/m1/459105-0-default/api/v1/extract-business-card
ソリューション一覧
画像ファイル以外をアップロードした場合
正しくないトークンを入力した場合
Slackにエラーの投稿がされている
テスト結果のステータスが「失敗」になっている