ccf代表

5月1日読了時間: 3分

Wrikeのoutgoing-webhookからAzure Fnctionsでデータを受け取る

弊社がタスク／チケット管理として利用しているWrikeは非常に便利なのですが、お客様とやり取りするうえでメールというインターフェイスも重要になります。

そこで、Wrikeのoutgoing-webhookを有効にし、指定されたフォルダ配下のチケットの変更を簡単なWeb APIインターフェイスを作れるAzure Functionsを利用して、WrikeからPOSTされたデータを受け取りたいと思います。

Azure FunctionsにAPIを作成

Azure Funtions（関数アプリ）を開き、「作成」します。

今回はPython3.11で開発する予定なので、「ランタイムスタック」に「Python」を、「バージョン」に「3.11」を指定します。

関数アプリは全世界で固有の必要があるので、注意してください。今回は以下のようにします。

関数アプリ名：https://xxxxxxxx.azurewebsites.net/

コード（アプリ）をデプロイ

vscodeでプロジェクトを作る

コードのデプロイにはいろいろな方法があるようですが、私はvscodeのAzure Funcitonsモジュールを使用します。既にモジュールがインストールされている前提で進めます。

まず、プロジェクトを作成します。

Azureのタブから、「WORKSPACE」にある「Azure Functions」アイコンをクリックし、「Create New Project」をクリックします。

いくつか質問がありますが、今回はHTTPを受けて発動するAPIを想定しているので、「HTTP triger」を選択し、認証を必要としないので匿名（ANONYMOUS）で作成します。

サンプルコードも含めて作成されるので、今回は単純に受け取ったリクエストデータをログに出力するだけにします。下記のコードでは”get_postData”でデータを受けるようにしたいので、URLは以下のようになります。

https://xxxxxxxx.azurewebsites.net/api/get_postData

import azure.functions as func
import logging

app = func.FunctionApp(http_auth_level=func.AuthLevel.ANONYMOUS)

@app.route(route="get_postData")
def get_postData(req: func.HttpRequest) -> func.HttpResponse:
    logging.info('Python HTTP trigger function processed a request.')

    try:
        req_body = req.get_json()
        logging.info(f"Request body: {req_body}")
        return func.HttpResponse(f"Hello!! This HTTP triggered function executed successfully.", status_code=200)

    except Exception as e:
        return func.HttpResponse(f"Error: {e}", status_code=500)

コードをデプロイする

作ったコードをAzureへデプロイするために、以下のように操作します。

Azureのタブから、「WORKSPACE」にある「Azure Functions」アイコンをクリックし、「Deploy to Functions App」をクリックします。

outgoing-webhookの作成

まずは、WrikeのAPIコンソールへアクセスし、任意のAPIアプリを作成します。APIアプリはテストで使用するものなので、名前等は事由ですが、今回はテストなので、永久トークンを使用します。

本番運用する際には、都度リフレッシュトークンから、アクセストークンを取得するようにします。

https://www.wrike.com/frontend/apps/index.htm

取得されたデータは以下の通りだと仮定します。

永久トークン：ABCDEFGHIJKLMNOPQRSTUVWXYZ

指定フォルダのフォルダIDを取得する

Web画面からフォルダIDを探せなかったので、APIを使って取得します。

curl -g -X GET -H 'Authorization: bearer ABCDEFGHIJKLMNOPQRSTUVWXYZ' 'https://www.wrike.com/api/v4/folders'

    {
      "id": "IE・・・・・・・Z",
      "title": "フォルダ名",
      "childIds": [],
      "scope": "WsFolder",
      "project": {
        "authorId": "・・・・・",
        "ownerIds": [
          "KUA・・・・・",
          "KUA・・・・・",
          "KUA・・・・・",
          "KUA・・・・・"
        ],
        "status": "Completed",
        "customStatusId": "・・・・・",
        "createdDate": "2019-07-19T09:28:42Z",
        "completedDate": "2021-07-20T05:33:21Z"
      }
    }

フォルダIDをは、"id"です。ここでは”IEZ”としておきます。

対象フォルダを対象にwebhookを作成する

先ほど作成したAzure FunctionsのURLを使って、webhookを作成します。

curl -g -X POST -H 'Authorization: bearer ABCDEFGHIJKLMNOPQRSTUVWXYZ' -d 'hookUrl=https://xxxxxxxx.azurewebsites.net/api/get_postData' 'https://www.wrike.com/api/v4/folders/IEZ/webhooks'

webhookを確認する

webhookの一覧を取得します。

curl -g -X GET -H 'Authorization: bearer ABCDEFGHIJKLMNOPQRSTUVWXYZ' 'https://www.wrike.com/api/v4/webhooks'

{
  "kind": "webhooks",
  "data": [
    {
      "id": "・・・・・",
      "accountId": "・・・・・",
      "folderId": "IEZ",
      "hookUrl": "https://xxxxxxxx.azurewebsites.net/api/get_postData",
      "recursive": false,
      "status": "Active"
    }
  ]
}%

ローカルテスト

ローカルから任意のデータをPOST/GETする

vscodeに「.http」の拡張子のファイルを作成し、以下のような内容とします。

GET https://xxxxxxxx.azurewebsites.net/api/get_postData
Content-Type: application/json

{
    "name": "てすと"
}

このファイルを開くと、上段に小さく「Send Request」が表示されるので、こちらをクリックします。

Azureでログを見る

関数アプリから対象のアプリの概要を視ると、右下に「モニター」が表示されているので「呼び出しのトレース」から、ログをクリックします。予定通り、GET時に送った「name:てすと」が表示されていることを確認します。

Wrikeからのテスト

対象フォルダ内にあるチケットを有効から完了、完了から有効へと状態を変化させます。先ほどと同じようにWrikeから送信されたログが表示されていることを確認します。