从零到一：构建 AI SaaS 产品

想做一个 AI 产品但不知道从何开始？本文将带你用 Ciyuano 词元圈的 API，从零构建一个 AI 写作助手 SaaS。

产品设计

我们的 AI 写作助手功能：

• 文章续写
• 内容改写
• 语法检查
• 多语言翻译
• 风格调整

技术栈

核心代码

1. AI 服务封装

// lib/ai.ts
import OpenAI from "openai";

const client = new OpenAI({
  baseURL: "https://www.ciyuano.com/v1",
  apiKey: process.env.CIYUANO_API_KEY,
});

export async function generateContent(
  prompt: string,
  context: string,
  action: "continue" | "rewrite" | "check" | "translate"
) {
  const systemPrompts = {
    continue: "你是一个专业的写作助手。根据上下文自然地续写内容。",
    rewrite: "你是一个文字改写专家。保持原意的同时，用更好的表达重写内容。",
    check: "你是一个语法检查专家。检查并修正语法错误、标点符号和表达问题。",
    translate: "你是一个专业翻译。将内容翻译成目标语言，保持原意和风格。",
  };

  const response = await client.chat.completions.create({
    model: "deepseek-v4-flash",
    messages: [
      { role: "system", content: systemPrompts[action] },
      { role: "user", content: `上下文：${context}\n\n任务：${prompt}` },
    ],
    temperature: 0.7,
    max_tokens: 2000,
  });

  return response.choices[0].message.content;
}

2. API 路由

// app/api/generate/route.ts
import { NextRequest, NextResponse } from "next/server";
import { generateContent } from "@/lib/ai";
import { checkUserBalance } from "@/lib/auth";

export async function POST(req: NextRequest) {
  const { prompt, context, action } = await req.json();
  
  // 检查用户余额
  const user = await checkUserBalance(req);
  if (!user || user.balance < 0.01) {
    return NextResponse.json(
      { error: "余额不足，请充值" },
      { status: 402 }
    );
  }

  const result = await generateContent(prompt, context, action);
  
  return NextResponse.json({ content: result });
}

3. 前端组件

// components/Editor.tsx
"use client";
import { useState } from "react";

export default function Editor() {
  const [content, setContent] = useState("");
  const [loading, setLoading] = useState(false);

  const handleAction = async (action: string) => {
    setLoading(true);
    const res = await fetch("/api/generate", {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({
        prompt: content.slice(-500),
        context: content,
        action,
      }),
    });
    const data = await res.json();
    setContent(content + "\n\n" + data.content);
    setLoading(false);
  };

  return (
    <div className="max-w-4xl mx-auto p-6">
      <textarea
        value={content}
        onChange={(e) => setContent(e.target.value)}
        className="w-full h-64 p-4 border rounded-lg"
        placeholder="开始写作..."
      />
      <div className="flex gap-2 mt-4">
        <button onClick={() => handleAction("continue")} disabled={loading}>
          ✍️ 续写
        </button>
        <button onClick={() => handleAction("rewrite")} disabled={loading}>
          🔄 改写
        </button>
        <button onClick={() => handleAction("check")} disabled={loading}>
          ✅ 检查语法
        </button>
      </div>
    </div>
  );
}

商业化

定价策略

总结

用 AI API 构建 SaaS 产品的门槛已经非常低。关键在于找到真实的用户需求，而不是为了用 AI 而用 AI。