7
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

Make (旧 Integromat) はとても簡単だった。LINE WORKS の Bot がすぐに出来る。(LINE WORKS API 2.0)

Last updated at Posted at 2022-06-29

Make は簡単で良い

Make (旧 Integromat) を試してみました。

操作が直感的なことと、HTTP Request で OAuth 2.0 が使えることもあり、LINE WORKS API 2.0 を用いた Bot が簡単に出来ました。

この記事ではオウム返し Bot を作成してみます。

LINE WORKS の Bot を追加

Developer Console の設定

LINE WORKS Developer Console にログインします。
https://developers.worksmobile.com/jp/console/bot/view

[Bot] のページで、[登録] ボタンをクリック。
l_1517737_1955_df81352d099d4b5a327a5caaa633e9dd.png

[Bot登録] のページが表示されます。
l_1517737_1956_fc6efb48184fa5553193bd4412d0fe0d.png

以下のとおり、入力します。

Bot名 : 任意の名前
「説明」: 任意の説明文

image.png

"API Interface" : API 2.0
"固定メニュー" は設定しません。

l_1517737_1957_693879f0e21c9cb1dc1b64e0eeb03522.png

"Callback URL" を [On] にします。
以下の URL を入力します。なお、この URL は一時的なダミーです。後で書き換えます。

https://example.com

"メンバーが送信可能なメッセージタイプ" で [テキスト] を選択します。
image.png

[管理者] の [主担当]: 自分の ID を [名前またはメールアドレスを検索] で検索して指定
l_1517737_1967_7f41695af509cb7c42c883fc569e17b5.png

[管理者] の [副担当]: 設定しません。

[保存] ボタンをクリック。
image.png

Bot ID が付与されます。この後の手順で必要なのでメモしましょう。
l_1517737_1958_42f7fb5a1cccbf8c575397a085568f5a.png

管理画面の設定

LINE WORKS の管理画面にアクセスします。
https://common.worksmobile.com/p/admin

Bot 追加

[サービス] - [Bot] のページにアクセスし、[Bot追加] ボタンをクリック。
l_1517737_1959_407c5ba8a154eb4c9aee393e33d7f9c2.png

先ほど作成した Bot を選択して [Bot追加] ボタンをクリック。

l_1517737_1960_9e0f802a56b38b72d64cbd95a8086b76.png

Bot が追加されたら、[前に戻る] をクリック。
image.png

追加された Bot をクリック。
l_1517737_1961_46613f4eb5f398b7894fcf13396d9b5b.png

[修正] ボタンをクリック。

l_1517737_1962_579460db22323d760f6aab54d492827e.png

"使用権限" で [メンバー指定] を選択し、自分を指定。
"公開設定" でトグルスイッチを [On] に設定。
[保存] ボタンをクリック。
l_1517737_1963_248ecae80bd13a4894b6438f6bb80f6d.png

サービス通知トークルーム確認

使用権限で指定したユーザーのサービス通知トークルームに、Bot 追加の通知が届きます。[Botを利用] のボタンをタップ。
image.png

Bot の利用開始

登録した Bot が表示されます。[利用開始] をタップ。
image.png

Bot との 1:1 トークルームが開きます。
image.png

Make の Scenario の作成

Make にサインインし、[Create a new scenario] をクリック。

l_1517737_1997_22ed004a34d3175aeda786941deb79e0.png

「New scenario」 で [+] のアイコンをクリック。

l_1517737_1998_7d63106a7208627a2f754728757f315c.png

「Search」欄で "webhooks" を検索し、表示された [Webhooks] を選択。

l_1517737_1999_94efc4f69fc8534089813595a1336f74.png

「TRIGGERS」の [Custom webhook] を選択。

l_1517737_2000_6c184f7ffbd600b22b638a4636726327.png

「Webhook」の [Add] をクリック。
l_1517737_2001_8f0f8f245c4e963d537e99bf67ac14d5.png

「Webhook name」に任意の名前を指定し、[Save] をクリック。
l_1517737_2002_4f062f398cc5c48df95ced04b94b56ca.png

[Copy address to clipboard] をクリック。生成された Webhook 用の URL がコピーされます。

l_1517737_2003_b725fd8ddc09029ae2d705258e2047ea.png

LINE WORKS Developer Console の Bot 一覧から作成した Bot を修正します。
https://developers.worksmobile.com/jp/console/bot/view

「Callback URL」のダミー値を、コピーした Webhook 用 URL に置き換えて保存。
l_1517737_2004_4c30044d461d7eff5d496cc78b9bee1d.png

Make で作成中の Webhook Trigger は、データ構造の解析のため受信待ち状態です。
l_1517737_2005_64ee1d216f5a30888b28e148eee30092.png

LINE WORKS の Bot のトークルームからメッセージを送信します。

l_1517737_2027_8c39e7d2b54c4a6211a8af18c9f9b7d9.png

正しく処理されました。[OK] をクリック。
l_1517737_2008_054b29b84a31431b58054fcc6709e4da.png

次のアクションを作成するため、[Add another module] をクリック。
l_1517737_2009_40569b048c1bc10cf2679e676a7cd478.png

「Search」欄で "HTTP" を検索し、表示された [HTTP] を選択。

l_1517737_2010_010bf1713270960046843dc8ffc04221.png

「ACTIONS」の [Make an OAuth 2.0 request] を選択。
l_1517737_2011_bc9a581d799ac4cb946e3487c54ca1aa.png

「Connection」の [Add] をクリック。
l_1517737_2012_104548b32def64bc6afb106c7875efc5.png

「Create a connection」で各項目を以下のとおり指定。
[Connection name]

任意の名前

[Authorize URI]

https://auth.worksmobile.com/oauth2/v2.0/authorize

[Token URI]

https://auth.worksmobile.com/oauth2/v2.0/token

[Scope][Item 1]

bot

[Client ID]
LINE WORKS Developer Console の値

[Client Secret]
LINE WORKS Developer Console の値

入力したら、[Save] をクリック。

l_1517737_2014_bae49318d8f5856d33ae090d15a9127f.png

サブ ウィンドウで LINE WORKS の認証画面が開きます。LINE WORKS のアカウントでログインします。

l_1517737_2015_d353d20f3d24f743f567e31902c5ab7f.png

認証が完了したら、続けて Request の設定を行います。
「URI」 は以下のとおり。
{botId} は作成した Bot の botId を指定。
{userId} は、Webhooks の選択肢から souce: userId を指定。

https://www.worksapis.com/v1.0/bots/{botId}/users/{userId}/messages

l_1517737_2016_ed1285f2933241ce778844b1c0c6e8b4.png

「Method」は "POST" を選択。
「Headres」で 「Name」と「Value」を以下のとおり指定。

「Name」

Content-Type

「Value」

application/json

l_1517737_2017_effb0a74d67891d875dc69a95c8bd6ee.png

「Body type」は "Raw" を指定。
「Content type」は "JSON (application/json)" を指定。
l_1517737_2018_2b5f07af6d3ca7a331dc72b24cbd8a56.png

「Request content」は以下を入力。 部分は content: text を選択。

{
  "content": {
    "type": "text",
    "text": "<message>"
  }
}

l_1517737_2019_49aa3618b11fc3decd87a734562bbd3c.png

[OK] をクリック。
l_1517737_2020_2a0d22eb242000ade8456f9e08f0647a.png

Scenario が完成しました。
l_1517737_2021_750e2d4573177d76a2fbeadf06a29fa1.png

Scenario のテスト

[Run once] をクリック。

l_1517737_2028_767d19f063dc5b8a1e2b0d725e332aef.png

LINE WORKS の Bot のトークルームでメッセージを送信し、オウム返しされることを確認します。

l_1517737_2025_70326f5fe5fb5c67b7dcc9d71e21e439.png

テストの状況は LOG で確認できます。
image.png

トリガーとアクションでの処理についても、確認できます。

l_1517737_2023_2a8f2cf239a771375fa6b54e9bf944f6.png

l_1517737_2024_3a652934153b5bf20cd3605a51fd8d14.png

実行

トグル スイッチを [ON] に、「Schedule setting」を [Immediately as data arrives.] に設定し、[Save] アイコンをクリック。

Scenario が保存され、トーク Bot にメッセージが届くごとに実行されます。

7
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?