GPT-4o 图像生成实战:获取 API Key 并用代码生成图片,本指南将引导您如何使用 NodeJS 和 OpenAI SDK 调用 GPT-4o 模型进行图像处理。
环境准备
1. 克隆项目启动模版
我们提供了一个包含基础配置(Node + TS + ESM)的项目模版,方便您快速开始。
git clone git@github.com:KelvinQiu802/ts-node-esm-template.git
2. 安装依赖
进入项目目录,安装必要的依赖库:
openai
: 用于调用 OpenAI API 的官方 SDK。dotenv
: 用于加载项目根目录下的环境变量文件。
cd ts-node-esm-template
pnpm install
pnpm add openai dotenv
3. 配置环境变量
在项目根目录下创建一个 .env
文件,并配置以下环境变量:
OPENAI_API_KEY=你的API密钥
OPENAI_BASE_URL=https://sg.uiuiapi.com/v1 # 或者使用官方或其他代理地址
OPENAI_MODEL=gpt-4o # 指定要使用的模型,这里是 gpt-4o
API 信息:
API 基础地址: https://sg.uiuiapi.com/v1
对话请求地址: https://sg.uiuiapi.com/v1/chat/completions
支持的模型 (根据需求选择):
* `gpt-4o-all`:按 token 计费,价格便宜,用户较多。
* `gpt-4o-image`:按次计费,价格便宜,用户较少。
* `gpt-4o-image-vip`:按次计费,价格较高,用户最少。
请注意:本脚本默认使用 gpt-4o-image-vip
模型。您可以根据需要修改脚本中的 model
字段来选择其他模型。
注意: 请将 你的API密钥
替换为您自己的 OpenAI API Key。OPENAI_BASE_URL
可以根据您的需要设置为 OpenAI 官方地址或其他代理服务地址。
openai api key已开放免费获取,这里推荐两个渠道;
OpenAI API代理 :
- UIUIAPI提供便捷的API中转服务,让您直接使用OpenAI、Claude、Gemini等官方API,无需配置环境、充值或担心封号。我们处理账号和风险,您只需专注于应用开发,我们不记录任何数据。聚合众多AI只需要一个接口即可调用 (推荐)
uiuiapi.com
平台提供 OpenAI API 的API分发服务,可以提供更便捷的访问方式。
官方获取:
- 差别就是api key也是免费获取,就是要充值才可以调用。推荐第一个,价格和稳定方面有优势。
编写脚本
以下是调用 GPT-4o 处理图像的核心脚本代码。
import 'dotenv/config'; // 确保在最开始加载环境变量
import { OpenAI } from 'openai';
import { image2Base64 } from './utils'; // 引入图片转 Base64 的工具函数
// 初始化 OpenAI 客户端
const openai = new OpenAI({
apiKey: process.env.OPENAI_API_KEY, // 从环境变量读取 API Key
baseURL: process.env.OPENAI_BASE_URL, // 从环境变量读取 Base URL
});
const imagePath = './assets/photo.jpg'; // 指定输入图片的路径
const imageType = imagePath.split('.').pop(); // 从路径中提取图片类型 (e.g., 'jpg')
async function main() {
try {
console.log("开始请求 OpenAI API...");
// 调用 chat completions API,并启用流式响应
const stream = await openai.chat.completions.create({
model: process.env.OPENAI_MODEL as string, // 指定使用的模型
messages: [{
role: 'user', // 消息发送者为用户
content: [
{
type: "image_url", // 消息内容类型:图片 URL
image_url: {
// 将本地图片转换为 Base64 编码的 Data URL
url: `data:image/${imageType};base64,${image2Base64(imagePath)}`
}
},
{
type: "text", // 消息内容类型:文本
text: `把图片转换成文艺复兴时期的油画风格` // 对图像处理的提示指令
},
]
}],
stream: true, // 启用流式输出
});
console.log("接收响应:");
// 迭代处理流式响应数据块
for await (const chunk of stream) {
// 提取响应中的文本内容
const content = chunk.choices[0]?.delta?.content || '';
if (content) {
process.stdout.write(content); // 将内容实时输出到控制台
}
}
process.stdout.write('\n'); // 输出换行符
console.log("请求处理完成。");
} catch (error) {
console.error('处理图片时出错:', error);
process.exit(1); // 发生错误时退出程序
}
}
// 执行主函数
main();
image2Base64
工具函数
这个辅助函数用于读取本地图片文件并将其转换为 Base64 编码字符串,以便嵌入到 API 请求中。
import fs from 'fs';
/**
* 读取图片文件并将其转换为 Base64 编码字符串
* @param imagePath 图片文件的路径
* @returns Base64 编码的字符串
*/
export function image2Base64(imagePath: string): string {
const imageBuffer = fs.readFileSync(imagePath); // 同步读取文件内容到 Buffer
return imageBuffer.toString('base64'); // 将 Buffer 转换为 Base64 字符串
}
现在,您可以运行 pnpm dev
(或其他在 package.json
中配置的启动命令) 来执行脚本,它会将指定图片发送给 GPT-4o,并根据提示词进行处理,然后将结果流式输出到控制台。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。