专题★★★☆☆免费

如何在自己的应用中接入 AI 绘图

2026/06/07·约 8 分钟阅读

讲清楚选哪家 API、Node/Next.js 怎么调、怎么把生成的图存起来、生产环境的坑。

适合人群

已经做过 Next.js / Node 项目
想给应用加一个"AI 画图"功能
不想被 prompt、参数、计费、存储这一堆细节卡住

一、选哪家 API

先用一句话说清楚常见三家：

服务	特点	适合
OpenAI `images.generate`	接入最简单，按图收费	简单一次性出图
Stability / Replicate	模型多、可微调	风格控制需求强
国内中转（如 mossx）	免代理、人民币计费	国内部署

👉 选型口诀：简单选 OpenAI，国内选中转，需要控风格选 Replicate。

二、最小代码示例

// app/api/images/route.ts
import { NextResponse } from "next/server";

export async function POST(req: Request) {
  const { prompt } = await req.json();

  const res = await fetch("https://api.openai.com/v1/images/generations", {
    method: "POST",
    headers: {
      Authorization: `Bearer ${process.env.OPENAI_API_KEY}`,
      "Content-Type": "application/json",
    },
    body: JSON.stringify({
      model: "gpt-image-1",
      prompt,
      n: 1,
      size: "1024x1024",
    }),
  });

  if (!res.ok) {
    return NextResponse.json({ error: await res.text() }, { status: 500 });
  }
  const data = await res.json();
  return NextResponse.json({ url: data.data[0].url });
}

三、生产环境的几个坑

图片只能临时下载 — OpenAI 返回的 URL 24 小时就失效。要持久化必须存到自己的对象存储（R2 / Vercel Blob / S3）
生成耗时 — 一张 1024×1024 通常 8-30 秒，要么前端转圈，要么用 webhook
NSFW 限制 — 用户输入要先过滤敏感词，被封号没人赔
价格 — 一张 $0.04 起，单用户连续生成可能日烧 $50+

四、上线前最后检查

API Key 放在服务端，不要扔到客户端
图片立即下载到自己的存储，存数据库的是你存储里的 URL
有限流（每用户每分钟 N 张）
有错误兜底（API 挂了显示什么）

这篇有用吗？

告诉我们哪里跑不通，我们会更新这篇文章。