フロントエンドプログラムから Workflows を実行する

# はじめに

初めまして。 京セラコミュニケーションシステム 福留（@kccs_kazuo_fukudome）です。

マイクロサービスで基盤が作成されている。Cloud Functions、Cloud Run、 API などのサービスを連続して呼出す処理。各サービス間で DB の整合性を保つ場合など。Web アプリケーションのバックエンド処理やデータ変換処理を Workflows で作成する事例が増えています。
今回は、Web アプリケーションのバックエンド処理を WorkFlows で作成し、フロントエンドプログラムからの呼出し処理を実装してみたので紹介します。

:::note info
本記事は 2022 年 10 月ごろに作成しております。
Google Cloud の機能を利用した場合は、利用料が発生します。
:::

## この記事の対象者

- Web アプリケーションで Workflows で作成したバックエンド処理やデータ変換処理の実行をしたい人
- Web アプリケーションから Workflows を動かしてみようとと思っている人
- マイクロサービスを利用した基盤構築を検討している人

## Workflows の作成

Workflows で、フロントエンドプログラムから呼出されるワークフローを作成します。今回作成する Workflows は、メッセージを返却するだけの簡単なものにします。

![image1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852633/b6e8c009-e4da-0325-76d5-1768dbb87273.png)
![image2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852633/6d373d0a-a814-ec57-7a03-61ff8aec75cd.png)

```
main:
    params: [args]
    steps:
    - returnOutput:
        return: ${"Called WorkFlows"}
```

## フロントエンドプログラムの作成

Workflows を呼出すフロントエンドプログラムを ajax 通信で作成します。

```
 $(function () {
   $("#submit").click(function () {
     $.ajax({
       type: "POST",
       url: "作成したWorkflowsのURL",
       headers: {
         "Content-Type": "application/json; charset=UTF-8",
       },
     })
       .done(function (data, textStatus, jqXHR) {
         $("#response").html(
             "HTTPResponse : " + jqXHR.status + "\n" +
             "message : " + JSON.stringify(data)
         );
       })
       .fail(function (jqXHR, textStatus, errorThrown) {
         $("#response").html(
           "HTTPResponse : " + jqXHR.status + "\n" +
           "Status : " + textStatus + "\n" +
           "errorThrown : " + jqXHR.responseText
         );
       });
   });
 });
```

## 実行してみる

作成したフロントエンドプログラムから Workflows を呼び出すと、認証エラー(401)になりました。

```
HTTPResponseCode : 401
Status : error
errorThrown : {
  "error": {
    "code": 401,
    "message": "Request is missing required authentication credential. Expected OAuth 2 access token, login cookie or other valid authentication credential. See https://developers.google.com/identity/sign-in/web/devconsole-project.",
    "status": "UNAUTHENTICATED",
    "details": [
      {
        "@type": "type.googleapis.com/google.rpc.ErrorInfo",
        "reason": "CREDENTIALS_MISSING",
        "domain": "googleapis.com",
        "metadata": {
          "method": "google.cloud.workflows.executions.v1.Executions.CreateExecution",
          "service": "workflowexecutions.googleapis.com"
        }
      }
    ]
  }
}
```

エラーメッセージに出力されている、次のドキュメントを読むと Workflows の実施には Google の認証が必要だと解りました。
参考：<https://developers.google.com/identity/sign-in/web/devconsole-project>

また、Workflows は、Cloud Functions や Cloud Run と違い、Google Cloud コンソールの画面にて未認証で呼出す設定が出来ないようです。
Workflows を未承認でも呼出す方法がないかを調べました。

## Cloud Function 経由で呼出す

調べた結果、Workflows を未認証で呼出すことは難しいようです。
そのため、Cloud Functions 経由で Workflows を呼出すように変更しました。

![image3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852633/d630d579-bb86-c8e6-ef3f-3b57e245ddf2.png)

Cloud Functions のコード

```
import json

from google.cloud.workflows_v1 import WorkflowsClient
from google.cloud.workflows.executions_v1 import ExecutionsClient
from google.cloud.workflows.executions_v1.types.executions import Execution

def callWorkflow(request):
    if request.method == 'OPTIONS':
        headers = {
            'Access-Control-Allow-Methods': 'POST',
            'Access-Control-Allow-Origin': '*',
            'Access-Control-Allow-Headers': 'Content-Type',
            'Access-Control-Max-Age': '3600'
        }

        return ('', 204, headers)

    project = 'プロジェクト ID'
    location = '作成したWorkflowsのリージョン'
    workflow = '作成したWorkflowsのワークフロー名'

    workflow_args = {}

    parent = WorkflowsClient().workflow_path(project, location, workflow)
    client = ExecutionsClient()
    execution = Execution(argument=json.dumps(workflow_args))
    response = client.create_execution(parent=parent, execution=execution)

    headers = {
        'Access-Control-Allow-Methods': 'POST',
        'Access-Control-Allow-Origin': '*'
    }

    return ("Called Workflows", 200, headers)

```

## 再実行してみる

フロントエンドプログラムの呼出し URL を Workflows から Cloud Functionns に変更し実行してみました。
問題なく動作したようです。

```
HTTPResponse : 200
message : "Called Workflows"
```

![image4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852633/a4dfee9c-d3fc-5cd3-48d6-4457dd605060.png)
![image5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852633/9b18e2ff-61b3-0f4b-e3e0-54d0762880dd.png)

今回は未認証で Workflows を呼出す実装をしてみました。次回は認証を利用した Workflows の呼出しも実装してみたいと思います。