6
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

NextJSでLangchainをAzure版のOpenAIで利用する際の設定方法

Last updated at Posted at 2023-05-15

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コンソールの画面をスクショを添付しておく
image.png

サンプルコード

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のサービスにアクセスすることができた

6
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
6
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?