LINE アプリで簡単に作れる AI チャットボット！ ChatGPT 連携

1. OpenAI の設定

1-1. アカウント作成

「Create your account」画面にアクセスし、OpenAI のアカウントを作成

1-2. ログイン

「Create your account」画面にアクセス後、「Log in」リンクをクリックし、ログイン画面を表示後、ログインを実施

1-3. 「API Keys」画面に遷移

右上の「Personal」をクリック後、「View API keys」をクリックし、「API kyes」画面に遷移

1-4. 「Create new secret key」ダイアログを表示

「+ Create new secret key」をクリックし、「Create new secret key」ダイアログを表示

1-5. secret key の発行

「Name」に「hands-on」と入力し、「Create secret key」ボタンをクリック

1-6. 「secret key」をコピー

「Create new secret key」ダイアログに表示された「コピー」ボタンをクリックし、「secret key」をコピーし、「Done」ボタンをクリック
※コピーした secret key をテキストエディターにペーストしておいてください

2. LINE Messaging API の設定

2-1. LINE Business ID の作成

以下のリンクにアクセスし、LINE Business ID のアカウントを作成してください
https://account.line.biz/login?redirectUri=https%3A%2F%2Fmanager.line.biz%2F

2-2. LINE Developers ID ログイン画面を開く

以下のリンクの「LINE アカウントでログイン」ボタンをクリックし、ログイン画面を開く
https://account.line.biz/login?redirectUri=https%3A%2F%2Fdevelopers.line.biz%2Fconsole%2F

2-3. ログイン

「LINE アカウントでログイン」をクリック後、「メールアドレス」「パスワード」を入力し、「ログイン」ボタンをクリック

※スマートフォンの LINE アプリ上で画面に表示された認証番号を入力する必要があります。

2-4. 「新規プロバイダー作成」ダイアログを表示

プロバイダーの「新規プロバイダー作成」ボタンをクリックし、新規プロバイダー作成ダイアログを開く

2-5. 新規プロバイダーを作成

「プロバイダー名」に「hands-on」を入力し、「作成」ボタンをクリック

2-6. 新規チャネル作成画面を開く

「Messaging API」をクリック

2-7. 新規チャネルを作成

必須項目を入力して「作成」ボタンをクリックし、確認ダイアログを表示し、「OK」ボタンをクリック
※確認ダイアログが 2 回表示されますが、中身を読んだ上で「確認」ボタンをクリック

入力項目	入力値
会社・事業者の所在国・地域	日本
チャネル名	hands-on
チャネル説明	ChatGPT hands-on
大業種	飲食店・レストラン
小業種	カフェ・喫茶店
メールアドレス	（個人のメールアドレスを入力してください）
LINE 公式アカウント利用規約 の内容に同意します	チェックボックス On
LINE 公式アカウント API 利用規約 の内容に同意します	チェックボックス On

2-8. チャネル作成完了

チャネルの作成が完了

2-9. 友達追加

「Messaging API 設定」タブをクリックし、QR コードを表示し、スマホの LINE アプリで友達追加をしておいてください

2-10. 「応答設定」画面を開く

「LINE 公式アカウント機能 > 応答メッセージ > 編集」リンクをクリックし、「応答設定」画面を開く
※新しい画面「LINE Official Account Manager」が開きます

2-11. 「応答設定」

「LINE Official Account Manager」画面にて応答設定を実施後、画面を閉じてください

入力項目	入力値
チャット	Off
あいさつメッセージ	Off
Webhook	On
応答メッセージ	Off

2-12. 「チャネルアクセストークン」の発行

「LINE Developers」画面の「Messaging API 設定」タブを開き、「チャネルアクセストークン > 発行」ボタンをクリック

2-13. 「チャネルアクセストークン」のコピー

発行された「チャネルアクセストークン」をコピーして、テキストに貼り付けておいてください

3. make の設定

3-1. make アカウントの作成

以下のリンクにアクセスし、make のアカウントを作成してください
https://www.make.com/en/register

3-2. make にログイン

以下のリンクにアクセス後、「Email」「Password」を入力し、「Sign in」ボタンをクリック
https://www.make.com/en/login

3-3. scenario の作成

「Create a new scenario」ボタンをクリックし、 「New scenario」画面を開く

3-4. LINE application の追加

「+」ボタンクリック後、検索フォームに「LINE」を入力し、「LINE」を選択

3-5. 「Watch Events」 の追加

「Watch Events」をクリック

3-6. 「Webhook」 の追加

「Webhook」ダイアログの「Add」ボタンをクリック

3-7. 「Webhook」 の作成

「Create a webhook」ダイアログの「Webhoook name」に「hands-on」と入力し、「Connection」の「Add」ボタンをクリック

3-8. 「connection」 の作成

「Create a connection」ダイアログの「Connection name」に「hands-on」と入力し、「Channel Access Token」に【「チャンネルアクセストークン」のコピー】でコピーしたチャネルアクセストークンを貼り付けて「Save」ボタンをクリック

3-9. 「webhook」 の作成

「Create a webhook」ダイアログで「Connection」に「hands-on」が設定されているのを確認し、「Save」ボタンをクリック

3-10. 「Webhook address」のコピー

「LINE」ダイアログの「Copy address to clipboard」ボタンをクリックし、「address」をコピーし、テキストに貼り付けておいてください。貼り付けが終わったら「OK」ボタンをクリックして「LINE」ダイアログを閉じてください

3-11. 「make」を一時保存

「Save」ボタンをクリックし、make を一時保存

4. LINE から make の連携設定

4-1. Webhook 設定

「LINE Developers」画面の「Messaging API 設定」タブの「Webhook 設定 > 編集」ボタンをクリック後、入力欄に【「Webhook address」のコピー】でコピーしたアドレスを貼り付けて「更新ボタン」をクリック

4-2. Webhook 検証

「make」画面で「Run Once」ボタンクリック後、「LINE Developers」画面に戻り「Messaging API 設定」タブの「Webhook 設定 > 検証」ボタンをクリックし、「成功」ダイアログが表示されることを確認
「make」画面に戻り、LINE アイコンの右上に「1」が表示されることを確認
「LINE Developers」画面に戻り「Messaging API 設定」タブの「Webhook 設定 > webhook の利用」ボタンを On に変更

4-3. LINE よりメッセージ送信

「make」画面で再度「Run Once」ボタンクリック後、【友達追加】で追加したチャットボットアカウントに LINE でメッセージを送信し、「make」画面で LINE アイコンの右上に「1」が表示されることを確認

5. make から openai の連携設定

5-1. module 追加

「make」画面で「LINE」アイコン横にカーソルを移し、表示された「+ Add another module」ボタンをクリック

5-2. HTTP モジュール選択

検索フォームに「http」と入力し、「HTTP」モジュールを選択

5-3. Make a request モジュール選択

ACTIONS より「Make a request」モジュールを選択

5-4. HTTP モジュールの設定（その 1）

以下の値を入力

入力項目	入力値
URL	https://api.openai.com/v1/chat/completions
Method	POST

5-5. HTTP モジュールの設定（その 2）

以下の値を入力

入力項目	入力値
Headers > item1 > Name	Content-Type
Headers > item1 > Value	application/json
Headers > item2 > Name	Authorization
Headers > item2 > Value	Bearer {OpenAI で発行した API キー}

5-6. HTTP モジュールの設定（その 3）

以下の値を入力し、「OK」ボタンをクリック

入力項目	入力値
Body type	Raw
Content type	JSON (application/json)
Request content	{"model": "gpt-3.5-turbo","messages" : [{"role": "system","content": "あなたは大阪府箕面市森町中にある喫茶店「森のひととき」の店長です。常に明るく元気に丁寧に返信してください。お店の営業時間は AM9:00〜PM18:00。休業日は水曜日。受信メッセージに SHINMACHI が含まれる場合は返信内容に「クーポンをお知らせします！12345」を文末または文頭に含めてください。"},{"role": "user","content": "{{1.events[].message.text}}"}]}
Parse response	Yes

5-7. openai へのメッセージ送信検証

「make」画面で「Run Once」ボタンクリック後、LINE からメッセージを送信し、「LINE」アイコン、「HTTP」アイコンの右上に「1」が表示されることを確認

6. make から LINE の連携設定

6-1. module 追加

「make」画面で「LINE」アイコン横にカーソルを移し、表示された「+ Add another module」ボタンをクリック

6-2. 「LINE > Send a Reply Message」の選択

「LINE > Send a Reply Message」を選択

6-3. 「Send a Reply Message」の設定

以下の値を入力し、「OK」ボタンをクリック

入力項目	入力値
Connection	hands-on (hands-on)
Reply Token	{{1.events[].replyToken}}
Messages > item1 > Type	Text
Messages > item1 > Text	{{2.data.choices[].message.content}}

6-4. openai アプリの送信検証

「make」画面で「Run Once」ボタンクリック後、LINE からメッセージを送信し、応答が LINE で返ってくることを確認

7. openai API の各種パラメータについて

7-1. 概要

openai の API を呼び出す際、以下のようなパラメータを設定しています。

{
    "model": "gpt-3.5-turbo",
    "messages": [
        {
            "role": "system",
            "content": "You are a helpful assistant."
        },
        {
            "role": "user",
            "content": "Hello!"
        }
    ]
}

基本的には以下のページに詳細が記載されています
https://platform.openai.com/docs/api-reference/introduction

7-2. model

model には 利用するモデル名を設定します
※例）gpt-4, gpt-3.5-turbo

7-3. messages

messages は role、content を指定することで、実際の質問文、応答する際の役割などを設定することができます

role の種類	content に設定する値
user	ユーザからの質問を設定
system	応答時の制約を設定（丁寧に答えてくれとか、〜〜〜の選択肢の中からだけ回答してくれとか）
assistant	今まで openai api からの回答を設定することで文脈を踏まえて回答できるようにしてくれる

7-4. temperature / top_p

回答のランダム性を設定します。

temperature (0〜2)

0: 毎回同じ回答を返す
2: よりランダムに回答を返す

top_p (0〜1)

0.1: 確率の高い上位 10%の候補から選択された回答を返す

7-5. n

応答ごとに生成する候補の数
指定した数分の応答を生成するので、トークンをより多く消費します

7-6. stream

設定すると、ChatGPT と同様に部分的な応答が送信されます。 トークンは、使用可能になると data-only server-sent イベントとして送信され、ストリームは data: [DONE] メッセージで終了します

7-7. max_tokens

生成された回答に許可されるトークンの最大数
既定では、モデルが返すことができるトークンの数は (4096 - プロンプト トークン) になります

7-8. frequency_penalty

-2.0 から 2.0 の数値
値を正にすると、これまでのテキストに存在する頻度に基づいて新しいトークンにペナルティが課せられ、モデルが同じ行を逐語的に繰り返す可能性が低下

7-9. presence_penalty

-2.0 から 2.0 の数値
正の値を指定すると、これまでのテキストに出現するかどうかに基づいて新しいトークンにペナルティが課せられ、モデルが新しいトピックを扱う可能性が高まる