プログラミング不要でChatGPTのLINEボットを作る

色々な方が既に紹介されているかと思いますが、過去に開催したChatGPTハンズオンの資料を共有します。

対象　プログラミング知識が無い方

お仕事や学校で、日常的にマニュアルなどを見ながらPC利用されている方であれば、手順通りにできるかと思います。

できること

（１）プログラミングの知識が無い方でも、ChatGPTとLINEで会話できるLINEチャットボットを作成する体験ができます。

（２）ChatGPTは役割や前提情報をうまく入力できると、非常に良い回答をするようになります。
役割や前提情報を上手に記載できる技術があれば、ChatGPTなどの生成AIを有効に使えることが身近なLINEを使って直感的に理解できます。
※スクリプトエンジニアリング　と呼ばれる、これから必要と言われている技術です

必要なもの

・ChatGPT APIのAPI Key と Organization ID
　OpenAIのホームページから利用申請
　申請後、承認まで数週間かかることがあります（記事作成時点）
・make の利用登録（以前のサービス名は integromat）
　make のホームページで無料ユーザー登録
・LINE公式アカウント
　LINE for Business

想定時間 15分～90分

事前に必要なアカウント作成や利用申請が承認され、準備ができていること。
プログラミング知識が無い方：細かな補助付きで90分程度
アプリ開発経験者：30-60分程度
現役開発者、API連携など経験者：15-30分程度

ご注意

（１）課金
記事作成時点(更新2023.1）では、数回の動作試験程度なら各サービスの無料プラン内となります。
ただ、課金が発生する認識が無いままでLINEボットを継続利用したり、公開して利用されてしまうと高額な請求になる可能性があります。

（２）事前に利用申請やアカウント作成を行ってください
ChatGPTのAPI利用申請は、申請後に数週間必要な可能性があります(記事作成時点)。

（３）知識のない方は、絶対に一般公開しないこと
運用するためにはセキュリティや、管理作業と利用料金などコストやリスクに対応できる必要があります。これは、初心者では無理かと思われます。
ChatGPTを利用したシステムへの攻撃が多く発生しており、費用請求につながる可能性もあります。
開発体験に留め、動作の確認後は利用したAPIの削除やサービス停止などを必ず行ってください。

補足

ChatGPTを組込んだアプリ開発を楽にしてくれるツールは色々とありますので。
今回、プログラミングの知識がない方、これから学習される学生向けに、最近注目されている make（旧 Integromat）という、異なるツール同士をプログラミング不要で連携できるツール（ノーコードツール）版に書き直しました。

AIボット開発や会話の調整などは膨大なお金や知識が必要になります。
今回、そこは全てChatGPTにお任せして、十分な機能とは言えませんが、日常的に使っているLINEで使える「アプリ作れた感」が演出できます。
私は「作ったものが動く」体験から、ChatGPTなどのAI研究やIT技術全般に興味を持つ方、特に学生が増えたら良いなと思います。

ボットの動作（担当するツールと、その役割）

	担当	役割
↓	LINE	LINEへの書き込みを検知し、makeへ送信
↓	make	LINEへの書込み内容を受取
↓	make	役割や前提情報※、LINEへの書込み内容をChatGPTへ送信
↓	ChatGPT	回答を作成、makeへ送信
↓	make	ChatGPTの回答をLINEへ送信
↓	LINE	ChatGPTの回答をLINEに表示
最初に戻る	LINE	LINEへの書き込みを待つ（最初から繰り返し）

※スクリプトエンジニアリングの部分

事前準備

ChatGPT API のAPIキーを入手

ChatGPT APIのAPI Key と Organization IDが必要になります。
(GPT-4のAPI利用申請は不要です。利用申請が承認された時点で利用できるgpt-3.5-turboで動かします)
OpenAIのホームページから利用申請
申請後、承認まで数週間かかることがありますので注意してください。（記事作成時点）

少し下にあるGet started　のリンクから進んで下さい。

LINE公式アカウント LINE for Businessアカウントを作成

LINE for Business

新規プロバイダーを作成します。

LINEのチャネルを作成します。

後で認証を行う　を選択し、管理画面に戻ってください。

内容をよく読んで、ボタン「同意」をクリックしてください。２つ程度。

ホーム　の右上にある「設定」をクリックします。

左側のメニュー「Messaging API」＞ボタン「Messaging APIを利用する」を押す

作成済のプロバイダーを選択します。

記入せずにボタン「OK」を押す。

この画面になればLINEの準備は完了です。

プロフィール画像を設定したい場合は、左端のメニュー「アカウント設定」　＞　基本設定　プロフィール画像　から登録することができます。

make のユーザー登録

make のホームページで無料ユーザー登録した後、登録したメールアドレスにVerifyのメールが届きます。
ボタン「Verify email」を押せば、make にログインできるようになります。

make ログイン直後の画面

ChatGPTのLINEボットを作る

ここからは、準備した環境を利用して、LINEボットを作ります。
【make】【ChatGPTAPI】【LINE】の３つの画面を、切り替えながら（ログインしながら）の作業になります。

【LINE】LINEへの書込み内容を受取

LINE で必要な設定を行い、Channel Access Token　を発行します。
Channel Access Tokenは【make】が【LINE】と連携することを許可するためのものです。

LINE Developersにログインし、コンソールを開きます

Messaging API設定　の　下の方にある　応答メッセージ　の　「編集」を左クリックします。

WebだけON、他はOFFにします。

以下、場所がわからない場合は再度、LINE Developerのコンソールを開きなおしてください。

Messaging API設定　の　下の方にある　チャネルアクセストークン（長期）の　ボタン「発行」を左クリックします。

チャネルアクセストークン（長期）の右にあるアイコンを左クリックしてコピーします。

【make】LINEへの書込み内容を受取

make　で「LINEへの書込み内容を受取」するための処理を作ります。
make でシナリオを作成し、LINEボットがChatGPTと連携して動作するようにします。
make　はプログラミングの知識が無くても、複雑な処理を作成することができます。
make にログインします。

右上の「＋」ボタンを押し、New scenario （新しいシナリオ）を作成します

左クリックします。

画面下のボタンを押して、保存しておきます

【LINE】からチャネルアクセストークン（長期）をコピーし、貼り付けます。
ボタン「Save」を左クリックします。

Copy adress to clipboard　を左クリックします。
必要なら、メモ帳などに保存しておいてください。
ボタン「OK」を左クリックし、画面下のボタン「Save（保存）」を左クリックします。

【LINE】LINEへの書込み内容を受取

LINE に Webhook URLを設定します。
Webhook URLは【LINE】が【make】と連携することを許可するためのものです。

LINE Developersにログインし、コンソールを開きます

Messaging API設定＞　Webhook設定＞　Webhook URL　の「編集」を左クリックします。

【make】でコピーしたものをペーストします。
ボタン「更新」を左クリックします。

【make】LINEへの書込み内容を受取

ここまでの作業が上手く出来たか、動かして確認します。
make にログインします。

make　で「Run Once（一回だけ実行）」ボタンを押し、LINEからの通知を受け取れるようにしておきます。

【LINE】LINEへの書込み内容を受取

LINE から Webhook URLを検証します。
LINE Developersにログインし、コンソールを開きます

Messaging API設定＞　Webhook設定＞　Webhook URL　の「検証」を左クリックします。

成功　が表示されたらOKです。
上手くいかない場合は、今までの手順を確認してください。
まれに、make側でWebhook URLが変わっていることがあります。
makeのLINEアイコンを左クリックし、再度、Copy adress to clipboardを押してLINEのWebhook URLを編集することも試してみてください。

成功　と表示されれば、LINEへの書込み内容を(makeが)受取できるようになっています。
実際にLINEから書込みしたものがmakeへ届くか確認します。
LINE Developersにログインし、コンソールを開きます
Messaging API設定＞　QRコード　を使って、LINE公式アカウント（ボット）を友達として追加しておいてください。

【make】LINEへの書込み内容を受取

先ほどの試験と同様、make　で「Run Once（一回だけ実行）」ボタンを押し、LINEからの通知を受け取れるようにしておきます。
2回目以降の実行では「 wait for new data（LINEからの新しいデータを待つ）」を左クリックするようにしてください。

友達登録したLINEアプリから、書込みを行ってみて下さい。

しばらく待つと、以下の画面になります。
右上に1が表示されますので、その部分を左クリックするとmakeがLINEから受け取ったデータを確認することができます。
本来はプログラミングが必要な処理がmakeによって簡単に実現することができました。

【ChatGPT】LINEへの書込み内容を受取

ChatGPT APIのAPI Key と Organization IDを確認しておきます。
[ChatGPT API にログインします。]((https://openai.com/api/)

どちらもログイン後、画面右上のメニューから表示します。
次の手順で必要ですので、メモ帳などにコピーしておいてください。

・API Key

必要な方はAPI Keyを作成してください。

・ Organization ID
APIの利用登録時に付与されています。

【make】役割や前提情報、LINEへの書込み内容をChatGPTへ送信

LINEへの書込み内容を、ChatGPTへ送信する処理をmakeで作成していきます。
make にログインします。

ChatGPT APIのAPI Key と Organization IDを入力し、ボタン「Save」を左クリックしてください。

Select Method を Create a Chat Completion に変更すると記入欄が変わります。

Messages　は　Item 1から3まで、add itemを左クリックし、下記のように追加してください。
この部分の記載を変えることで、ChatGPTの回答やその性能が変わります。（プロンプトエンジニアリング）
上手く動いたら、各自で修正して色々試してみてください。

Item	Role	Message Content
1	System	あなたはレストランの従業員です。お客様からの問合せや予約の相談に対して丁寧に応答します。
2	Asisstant	現在、お客様が大変多く来られており、事前の予約をお勧めしています。予約は希望の日時・人数・駐車台数・お名前・電話番号を伺い、後ほどオーナーシェフから、お電話でご連絡させて頂きます。
3	User	表示されるウインドウ内の Text(LINE > Events[] > Message > Text)をドラッグする