【超簡単】ChatGPTのLINEBotを作る方法

AIチャットくんのように、ChatGPTをLINEで使えるBotサービスがでてきていますね。

実はコレ、誰でも簡単に作ることができます。

自分で作ることができれば、例えば、Botに人格を持たせたりと、オリジナル仕様を楽しむことができます。

こちらの記事では、ChatGPTのLINEBotを作る方法について、ご紹介します。

なお、こちらの記事は、以下のサイトを参考にしております。
https://chatgpt-lab.com/n/n55257c082a9d

コードの誤りがありました。
申し訳ございません。
修正したうえで、更新しております。

★作れるもの〜LINEBotのイメージ

LINE上で、質問を投げかけると、Botが答えを返してくれます。

この裏には、ChatGPTがいるので、豊富な知識を流暢な日本語で、返してくれます。

こちらには遊び心で、Botが答えた後に「知らんけど」と言うように設定しています。

★必要なもの

以下の3つのアカウントが必要になりますので、持っていない場合は、事前にアカウント登録していきます。

また、OpenAIのアカウント登録とあわせ、APIキーも取得しておきます。

1. LINE Developerのアカウント
   こちらのサイトから登録できます

2. Googleのアカウント
   こちらのサイトから登録できます

3. OpenAiのアカウント登録とAPIキーの取得
   こちらのサイトからアカウントの登録ができます。

以下のサイトが、アカウントの登録からAPIの取得までわかりやすく解説してくれています。
APIキーは後々使いますので、コピーしておきます。

https://laboratory.kazuuu.net/how-to-get-an-openai-api-key/

APIの利用料金について、使い始めてから3ヶ月は5ドル分まで無料になりますが、5ドル分使い切るか、3ヶ月経過すると有料になります。なお、勝手に課金されることはありません。

★Let's create　作ってみましょう!

1.まずはLINEDeveloperで基本情報を設定

LINEDeveloperでアカウントの基本情報を設定するとともに、チャンネルアクセストークンを取得していきます。

1. こちらのサイトにアクセスします
   

2. 白いコンソールボタンをクリックすると、以下の画面に遷移しますので、緑の作成ボタンをクリックします
   

3. 適当に新規プロバイダー名を入力して、右下の作成ボタンをクリックします。
   

4. 左から二番目の図 Messaging APIをクリックします
   

5. 新規チャネル作成画面に遷移しますので、必須項目（赤※）を入力していきます。チャネルアイコンに好みの画像をアップロードします。一番下の、緑の作成ボタンをクリックします
   

6. MessagingAPI設定のタグをクリックし、一番下の、チャンネルアクセストークンをコピーしておきます。
   

2.GoogleAppsScript（GAS)にコードを書いてURLを取得

GASにLINEBotを動かすために必要なコードを入力していきます。

これまでに取得したLINEのチャンネルアクセストークンや、OpenAIのAPIキーもここで使います。

1. こちらのサイトからGoogleドライブにアクセスします。

すでにGoogleドライブをお持ちの方は、ご自身のGoogleドライブにアクセスしてください。

2. 左上の新規ボタンをクリックし、GoogleAppsScriptを開きます

3. 開くと、このような画面になります

4. 上記で入力されているコードは削除したうえで、以下のコードをコピペして貼り付けます。

LINE_ACCESS_TOKENとOPENAI_APIKEYには、ご自身のものを入力してください

こちらのコードには遊び心で、Botが答えた後に「知らんけど」と言うように設定しています。

const LINE_ACCESS_TOKEN = 'ご自身のLINEのアクセストークンを入力してください';
const OPENAI_APIKEY = 'ご自身のOpenAIのAPIキーを入力してください';

function doPost(e) {
  const event = JSON.parse(e.postData.contents).events[0];

  const replyToken = event.replyToken;
  let userMessage = event.message.text;
  const url = 'https://api.line.me/v2/bot/message/reply';

  if (userMessage === undefined) {
    // メッセージ以外(スタンプや画像など)が送られてきた場合
    userMessage = '？？？';
  }

  const prompt = userMessage;
  const requestOptions = {
    "method": "post",
    "headers": {
      "Content-Type": "application/json",
      "Authorization": "Bearer "+ OPENAI_APIKEY
    },
    "payload": JSON.stringify({
      "model": "gpt-3.5-turbo",
      "messages": [ 
        {"role": "system", "content": `
答えた後に、
知らんけど。を追記してください
        `},
         {"role": "user", "content": prompt}]
    })
  }
  const response = UrlFetchApp.fetch("https://api.openai.com/v1/chat/completions", requestOptions);

  const responseText = response.getContentText();
  const json = JSON.parse(responseText);
  const text = json['choices'][0]['message']['content'].trim();

  UrlFetchApp.fetch(url, {
    'headers': {
      'Content-Type': 'application/json; charset=UTF-8',
      'Authorization': 'Bearer ' + LINE_ACCESS_TOKEN,
    },
    'method': 'post',
    'payload': JSON.stringify({
      'replyToken': replyToken,
      'messages': [{
        'type': 'text',
        'text': text,
      }]
    })
  });
  return ContentService.createTextOutput(JSON.stringify({'content': 'post ok'})).setMimeType(ContentService.MimeType.JSON);
}

5. 右上のデプロイボタンをクリックして、新しいデプロイをクリックすると以下の画面に遷移します。種類の選択でwebアプリを選択し、デプロイをクリックします。

6. こちらのURLをコピーします。

GASについては、こちらのサイトも参考にしてください。
https://www.astina.co/media/1137/

3.最後にLINEDeveLoperにURLを入力

再び、こちらのサイトにアクセスし、コンソール→プロバイダーのページで作成したプロバイダーを選択→チャネル設定のページで作成したプロバイダーを選択→MessaginAPI設定のタグをクリック。

この画面の中段ぐらいに、Webhook設定とあるので、ここに先ほどコピーしたURLを貼り付けます。

そして、更新ボタンを押せば、終了。

さいごに

いかがでしたでしょうか。

スマホでササっと調べ物をしたいときに、このBotは使えますね。

実装も、プログラミング不要で、すごく簡単にできると思います。

ぜひ、ご自身の好みで人格を設定したりして、お楽しみいただければと思います。