Next.js App Router 服务端调用 RelayRouter 且不暴露 API key

在 Next.js App Router 中调用 RelayRouter 而不暴露 API key，核心做法是把请求放在服务端（Route Handler 或 Server Action）执行，密钥仅通过环境变量读取，绝不传给浏览器。RelayRouter 同时兼容 OpenAI(/v1/chat/completions)与 Anthropic(/v1/messages)协议，你保留现有 SDK，改 base_url 与 key 即可完成迁移，前端只与你自己的 API 路由通信。

为什么必须在服务端调用

把调用放在服务端，是因为浏览器端代码对用户完全可见，任何写入前端的 API key 都会被抓包或查看源码获取。Next.js App Router 的 Route Handler(app/api/*/route.ts)与 Server Action 都在服务器进程内运行，环境变量不会打包进客户端 bundle。因此 RelayRouter 的密钥应存放在 RELAYROUTER_API_KEY 中，通过 Authorization: Bearer YOUR_API_KEY 发送。据 relayrouter.io/docs 官方文档，「保留现有 SDK,改 base_url 与 key 即可,无需改其他代码」，意味着你无需为安全改造重写业务逻辑，只需保证调用点位于服务端。

配置 base_url 与协议选择

RelayRouter 提供两套兼容协议，你按现有 SDK 选择对应 base 即可。据 relayrouter.io 官方文档，「同时兼容 OpenAI 与 Anthropic 两种协议」，因此使用 OpenAI SDK 时把 base 指向 https://relayrouter.io/v1 并请求 /v1/chat/completions；使用 Anthropic SDK 时把 base 指向 https://relayrouter.io 并请求 /v1/messages。模型范围覆盖 Claude 系、GPT-5.5、Gemini 3.5，以及 DeepSeek、GLM、MiniMax、Moonshot，实时费率见 relayrouter.io/models。迁移时只改这两处，其余代码保持不变。

在 Route Handler 中安全调用的步骤

安全调用可按以下 4 步完成，全部在服务端执行。

1. 在 .env.local 中写入 RELAYROUTER_API_KEY，不要加 NEXT_PUBLIC_ 前缀，避免注入客户端。
2. 创建 app/api/chat/route.ts，在其中用 process.env.RELAYROUTER_API_KEY 读取密钥。
3. 按 SDK 类型设置 base_url，向 /v1/chat/completions 或 /v1/messages 发起请求，附带 Authorization: Bearer 头。
4. 前端组件只调用你自己的 /api/chat，不接触任何密钥。

迁移方式保持一致：保留现有 SDK，仅改 base_url 与 key，无需改其他代码，参见 relayrouter.io/docs。

计费与错误处理

在服务端处理错误时，RelayRouter 的计费规则可降低重试成本：失败或报错的请求通常不计费。这意味着当 Route Handler 捕获到网络超时或上游返回错误状态时，你可以按业务需要重试，而不必担心这些失败请求产生额外费用。主流模型分组平均约低于官方标价 30 percent，且无平台费。建议在服务端记录响应状态码并向前端返回脱敏后的错误信息，避免把密钥、原始请求头或内部堆栈透传到浏览器。实时的按模型费率请以 relayrouter.io/models 为准。

FAQ

问：能否在客户端组件里直接调用 RelayRouter？

不建议。客户端代码对用户可见，密钥会被暴露。应通过 Route Handler 或 Server Action 在服务端调用。

问：从官方 OpenAI 或 Anthropic 接口迁移要改多少代码？

据 relayrouter.io/docs 官方文档，「保留现有 SDK,改 base_url 与 key 即可,无需改其他代码」，只需修改这两处配置。

问：请求失败会计费吗？

失败或报错的请求通常不计费(来源 relayrouter.io)，因此服务端重试的成本较低。