Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Postman Flowsで作るAPI連携LINE Bot
Search
KMiura
November 25, 2024
Technology
0
350
Postman Flowsで作るAPI連携LINE Bot
2024/11/25 Postman API Night Nagoya 2024 Fall
https://postman.connpass.com/event/332171/
KMiura
November 25, 2024
Tweet
Share
More Decks by KMiura
See All by KMiura
運用しているアプリケーションのDBのリプレイスをやってみた
miura55
1
1k
Amazon Rekognitionを使ったインターホンハック
miura55
0
50
Pythonでルンバをハックしてみた
miura55
0
120
あなたの知らないクラフトビールの世界
miura55
0
300
Storage Browser for Amazon S3を触ってみた + α
miura55
0
180
Cloudflare R2をトリガーにCloudflare Workersを動かしてみた
miura55
0
180
あのボタンでつながるSORACOM
miura55
0
110
Lambdaと共に歩んだAWS
miura55
3
760
Bedrock Knowledge baseを使って今年の上半期のニュースを聞いてみた(リベンジ編)
miura55
0
240
Other Decks in Technology
See All in Technology
マップを速く表示するために
tsuboyan5
0
170
令和トラベルQAのAI活用
seigaitakahiro
0
390
Scale Security Programs with Scorecarding
ramimac
0
310
OCI Database Management サービス詳細
oracle4engineer
PRO
1
4.5k
Things you never dared to ask about LLMs — v2
glaforge
1
400
Machine Intelligence for Vision, Language, and Actions
keio_smilab
PRO
0
210
グループ ポリシー再確認 ③
murachiakira
0
140
Oracle Cloud Infrastructure:2025年5月度サービス・アップデート
oracle4engineer
PRO
0
260
AWS LambdaでSocket通信サーバーレスアプリケーションのリアルタイム通信 / 20250523 Kumiko Hennmi
shift_evolve
1
330
【5分でわかる】セーフィー エンジニア向け会社紹介
safie_recruit
0
24k
研究開発部メンバーの働き⽅ / Sansan R&D Profile
sansan33
PRO
3
17k
データ戦略部門 紹介資料
sansan33
PRO
1
3.1k
Featured
See All Featured
RailsConf 2023
tenderlove
30
1.1k
StorybookのUI Testing Handbookを読んだ
zakiyama
30
5.7k
Documentation Writing (for coders)
carmenintech
71
4.8k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Building Applications with DynamoDB
mza
95
6.4k
Code Review Best Practice
trishagee
68
18k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.2k
Making Projects Easy
brettharned
116
6.2k
Scaling GitHub
holman
459
140k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
14
880
Transcript
Postman Flowsで作るAPI連携LINE Bot Koki Miura(@k_miura_io)
自己紹介 • 三浦 耕生(こうき) • Acallのバックエンドエンジニア • JAWS UG名古屋&神戸 運営
• Cloudflare Meetup 名古屋 運営 @k_miura_io koki.miura05
アジェンダ • 自己紹介 • イントロダクション • Postman Flowsについて • LINE
botの紹介 • デモ
API Night Nagoya初開催!
2024年9月 Serverless Days Tokyo
Postman API Night を名古屋に誘致
2日目のワークショップにて
ワークショップ のシナリオ
Postman Flowsを始めて触った
Postman Flowsとは? • Postmanで作成したAPIコレクションのリクエストを組み合わせて ノーコードでワークフローが作成できるツール • 作成したワークフローをWebhookで起動することができる
ん、Webhook?
LINE botって? • LINE上でメッセージのやり取りを行うbot • 自前でWebhookサーバーを立てることでLINE のプラットフォームからWebhookが飛んでくる • サーバーは受け取ったイベントに対してLINE のMessaging
APIを使って返信を行う • Webhookなのでサーバーのレスポンスに決ま りがない
これができる!
というわけで作ってみた • BotのHelloWorld的存在のオウム返しボット • ユーザーが送ったメッセージをそっくりそのまま返す • テキストメッセージ以外(画像、スタンプなど)はオウ ムがえしに対応しないので、そのメッセージも返すよ うにしている
DEMO
全体のフロー
条件分岐 • メッセージの条件分岐にはFQL(Flows Query Language)を使用 • 条件文を記述することで下部のデータの 方向を決める • FQLは独自の言語なので、迷ったら
Snippetsから選択して書き換えるのもあり (この条件もSnippetsを参照)
Webhookのボ ディをAPIのリク エストパラメー タにいれる • リクエストパラメータにWebhookから受け取る値を入 れたいときは、リクエストの中に変数を設定しておく • ここではreplyTokenとmessageを変数として設定して いる
フローから来たJSONから値を取り出す • APIのリクエストで設定した変数に入力され たWebhookから来たJSONを流し込むと変数 が格納される • 各変数に格納したい値をJSONのキーを直 接指定するとその値がリクエストに使われる • CHANNEL_ACCESS_TOKENはコレクション
の変数として設定しているのでここには線を つなげていない
更に改良する • Postmanを使っているので他のAPIと連携したLINE Botにアレンジをしていく(タイトル回収) • GoogleのVision APIと連携してユーザーが送信し た画像に映り込んだロゴの会社を検出するボット にアレンジしていく
全体のフロー
追加で使用しているAPI • 自作API • Vision API
自作API • LINEのAPIで画像取得をするとバ イナリで取得されるため、Flowsで 扱うにはbase64でエンコードしない といけない • Flows内でTypeScriptを使ってエン コードをやろうとしたが、ワークフ ローの規模がでかいのか落ちた
(アップデートに期待) • 仕方なくCloudflare Workersで画像 取得APIを叩いて取得したレスポン スをbase64で返す自前APIを用意
Vision API • よく知られるプロダクトのロゴを画像から検出 するGoogleのAPI • 入力画像をbase64形式で指定できるのが直 感的で、Flows内でリクエストもやりやすい • 右のように検出範囲を画像で出力できるが、
今回は検出したプロダクト名をテキストに返す ように修正
DEMO2
変数を格納 • タスクの出力を他のタスクで使いまわした いときは変数に格納すると確実 • 「Create Variable」ブロックをStartブロック につないでおくことで他のタスクで Webhookのボディを使い回せる
変数を使う • 「Get Variable」ブロックを配置し、使用したいタスクに 向けて線を引くと格納した変数を使い回すことができる • ただフローを流すだけじゃない方法で使いたい値を呼び 出せるので覚えておくと便利!
まとめ • Postman Flowsを使うことでWebhookを使ったイベントドリブンのワーク フローを組むことができる • LINE Messaging APIのようなWebhookのイベントから受け取る値を使う 前提のAPIの動作確認をする時に使える
• 慣れないと変数の扱いとかで詰まるが、そこさえわかってしまえばアイ デア次第でいろんなワークフローを組めるようになるはず
今回紹介したデモの記事 https://bit.ly/3YZCrLj
END