見出し画像

ChatGPTを使ったLINE Botの作成方法。Gasを使って手軽に始めよう

こちらの記事では、ChatGPT APIを使ってLINE Botを作成する方法を紹介します。作成にはプログラミング言語の1つであるGas(Google Apps Script)を使用します。

無料枠ではLINE Botを作って、Chat GPTとやり取りできるところまでご紹介します。
有料枠では前回のやり取りを残すことで制度をあげるコードを紹介しています。

Chat GPT APIを取得するにはChatGPTに登録をしておく必要があります。
Chat GPTのバージョンは「gpt-3.5-turbo」を使用します。

LINE Bot作成までの流れを紹介

  1. LINEの設定

    • LINE Developers に登録

    • プロバイダーを作成

    • LINE チャンネルの設定

    • Messaging API設定

    • 応答設定

    • LINE友達追加

  2. Chat GPTのAPI keyを取得

    • Chat GPT の登録がまだな方は登録(Sign up)する必要有り

    • Chat GptのAPIシークレットキーを発行

  3. Gasの設定

    • 新しいプロジェクトを作成

    • LINEとChat GPTのやり取りをするGasのコードを書く

    • デプロイしてウェブアプリ URLを発行

  4. LINEのWebhook設定

    • Gasのウェブアプリ URLを設定

  5. LINEを送信して回答が返ってくることを確認

LINEの設定

LINEアカウントの開発用の LINE Developers に登録します。

LINEチャンネルの作成

まずはプロダクトから「Messaging API」を選択します。

「今すぐはじめよう」をクリックします。

チャンネル設定をしていきます。
チャンネルの種類が「Messaging API」なのを確認しましょう。

プロバイダーをすでに作成済みの方はそちらを選択してください。
プロバイダーがない方は「新規プロバイダー作成」を選択します。
例として「きのこカンパニー」としています。
お好みでつけてください。
プロバイダー名は自分自身や所属する組織の名前を使うことが一般的だそうです(Chat GPTさんに聞きました)。

残りも設定していきましょう。以下は設定の例です。

会社・事業者の所在国・地域: 日本
チャンネルアイコン: (任意)
チャンネル名: Chat GPT(このチャンネル名がBot名になります)
チャンネル説明: Chat GPT(どんなBotかの説明を入れておきましょう)
大業種: 個人(自分の業種に合わせて選択してください)
小業種: 個人(IT・コンピュータ)(自分の業種に合わせて選択してください)
メールアドレス: 自分のメールアドレスを入力
プライバシーポリシーURL: (任意)
サービス利用規約URL: (任意)

LINE公式アカウント利用規約LINE公式アカウントAPI利用規約
確認して同意して、「作成」ボタンをクリックしましょう。


「以下の内容でMessaging APIチャンネルを作成しますか?」と表示されるの、自分で設定した内容に間違いがないかを確認して「OK」をクリックしましょう。


「情報利用に関する同意について」が表示されるので
内容を確認して「同意する」をクリックします。

続いて「ZHDグループへの情報提供に関する個別規約への同意について」が表示されるので文章を下までスクロールして「同意する」をクリックします。

これでLINEチャンネルが作成できました。

Messaging API設定

Messaging API設定のタブに移動します。

QRコードとボットのベーシックIDが出てくると思います。
どちらかを使って「LINEの友達追加」をしておきましょう。

Webhook設定はGasコードを書いてデプロイ後に設定します。

応答メッセージの「編集」をクリックします。

別タブが開いて「応答設定」ページに移動します。
以下のように設定しましょう。

チャット: オフ(自分でメッセージを返す場合がある場合はオン)
あいさつメッセージ: オフ(友達登録後の最初のメッセージ)
Webhook: オン(最初はオフになっているのでオンに変更)
応答メッセージ: オフ(Chat GPTの返答を返すのでここはオフに変更)

設定が終わったら、元のMessaging API設定のタブに戻ります。
チャンネルアクセストークンを「発行」しましょう。

チャンネルアクセストークンはGasのコードで必要になりますのでメモ帳などにコピーしておきましょう。※1

Chat GPT APIを取得

Chat GPTの登録がまだな方は登録(Sign up)する必要があります。

Chat GPT のAPI keyを取得しましょう。
Create new secret key」をクリックするとAPI keyが表示されます。


Chat GPTのシークレットキーは後からは表示されなくなります。
Gasコードで使うのでメモ帳などにコピーしておきましょう。※2

シークレットキーが分からなくなった場合は再度発行してもらえれば大丈夫です。

Chat GPTの気になったことをメモしておきます。

  • Chat GPTに登録から3ヶ月以内なら無料枠が$18ある

  • 無料枠以上はクレジットカードを登録して課金されていく

  • 利用上限金額の設定も可能

  • 文字数をトークンとして扱い、トークン量に応じて課金されていく

  • 思った以上に価格は安いと思う

  • 無料枠$18があるのでそれを使ってみてからどうするか考えても良さそう

Gasの設定

プロジェクト作成

Gasのホーム を開きましょう。

「+新しいプロジェクト」をクリックしてプロジェクトを作成します。

「無題のプロジェクト」から「ChatGpt-LINE-Bot」みたいな分かりやすい名前に変更しましょう。(任意)
「コード.js」も「main.gs」と変更しておきました。(任意)


Gasコード

このGasコードがLINEからメッセージを受け取り、Chat GPTに質問し、回答を得て、LINEに返答するような中継する役割を担います。

元々書かれている「function myFunction() { } 」は削除して、
以下のコードを貼り付けます。


const LINE_CHANNEL_ACCESS_TOKEN = "LINEチャンネルアクセストークン";
const CHAT_GPT_API_KEY = "ChatGPTシークレットキー";

/**
 * LINEメッセージ トリガー
 */
function doPost(e) {
  var lineEvent = JSON.parse(e.postData.contents).events[0];
  var lineReplyToken = lineEvent.replyToken;
  var lineMmessage = lineEvent.message;
  var lineMmessageText = lineMmessage.text;

  if (lineMmessageText === undefined) {
    // 絵文字・スタンプ・画像・動画・音声の場合
    var replyMessage = "サポートされていません。\n申し訳ありません。";
    replyToLineMessage(lineReplyToken, replyMessage);

    return createResponse();
  }
  var messages = createChatGptMessages(lineMmessageText);
  var chatGptAnswer = fetchChatGptResponse(messages);
  replyToLineMessage(lineReplyToken, chatGptAnswer);

  return createResponse();
}

/**
 * 成功した場合に返すJSON形式のレスポンスを作成
 */
function createResponse() {
  return ContentService.createTextOutput(
    JSON.stringify({"content": "post ok"})).setMimeType(ContentService.MimeType.JSON);
}

/**
 * ChatGPT APIに質問し応答を返す
 */
function fetchChatGptResponse(messages) {
  var payload = {
      "model": "gpt-3.5-turbo",
      "messages": messages
  };
  var options = getChatGptOptions(payload);

  var apiUrl = "https://api.openai.com/v1/chat/completions"

  Logger.log("ChatGPT APIに質問します");
  var response = UrlFetchApp.fetch(apiUrl, options);
  Logger.log("ChatGPT APIから回答がきました");

  var jsonResponse = JSON.parse(response.getContentText());
  var answer = jsonResponse["choices"][0]["message"]["content"].trim();

  return answer;
}

/**
 * ChatGPTへ送信する用のOptions取得
 */
function getChatGptOptions(payload) {
  return {
    "method": "post",
    "headers": {
      "Content-Type": "application/json",
      "Authorization": "Bearer "+ CHAT_GPT_API_KEY
    },
    "payload": JSON.stringify(payload)
  }
}

/**
 * LINEメッセージ送信
 */
function replyToLineMessage(replyToken, message) {

  var payload = {
    "replyToken": replyToken,
    "messages": [{"type": "text", "text": message,}]
  };

  var options = {
    "method": "post",
    "headers": {
      "Content-Type": "application/json; charset=UTF-8",
      "Authorization": "Bearer " + LINE_CHANNEL_ACCESS_TOKEN,
    },
    "payload": JSON.stringify(payload),
  };

  var url = "https://api.line.me/v2/bot/message/reply";
  UrlFetchApp.fetch(url, options);
}

/**
 * chat GPT用の messages 作成
 */
function createChatGptMessages(question) {
  var systemContent = getChatGptSytemContent();
  return [
    {"role": "system", "content": systemContent},
    {"role": "user", "content": question}
  ]
}

/**
 * ChatGptの回答設定
 */
function getChatGptSytemContent() {
  var content = `
    あなたは「猫」として回答してください。
    一人称は「吾輩」にしてください。
    誓約:
    語尾に「にゃ」を付けてください。
    会話の途中で、「。」がつく場合はそこにも「にゃ」を付けるようにしてください。
    
    口調例:
    おはようにゃ
    ごめんにゃ
    いい天気だにゃ
    吾輩は猫にゃ
    言ってることがよく分からないにゃ。もう一度説明をお願いしたいにゃ。
  `;
  return content;
}

コードの書き換えが必要な箇所は「LINE_CHANNEL_ACCESS_TOKEN」と「CHAT_GPT_API_KEY」の2箇所です。
※1 と※2 の部分でメモ帳にコピーしておいたものに書き換えてください

const LINE_CHANNEL_ACCESS_TOKEN = "LINEチャンネルアクセストークン";
const CHAT_GPT_API_KEY = "ChatGPTシークレットキー";
↓↓↓↓↓
(例)
const LINE_CHANNEL_ACCESS_TOKEN = "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa";
const CHAT_GPT_API_KEY = "bbbbbbbbbbbbbbbbbbbbbbbbbbbbbb";

getChatGptSytemContent() { } という関数の中でChat GPTの設定を組み込めます。
例として猫のようになるような設定を入れています。
お好みで設定を変更してください。
設定が不要な場合は「return content;」の部分を「return "";」と書き換えてください。(ダブルクォーテンションは「"」は半角で、2つです)

/**
 * ChatGptの回答設定
 */
function getChatGptSytemContent() {
  var content = `
  あなたは「猫」として回答してください。
  一人称は「吾輩」にしてください。
  誓約:
  語尾に「にゃ」を付けてください。
  会話の途中で、「。」がつく場合はそこにも「にゃ」を付けるようにしてください。

  口調例:
  おはようにゃ
  ごめんにゃ
  いい天気だにゃ
  吾輩は猫にゃ
  言ってることがよく分からないにゃ。もう一度説明をお願いしたいにゃ。
  `;
  return content;
}

初回のGasコードのデプロイ

後はこちらのコードを使えるように「デプロイ」していきましょう。

右上の「デプロイ」をクリックして、「新しいデプロイ」を選択します。

種類の選択の歯車マークをクリックして、「ウェブアプリ」を選択します。

アクセスできるユーザーを「全員」にして、「デプロイ」をクリックします。

新しいデプロイの「このウェブ アプリケーションを使用するには、データへのアクセスを許可する必要があります。」と表示されたら、「アクセスを承認」をクリックします。

Choose an account(アカウトを選択)と出るので、
自分のアカウントを選択します。

「Google hasn’t verified this app(Googleはこのアプリを検証していません)」と出たら「Advanced」をクリックします。

そして「Go to xxxx-xxxxxx (unsafe)」をクリックします。

「Sign in with Google」が表示されたら、「Allow」をクリックします。

「新しいデプロイ」が表示されたらOKです。
ウェブアプリのURLをコピーしましょう。

ウェブアプリのURLを、LINEのWebhookに設定します。
再度 LINE Developers を開いて、自分の作成した「プロバイダー」、「チャンネル」の順に選択をして、「Messaging API設定」に移動します。

Webhook URLの「編集」をクリックします。

コピーしておいたGasのウェブアプリのURLを貼り付けて「更新」をします。
Webhookの利用を「オン」にします。

このWebhookのURLを設定することでLINEが送られてきた際に、Gasのコードの方にLINEを転送してくれるようになります。

2回目以降のGasコードのデプロイ

コードを変更して修正した場合、
毎回「デプロイ」→「新しいデプロイ」→「デプロイ」をすると、
ウェブアプリURLが新たに発行されるので、そのウェブアプリURLをLINEのWebhook URLを変更する必要があります。

Gasコードについて

関数にはコメントを付けているので、なんとなくでもどんなことをしているのかは分かるかと思います。

よりコードの詳細を知りたい方は Chat GPT さんにコード解説をお願いしてください。
結構コード解説してくれます。
たまにズレた回答もあるかもしれませんが私より優秀なのは間違いないです。

LINE送信

以上でLINEとChat GPTとGasの準備が整いまましたので、
実際に友達追加をしておいたLINEに送信してみましょう。

無事に返信が返ってきたら成功です。

LINEで返信が返ってこない場合

返信が返ってこない場合は、どこかしらの設定がうまくいってない可能性があるので、もう一度記事をみて確認してください。

返信が返ってこない場合の確認ポイントを書いておきます。

  • スタンプであればメッセージが返ってくるか

  • LINE側のWebhookのURLが設定されているか

  • LINE側のWebhookの利用が「オン」になっているか

  • Gasコードの「LINE_CHANNEL_ACCESS_TOKEN」の確認

  • Gasコードの「CHAT_GPT_API_KEY」の確認

  • Chat GPT側でエラーになる場合があるので何度かLINEしてみる

  • Gasコードでのエラー

こちらの記事について何か質問があれば

もし何か気になることや質問などありましたら Twitter のDMからお気軽にお問い合わせください。

ここから有料枠

ここまでの無料枠でもLINEからChat GPTとのやりとりが可能になりますが、有料枠では前回のやり取りの会話を残しておくことで、Chat GPTからの回答の精度を上げるコードを紹介します。
またChat GPT側でのエラー時の対応も含まれています。

コードの行数は無料枠の2倍程度になりますが、自分で調べて実装するために必要な時間を節約でき、手軽に実装することができます。

無料枠で楽しんでいただけた方やぜひ興味のある方は、更なる機能の有料枠をぜひご検討ください。

ここから先は

10,093字 / 5画像

¥ 500

期間限定 PayPay支払いすると抽選でお得に!

この記事が気に入ったらサポートをしてみませんか?