接口切换只改一行配置——我在 Next.js 路由处理程序里搭了个 AI 网关代理，联调时间省了一大半

为什么独立开发者需要这篇文章

先说一个我自己的前后对比。上个月我给一个 Side Project 接 AI 能力，第一次是直接在前端调用模型 API：Key 暴露风险、CORS 报错、换供应商要改三处代码，从写代码到跑通花了将近一个下午。第二次我用 Next.js 的 Route Handler 做了一层代理网关，从注册到跑通第一段代码，前后不到 30 分钟。之后每次切换模型供应商，只改一行 base_url，两分钟搞定。

省下的时间不是一次性收益。每次联调、每次换模型、每次排查请求问题，这层代理都在持续节省时间。对独立开发者和小团队来说，这类「一次搭好、长期复用」的基础设施，性价比极高。

整体思路

架构很简单：

前端 → Next.js Route Handler（/api/chat）→ ThisToken.AI 网关 → 各家模型

前端只跟你自己的 /api/chat 通信，API Key 存在服务端环境变量里，永远不出服务器。而 ThisToken.AI 这类网关服务把「多家模型、统一接口」这层也帮你做了——OpenAI 兼容格式，换供应商时接口不变，只换模型名。

第一步：注册并获取 API Key

1. 打开 https://api.thistoken.ai/register ，用邮箱注册一个账号（独立开发者注册一个个人账号即可，小团队建议共用一个组织账号，方便后面统一看用量）。
2. 登录后进入控制台，在 API Key 管理页面创建一个新 Key，复制并妥善保存。Key 只在创建时完整展示一次。
3. 计费方式以官网价格页为准，新账号一般可以先小额体验，跑通流程再决定充多少。

第二步：写第一个代理路由

在项目根目录创建 app/api/chat/route.ts（App Router 写法）：

// app/api/chat/route.ts
import { NextRequest, NextResponse } from "next/server";

// 复用底层 fetch，生产环境建议自己加连接池/超时控制
const GATEWAY_BASE_URL = "https://api.thistoken.ai/v1"; // 这就是那行关键配置

export async function POST(req: NextRequest) {
  const apiKey = process.env.THISTOKEN_API_KEY;
  if (!apiKey) {
    return NextResponse.json({ error: "Missing THISTOKEN_API_KEY" }, { status: 500 });
  }

  const body = await req.json();

  const upstream = await fetch(`${GATEWAY_BASE_URL}/chat/completions`, {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
      Authorization: `Bearer ${apiKey}`,
    },
    body: JSON.stringify({
      model: body.model ?? "gpt-4o-mini", // 换模型只改这里
      messages: body.messages,
    }),
  });

  if (!upstream.ok) {
    const errText = await upstream.text();
    return NextResponse.json(
      { error: "Upstream error", detail: errText },
      { status: upstream.status }
    );
  }

  const data = await upstream.json();
  return NextResponse.json(data);
}

环境变量写在 .env.local 里：

THISTOKEN_API_KEY=sk-你的key

如果项目里已经用了官方 SDK，切换到网关同样只改一行：

import OpenAI from "openai";

const client = new OpenAI({
  apiKey: process.env.THISTOKEN_API_KEY,
  baseURL: "https://api.thistoken.ai/v1", // 只改这一行
});

第三步：跑通验证

启动 npm run dev，用 curl 测一下：

curl -X POST http://localhost:3000/api/chat \
  -H "Content-Type: application/json" \
  -d '{"messages":[{"role":"user","content":"你好，介绍一下你自己"}]}'

返回正常的 JSON 补全结果，就说明整条链路通了。

前后对比：这层代理到底省了多少

我按自己的项目粗略算过一笔时间账：

• Key 安全：以前要么把 Key 打进前端包里（不可接受），要么手写一个临时 Node 脚本转发（每次 40 分钟以上）。现在 Route Handler 是框架原生能力，10 分钟写完，Key 只活在服务端。
• 换供应商：以前直连各家 SDK，接口格式、鉴权方式各不相同，完整切一遍至少半天。现在走网关，OpenAI 兼容格式统一，实际工作量是改 baseURL 加改模型名，两分钟。
• 排查问题：所有请求都过你自己的 /api/chat，加一行日志就能看到完整出入参。以前前端直连时排查一个 401，我在浏览器 DevTools 和供应商文档之间来回切了一小时。

注意这里说的时间数字是我个人项目的记录，你的情况会不同；网关和各模型的费用请以官网价格页为准，不在我这篇的讨论范围里。

两个容易踩的坑

1. 流式响应别用 await res.json()。如果要支持 stream: true，直接 return new Response(upstream.body, { headers: { "Content-Type": "text/event-stream" } })，把流透传出去，不要中途解析。
2. 别把 req.json() 的 body 原样转发到底。先校验、再白名单字段，能挡掉大部分脏请求。代理层是你唯一的服务端关卡，值得多写十行校验代码。

写在最后

这层代理加上网关的组合，把「接 AI 能力」从一个每次都要重新折腾的事，变成了一次配置、长期受益的资产。如果你还没有账号，可以先去 https://api.thistoken.ai/register 注册一个，拿到 Key，把上面的代码贴进项目跑起来——第一段代码跑通之后，剩下的都只是改配置的事了。

---

想直接跑通示例？访问 https://api.thistoken.ai/register 注册 ThisToken.AI，获取 API Key 后即可开始。