AI
  • #Gemini
  • #Google Apps Script
  • #Line Bot

30分で出来るAIチャットボット - Gemini×LINE Bot導入ガイド

公開日

更新日

30分で出来るAIチャットボット - Gemini×LINE Bot導入ガイド

はじめに

プログラミング初心者でも簡単にできるAIチャットボットの作り方を、画面付きで詳しく解説していきます。
こちらは作成するLINE Botのイメージです。

本記事の目的

GeminiAPIとLINE BOTを連携させたAIチャットボットの実装

事前準備

必要なアカウント、ツールについて
・Google Cloud Platform (GCP) アカウント
 →GeminiのAPIを取得に使用
・LINE Developersアカウント
 →Line Botの作成に使用
・Google Apps Script (GAS)
 →GeminiとLine Botを連携に使用

Gemini APIの設定

Google AI Studioにアクセスし、APIキーの生成を行います。

Googleアカウントでログインし、「APIキーを作成」を押下します。

生成されたAPIはGASでAPI呼び出し時に使用するため、保存しておきましょう。

以上でGemini APIの設定は完了です。

LINE Developersの設定

LINE Developersにアクセスし、LINE Developersの設定を行います。

「コンソールにログイン」を押下すると、以下の画面が表示されますので、「LINEアカウントでログイン」を選択してください。
自身のLINEアカウント情報を入力し、ログインしてください。

「新規プロバイダー作成」を押下し、プロバイダー名を設定します。

プロバイダー作成完了後、サイドメニューに作成したプロバイダー名の項目が表示されます。
画面中央の「Messaging API」を押下し、チャネルの作成を行います。

「LINE公式アカウントを作成する」を押下し、LINE公式アカウントの作成を行います。

※2024/9/4以降からMessaging APIの利用には公式アカウントが必要になりました。
 参考ページ:ニュース: 2024年 の記事 | LINE Developers

LINE公式アカウントの作成に必要な情報を入力し、入力内容に問題がなければ「完了」を押下します。

完了後、自動的にLINEに作成した公式アカウントが追加されます。
このアカウントがGeminiと連携するLINEBotとなります。

次に「LINE OfficialAccount Managerへ」を押下し、作成した公式アカウントの設定を行います。

LINE公式アカウント管理画面の右上にある「設定」を押下します。

サイドメニューの「Messaging API」を選択し、「Messaging APIを利用する」を押下します。

事前に作成したプロバイダーを選択し、「同意する」を押下します。

以上でMessaging APIのチャネルが作成されました。
公式アカウント管理画面での設定は完了です。

LINE Developersに戻り、Messaging APIチャネルが作成されていることを確認します。

「Messaging API設定」を選択し、APIの設定を行います。

Webhook設定の各項目を設定します。
Webhook URL:GASでウェブアプリデプロイ時に生成するため現段階では入力不要です
Webhookの利用:有効化

Line公式アカウント機能の応答メッセージを無効にします。

チャネルアクセストークンを発行します。
発行したチャネルアクセストークンはGASで使用するため、保存しておきましょう。

以上で、 LINE Developersの設定は完了です。

Google Apps Scriptの設定

GoogleDriveでGoogleAppsScriptファイルを作成します。

下記のコードをコード.gsに貼り付けます。
チャネルアクセストークン、GeminiAPIキーは生成した値で差し替えてください。

const LINE_CHANNEL_ACCESS_TOKEN = 'チャネルアクセストークン';
const GEMINI_API_KEY = 'GeminiAPIキー';

//LINEBotにメッセージ送信時起動
function doPost(e) {
  const events = JSON.parse(e.postData.contents).events;
  events.forEach((event) => {
    if (event.type === 'message' && event.message.type === 'text') {
      const replyToken = event.replyToken;
      const userMessage = event.message.text;
      const geminiResponse = getGeminiResponse(userMessage);
      replyToUser(replyToken, geminiResponse);
    }
  });
}

//GeminiAIからレスポンスを取得する
function getGeminiResponse(message) {
  const url = `https://generativelanguage.googleapis.com/v1beta/models/gemini-pro:generateContent?key=${GEMINI_API_KEY}`;
  const payload = {
    contents: [{ parts: [{ text: message }] }]
  };
  const options = {
    method: 'post',
    contentType: 'application/json',
    payload: JSON.stringify(payload)
  };
 
  const response = UrlFetchApp.fetch(url, options);
  const json = JSON.parse(response.getContentText());
  return json.candidates[0].content.parts[0].text;
}

//ユーザへの返信を行う
function replyToUser(replyToken, message) {
  const url = 'https://api.line.me/v2/bot/message/reply';
  const payload = {
    replyToken: replyToken,
    messages: [{ type: 'text', text: message }]
  };
  const options = {
    method: 'post',
    contentType: 'application/json',
    headers: { Authorization: `Bearer ${LINE_CHANNEL_ACCESS_TOKEN}` },
    payload: JSON.stringify(payload)
  };
 
  UrlFetchApp.fetch(url, options);
}

画面右上の「デプロイ」、「新しいデプロイ」を押下します。

デプロイの設定を行います。
種類の選択:ウェブアプリ
アクセスできるユーザー:全員
上記以外の項目はデフォルトで問題ありません。
設定入力後、デプロイを押下します。

デプロイが完了しました。
ここで生成されるウェブアプリのURLをコピーします。
LINE DevelopersのMessaging API設定項目、Webhook URLにウェブアプリのURLを設定します。

以上で、 GASの設定は完了です。

動作確認

LINEトークルームから作成した公式アカウントを選択します。

メッセージを送ると下記のようにGeminiが返答します。

以上でLINEBotの作成完了です。

さいごに

最後まで読んでいただきありがとうございました。
Geminiと会話できるLINE BOTは作成できたでしょうか。
Geminiの部分をChatGPTやClaudeといった異なるAPIに差し替えるような拡張も可能です。
自分だけの特別なLINE BOTを作ってみるのも面白いかもしれません。

以下は簡易的なデータフロー図です。

 

 

SHARE on

この記事を書いた人

ishida

主にシステム開発業務に携わっています。 生成AIを中心に実際に触りながら学び中です。