概要
以前の記事でDiscord上でOpenAIのAPIを使ってアシスタントを作成しました
今回の記事では、アシスタントに画像の認識の機能を実装してみます
Discordで送信された画像のURLを受け取る
実装
Discordではメッセージに複数のファイルを添付することができます
複数の添付ファイルを取得し、画像ファイルの判定を行うコードを書いてみます
ここでのポイントは以下の3点です
- message.attachments が添付ファイルになります
- attachment.contentType にファイルタイプ(MINEタイプ)が格納されています
- attachment.url に添付ファイルのURLが格納されています
client.on('messageCreate', async message => {
const attachments = message.attachments;
for (let attachment of attachments) {
if (attachment[1].contentType == "image/png" || attachment[1].contentType == "image/jpeg" || attachment[1].contentType == "image/gif") {
logger.debug("url": attachment[1].url);
}
}
});
OpenAIのAPIに画像を渡す
実装
前回実装した以下の部分を修正していきます
//メッセージをOpenAIのAPIに渡せる形に成型する
const messages: ChatCompletionMessageParam[] = [];
for (let message of messagesCollection) {
const role = ((message[1].author.id == client.user?.id) ? "assistant" : "user");
messages.push(
{
role: role,
content: message[1].content
}
);
}
logger.debug(message);
//APIにメッセージを投げて返答を抽出
const content = (await openai.chat.completions.create({
messages,
model: 'gpt-4-turbo-preview'
})).choices[0].message.content;
if (!content) {
return;
}
//返信
message.reply(content);
取得した画像のURLをOpenAIのAPIに渡すコードを書いてみます
ここでのポイントは以下の点です
- Userは画像ファイルを渡すことができますが、Assistantは画像ファイルを渡せないという制約があります
- 画像のURLなどを渡す場合はChatCompletionContentPart[]の形である必要があります
- モデルはgpt-4-turbo-previewではなく、gpt-4-turboを使用します
//メッセージをOpenAIのAPIに渡せる形に成型する
const messages: ChatCompletionMessageParam[] = [];
for (let message of messagesCollection) {
const role = ((message[1].author.id == client.user?.id) ? "assistant" : "user");
if (role == "assistant") {
//前回と同じコード
messages.push(
{
role: role,
content: message[1].content
}
);
}
else if (role == "user") {
const content: ChatCompletionContentPart[] = [
{
type: "text",
text: message[1].content
}
]
//添付ファイルを取得
const attachments = message[1].attachments;
for (let attachment of attachments) {
//ファイルが画像の場合はURLを抽出
if (attachment[1].contentType == "image/png" || attachment[1].contentType == "image/jpeg" || attachment[1].contentType == "image/gif") {
content.push({
type: "image_url",
image_url: {
"url": attachment[1].url
}
});
}
}
messages.push(
{
role: role,
content: content
}
);
}
}
logger.debug(message);
//APIにメッセージを投げて返答を抽出
const content = (await openai.chat.completions.create({
messages,
model: 'gpt-4-turbo'
})).choices[0].message.content;
if (!content) {
return;
}
//返信
message.reply(content);
動作確認
画像を渡してあげると適切に画像を解釈してくれることが確認できました
まとめ
前回に続き、Discord上でOpenAIのAPIを呼び出してみました
gpt-4-vision-previewがgpt-4-turboに統合されたので1つのモデルで完結することができました