ChatGPT API の仕組みの反映

Functions から ChatGPT API につなぐ設定をしたり、今回新しく作った HTTP トリガーが LINE Bot とやりとりできるように LINE Messaging API に Functions でつくったメッセージサーバの URL を教えてあげて、実際にやり取りできるようにします。

コードとテストに戻ります。

コードエディタのコードをすべて選択して以下のコードで上書きします。

// LINE Bot SDK ライブラリの読み込み
const line = require('@line/bot-sdk');

// チャンネルアクセストークンとチャネルシークレット設定
const configLINE = {
    channelAccessToken: 'channelAccessToken',
    channelSecret:  'channelSecret',
};

// LINE Bot SDK ライブラリを呼び出しつつ設定
const client = new line.Client(configLINE);

// OpenAI ライブラリを読み込む
const OpenAI = require("openai");

// OpenAI の ChatGPT API の API キー設定
const configOpenAI = {
    apiKey: 'apiKey',
};

// OpenAI ライブラリを呼び出しつつ設定
const openai = new OpenAI(configOpenAI);

module.exports = async function (context, req) {
    context.log('LINE Bot start...');
    if (req.query.message || (req.body && req.body.events)) {
        if (req.body && req.body.events[0]) {
            // 今回の質問
            const currentMesssage = req.body.events[0].message.text;
            context.log(currentMesssage);
            // ChatGPT API に質問する
            let responseChatGPT;
            try {
                responseChatGPT = await openai.chat.completions.create({
                    model: "gpt-3.5-turbo",
                    messages: [
                        {role: "user", content: currentMesssage}
                    ],
                });
                context.log(responseChatGPT.choices[0].message);
            } catch(e){
                context.log(e);
            }
            // 実際に LINE に返答する処理
            if (req.body.events[0].replyToken) {
                // 返答の 0 番目を取得
                const contentFromChatGPT = responseChatGPT.choices[0].message.content;
                // 返答
                client.replyMessage(req.body.events[0].replyToken, {
                    "type": "text",
                    "text": contentFromChatGPT
                });
            }
        } else {
            context.res = {
                status: 200,
                body: req.query.message
            };
        }
    }
    else {
        // LINE 以外のアクセスだとこちらを返信（ブラウザ確認用）
        context.res = {
            status: 200,
            body: "Hello! ChatGPT + LINE Bot + Azure Functions!"
        };
    };
};

上書きできたら、LINE Bot と ChatGPT の設定を反映します。

// チャンネルアクセストークンとチャネルシークレット設定
const configLINE = {
    channelAccessToken: 'channelAccessToken',
    channelSecret:  'channelSecret',
};

こちらに注目します。

channelAccessToken: 'channelAccessToken',

'channelAccessToken' のところのシングルクオーテーションの中を、今回動かしたい LINE Bot のチャネルアクセストークンに書き換えます。

もし、チャネルアクセストークンが ABCDEFG の場合は、両脇のシングルクオーテーションを 残して書き換えるので 'ABCDEFG' になります。

channelSecret:  'channelSecret',

'channelSecret' のところのシングルクオーテーションの中を、今回動かしたい LINE Bot のチャネルシークレットに書き換えます。

もし、チャネルシークレットが 12345678 の場合は、両脇のシングルクオーテーションを 残して書き換えるので '12345678' になります。

// OpenAI の ChatGPT API の API キー設定
const configOpenAI = {
    apiKey: 'apiKey',
};

こちらに注目します。

apiKey: 'apiKey',

'apiKey' のところのシングルクオーテーションの中を、今回メモしてある ChatGPT API の API キーに書き換えます。

もし、ChatGPT API の API キーが ABCDEFG の場合は、両脇のシングルクオーテーションを 残して書き換えるので 'ABCDEFG' になります。

設定できたらコードを保存します。

正しく入力されていれば channelSecret は文字数が少なく、channelAccessToken は文字数が多いものになります。

関数 URL を取得して動作確認

関数 URL の取得ボタンをクリックします。default のキーの URL 値を確認します。

こちらのコピーボタンをクリックします。この関数の URL がコピーされます。

ブラウザで別タブを表示して URL をアドレスバーにペーストして Enter キーを押してアクセスしてみましょう。このような画面が表示されていれば、上手く動作しています！

LINE Developers の設定

LINE Developers にアクセスして、今回動かしたい LINE Bot の設定ページにアクセスして Messaging API 設定 のページに移動します。

スクロールして Webhook 設定 を探します。 Webhook の利用がオンになっていることを確認しましょう。確認できたら編集ボタンをクリックします。

Webhook URL が編集できるので、さきほど確認した今回の関数 URL をペーストして更新ボタンをクリックします。

これで LINE Bot の設定は完了です！