TL;DR
NextJS(つまりJavascript)で、Langchainを使ってAzure版OpenAIを利用したかったのですが、なかなか情報がなかったので簡単にまとめておきます。
(同じところで困っている人がいれば・・)
LangchainからAzureのOpenAIの利用時に設定の必要がある情報
環境変数に以下の4つの値を設定する必要がある(OpenAIの場合はKeyだけでいいのに・・・)
.env
# インスタンス名(最初に環境作る時に自分で決めた名前)
AZURE_OPENAI_API_INSTANCE_NAME=xxxxxx
# API_KEY(Azureのコンソールから2つ参照可能)
AZURE_OPENAI_API_KEY=xxxxxx
# 以下の画面で確認できる
AZURE_OPENAI_API_DEPLOYMENT_NAME=xxxx
# 現時点では以下の記述でOK。コンソール画面からは情報がなく、Playgroundで取得したサンプルコードから拝借した。
AZURE_OPENAI_API_VERSION=2023-03-15-preview
InstanceNameとDevelopmentNameがどこから持ってこればよいかわかりにくかったのでAzureコンソールの画面をスクショを添付しておく
サンプルコード
NextJSの場合、ルートディレクトリに.envを作成し、上記の情報を書けば自動で読み込まれる。
以下のコードで実際に動作確認することができた。
(サーバサイドで動かす必要があるため、/apiの下にコードを配置する必要がある点に注意!
chatgpt
import { OpenAI } from "langchain";
import { ChatOpenAI } from "langchain/chat_models/openai";
import { OpenAIChat } from "langchain/llms/openai";
import { HumanChatMessage, SystemChatMessage } from "langchain/schema";
export default async function handler(req, res) {
if (req.method === "GET") {
const chat = new ChatOpenAI();
const response = await chat.call([
new HumanChatMessage("名古屋の歴史について教えてください"),
]);
console.log(response);
res.status(200).json({ message: responseB });
}
}
動作確認
以下のURLにアクセスすると、Azureからのリクエストが取得できる。
http://localhost:3000/api/chatgpt
{
"message": {
"text": "名古屋の歴史は古く、約2000年前から人が暮らしていたとされています。特に、平安時代には官道などの交通網が整備され、交通の要所として発展していきました。\n\n戦国時代には、織田信長が名古屋城を築城し、名古屋を拠点とする軍団を率いて多くの戦いを勝ち抜いたことが知られています。\n\n江戸時代には、徳川家康が東海道五十三次のうちの一つとして名古屋宿を設置して発展を促し、また、藩政時代には尾張藩のお家騒動もありました。\n\n明治時代には、名古屋市が建設され、産業の発展が進み、近代的な都市へと変貌を遂げていきました。\n\n現代においても、名古屋は自動車産業の中心地として知られ、また、食文化や観光資源も豊富であることから、多くの人々に愛されています。"
}
}
まとめ
Langchainを利用すると、ものすごく簡単にOpenAIのサービスにアクセスすることができた