AI 集成图片生成

图片生成

ShipAny 使用 ai-sdk 作为基础库,结合自定义的 Provider,支持了市面上主流的图片生成模型。

使用 OpenAI 的图片模型

使用 OpenAIdall-e-3 模型生成图片:

需要先在 OpenAI Platform 充值,并创建 API Key。

  1. 设置环境变量
.env.development
OPENAI_BASE_URL = "https://api.openai.com/v1"
OPENAI_API_KEY = "sk-xxx"
  1. 生成图片

providerOptions.openai 支持的参数,参考 OpenAI Image Generation 接口文档

app/api/demo/gen-image/route.ts
import { experimental_generateImage as generateImage } from "ai";
import { openai } from "@ai-sdk/openai";
 
const prompt = "a beautiful girl running with 2 cats";
const model = "dall-e-3";
 
const imageModel = openai.image(model);
const providerOptions = {
  openai: {
    quality: "hd",
    style: "natural",
  },
};
 
const { images, warnings } = await generateImage({
  model: imageModel,
  prompt: prompt,
  n: 1,
  providerOptions,
});
  1. 预览效果

openai-image

使用 Replicate 上的图片模型

需要先在 Replicate 上绑定信用卡,并创建 API Token。

  1. 设置环境变量
.env.development
REPLICATE_API_TOKEN = "r8_xxx"
  1. 生成图片

Replicate 模型广场 选择一个图片生成模型,复制模型名称。

providerOptions.replicate 支持的参数,参考选择模型的 API 文档

app/api/demo/gen-image/route.ts
import { experimental_generateImage as generateImage } from "ai";
import { replicate } from "@ai-sdk/replicate";
 
const prompt = "a beautiful girl running with 2 cats";
const model = "black-forest-labs/flux-1.1-pro";
 
const imageModel = replicate.image(model);
const providerOptions = {
  replicate: {
    output_quality: 90,
  },
};
 
const { images, warnings } = await generateImage({
  model: imageModel,
  prompt: prompt,
  n: 1,
  providerOptions,
});
  1. 预览效果

replicate-image

使用 Kling AI 的图片模型

需要先在 Kling AI 充值 Image Generation API,并 创建 API Key

  1. 设置环境变量
.env.development
KLING_ACCESS_KEY = "xxx"
KLING_SECRET_KEY = "xxx"
  1. 生成图片

注意,这里使用的是 ShipAny 自定义的 Provider:import { kling } from "@/aisdk/kling";,跟 @ai-sdk 下的 Provider 导入路径有差异。

providerOptions.kling 支持的参数,参考 Kling Image Generation API 文档

app/api/demo/gen-image/route.ts
import { experimental_generateImage as generateImage } from "ai";
import { kling } from "@/aisdk/kling";
 
const prompt = "a beautiful girl running with 2 cats";
const model = "kling-v1";
 
const imageModel = kling.image(model);
const providerOptions = {
  kling: {},
};
 
const { images, warnings } = await generateImage({
  model: imageModel,
  prompt: prompt,
  n: 1,
  providerOptions,
});
  1. 预览效果

kling-image

保存图片到本地文件

通过 generateImage 生成的图片,是 base64 编码的字符串数组。

你可以参考下面的代码,将图片内容保存到本地文件。

app/api/demo/gen-image/route.ts
const { images, warnings } = await generateImage({
  model: imageModel,
  prompt: prompt,
  n: 1,
  providerOptions,
});
 
if (warnings.length > 0) {
  console.log("gen images warnings:", provider, warnings);
  return respErr("gen images failed");
}
 
const batch = getUuid();
 
const processedImages = await Promise.all(
  images.map(async (image, index) => {
    const fileName = `${provider}_image_${batch}_${index}.png`;
    const filePath = path.join(process.cwd(), ".tmp", fileName);
 
    const buffer = Buffer.from(image.base64, "base64");
    await writeFile(filePath, buffer);
 
    return {
      provider,
      fileName,
      filePath,
    };
  })
);

参考