お嬢様LINEチャットボットを開発いたしましてよ！

※この記事は[KDDI Engineer&Designer Advent Calendar 2022](https://qiita.com/advent-calendar/2022/engineer-designer)の６日目の記事です。

---

最近、高性能AIチャットボットのChatGPTが話題ですが、クラスメソッドさんがそんなChatGPTをLINEチャットボット化する方法をブログで紹介してくれました。

https://dev.classmethod.jp/articles/chatgpt-line-chat-bot/

※ソッコー実践させていただきました。ありがとうクラメソさん！

![スクリーンショット 2022-12-05 22.21.54.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1633856/2ffae43e-b072-6cc7-6749-1ed95e92c719.png)

こちらを応用して、今年流行った @jiro4989 さん作成の[「テキストを壱百満天原サロメお嬢様風の口調に変換するアプリ」](https://github.com/jiro4989/ojosama)のWeb API版を組み合わせることで、お嬢様言葉を返してくれるLINEチャットボットを作ってみました。

![スクリーンショット 2022-12-05 22.10.25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1633856/3e4a85c0-2831-711a-685f-ccd533ea9406.png)

意外とすんなり行かず、つまずく点が多かったため知見を残しておきたいと思います。

![S_gainfriends_2dbarcodes_GW.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1633856/659bbc7f-b370-7d7e-9551-43722d37f199.png)　<a href="https://lin.ee/m3ktSrc"><img src="https://scdn.line-apps.com/n/line_add_friends/btn/ja.png" alt="友だち追加" height="36" border="0"></a>
↑ よければ友だち追加して使ってみてください。バグ発見したらこっそりDMいただけると助かります。笑

:::note info
本記事ならびにプログラムは[jiro4989](https://github.com/jiro4989/ojosama-web#%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%A0%E3%81%AE%E4%BD%BF%E7%94%A8%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6)様、ならびに[ANYCOLOR](https://event.nijisanji.app/guidelines/)様提示の注意事項ならびにガイドラインに則り公開しています。
:::


# 作成の流れ

上記のクラメソさんブログおよび、引用先のYouTube動画にて解説いただいている流れは以下です。（ここでは詳細は割愛します）

- LINE Developersコンソールにログイン
    - 新規プロバイダー＆チャネルを作成
    - 後続のMakeシナリオ内の `LINE > Watch Events` モジュールのWebhook URLを設定

https://developers.line.biz/console/

- Makeアカウントを作成
    - 新規シナリオを作成
    - `LINE > Watch Events` モジュールを作成
        - LINE Messaging APIのチャンネルアクセストークンを設定
    - `HTTP > Make a request` モジュールを作成し接続
        - レスポンスのパースを有効にすること（私ここでハマりました）
    - `LINE > Send a Reply Message` モジュールを作成し接続

https://www.make.com/

- LINEアプリを起動
    - 今回作成された公式アカウントにメッセージ送信し動作確認


# ぶち当たった課題

今回のお嬢様ボット作成にあたり、以下の課題が発生しました。
それぞれの対処法を解説していきます。

1. お嬢様API用にMake HTTPモジュールのカスタマイズが必要
2. 友だち追加やブロック時にエラーになってしまう
3. エラー発生した際、Makeシナリオが停止してしまう
4. エラー発生した際、ユーザーからはボットが無応答のままに見えてしまう


### 1. お嬢様API用にMake HTTPモジュールのカスタマイズが必要

変更すべき箇所は以下です。

- URL
    - [最新のAPIエンドポイント](https://github.com/jiro4989/ojosama-web#%E3%81%8A%E7%9F%A5%E3%82%89%E3%81%9B-20221016)を設定する（Herokuの有償化に伴い、少し前にURL変更となっているため注意）
- Headers
    - ChatGPT用に利用していた `Authorization` Itemは不要のため削除する
- Request content
    - お嬢様APIの仕様に合わせて `{ "Text": "{{1.events[].message.text}}" }` とする

![スクリーンショット 2022-12-06 1.35.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1633856/4faa7f0b-94d4-241e-0564-16a6f6194423.png)


### ２. 友だち追加やブロック時にエラーになってしまう

ChatGPTはあくまでOpenAIアカウントにログインをした各個人ユーザーがAPIキーを用いてプライベートにアクセスするアプリケーションのため、クラメソさんのブログでも公式LINEアカウントのブロックや新規友だち追加といったケースはスコープ外になっていると思います。
今回のお嬢様APIは一般公開されているため、作ったボットを他の人にも使ってもらえるよう「友だち追加」や「ブロック/解除」にも対応してみます。

ここで問題になるのが、フォロー/アンフォロー系の操作をした際にもLINEのMessaging APIへPOSTリクエストが飛んでしまう点です。
このままだと他の人に公式アカウントを教えるたびにエラーでMakeのシナリオが停止してしまいます。

LINEのMessaging APIリファレンスをみると、HTTPリクエストボディのうち `events.type` が `follow` （友だち追加）や `unfollow` （ブロック）のものを無視できればよさそうです。

https://developers.line.biz/ja/reference/messaging-api/#webhook-event-objects

Makeシナリオのモジュール間のコネクターを触ってみると、都合のいいことにフィルター機能というのがあったので使ってみます。

![スクリーンショット 2022-12-06 0.40.00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1633856/c5713859-ef74-aaf9-13f2-87eb773420cc.png)

これで `message` （チャット送信）のWebhookリクエストのみを通過させることに成功しました。


### 3. エラー発生した際、Makeシナリオが停止してしまう / <br>4. エラー発生した際、ユーザーからはボットが無応答のままに見えてしまう

上記の２課題ですが、前述のフィルタリングによりこのチャットボットで発生しうるエラーはカバーできている気がするものの、例えばChatGPT APIの場合はそこそこの頻度でAPI自体が過負荷等によりエラーを吐くことが多かったので、エラーハンドリングを追加しておきます。

設定したのは以下です。
- `LINE > Send a Reply Message` モジュールの追加
- `Ignore` モジュールの追加

いずれもエラーハンドラーとして設定します。
もともと最後尾にあった `LINE > Send a Reply Message` モジュールを右クリックして `Add error handler`　を選択しモジュールを追加していきます。

![スクリーンショット 2022-12-06 0.46.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1633856/7d6f3abb-ae80-b15d-ae0d-912b023d5323.png)

Replyモジュールは、以下のように固定のTextのみを返すよう設定しておきます。
Ignoreモジュールは特に設定項目はありませんでした。

![スクリーンショット 2022-12-06 0.49.29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1633856/2d431412-6e4e-123e-3310-c96528b5ebf6.png)


# まとめ

私はアプリ開発シロートなのですが、「ローコードで簡単開発！」と思っていたら想像以上に色々とハマり、休日をまるまる使ってしまいました。
その分、ローコードといえども学べたことは予想以上に多く、何よりとても楽しかったです！

有益な情報を発信してくれたクラスメソッドさんや、素敵なアプリを公開くださっている @jiro4989 さんには本当に感謝です。

みなさんも是非、色んなWeb APIをLINEチャットボット化してみてください。