在 Next.js 中接入 LLM:用 59API 快速做聊天接口
为什么先把 LLM 接在 Next.js 服务端
在 Next.js 里接入大模型,最稳妥的方式是把调用放在 Route Handler 或 Server Action 中,而不是直接写到前端。这样能保护 API Key,也方便你统一做限流、日志和提示词管理。对于已经在用 OpenAI SDK 的项目,迁移成本很低:只要把 baseURL 和密钥切到兼容接口,就能继续用原来的调用方式。
如果你想同时接 Claude 和 GPT,又不想为多家平台分别维护代码,59API 很适合做中转层。它按量计费,支持 Claude 的 Opus、Sonnet、Haiku、Fable 以及 GPT 模型,而且保持原生官方质量,不是降级版。对原型验证、内部工具或小流量上线来说,成本会明显更友好。
第一步:安装 SDK,并配置 59API
先安装 OpenAI SDK:
npm i openai
然后在 .env.local 中放入你的 59API Key:
59API_API_KEY=你的key
如果你已经有一个现成的 AI 工具层,也可以单独封装一个客户端文件,后续所有模型请求都复用它。
lib/llm.ts
import OpenAI from 'openai'; export const llm = new OpenAI({ apiKey: process.env.59API_API_KEY, baseURL: 'https://api.59api.com' });
第二步:用 Route Handler 写一个聊天接口
在 App Router 下创建 app/api/chat/route.ts,前端只负责传入用户输入,模型推理全部在服务端完成。
import { llm } from '@/lib/llm'; export async function POST(req: Request) { const { prompt } = await req.json(); const resp = await llm.chat.completions.create({ model: 'claude-sonnet', messages: [ { role: 'system', content: '你是一个简洁、准确的产品助手。' }, { role: 'user', content: prompt } ], temperature: 0.3 }); return Response.json({ text: resp.choices[0]?.message?.content ?? '' }); }
这里我用的是 Claude Sonnet,适合总结、问答和文案生成;如果是更轻量的分类、提取任务,可以换成 Haiku;如果是复杂规划或高质量长文,再切到 Opus。同一套代码只改 model 字段即可。
第三步:前端组件调用这个接口
前端页面可以用最简单的表单提交,先把链路跑通,再升级成流式输出。
'use client'; import { useState } from 'react'; export default function ChatBox() { const [prompt, setPrompt] = useState(''); const [answer, setAnswer] = useState(''); const send = async () => { const res = await fetch('/api/chat', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ prompt }) }); const data = await res.json(); setAnswer(data.text); }; return ( setPrompt(e.target.value)} /> 发送
{answer}
); }实战建议:先选对模型,再优化成本
- 客服/摘要/抽取:优先用 Haiku,响应快,成本低。
- 产品文案/代码解释:Sonnet 通常是性价比最好的默认选项。
- 复杂推理/长上下文:再上 Opus,避免一开始就用最高档模型浪费预算。
- 日志与监控:记录 prompt 长度、模型名和耗时,便于后续做成本核算。
为什么 59API 特别适合 Next.js 团队
它的优势不只是便宜,更重要的是兼容性高:你可以继续沿用现有 OpenAI SDK、Claude Code、Codex 相关工具链,几乎不需要重写业务逻辑。对前端团队来说,这意味着可以把注意力放在产品体验上,而不是反复对接不同厂商的接口细节。
如果你正在做一个 Next.js AI 功能,建议先用 59API 以按量付费方式跑通 MVP,再根据真实流量决定是否扩大预算。想快速开始的话,可以先注册一个 59API 账号,拿到 Key 后把上面的示例直接贴进项目里测试。
一旦链路打通,你就能很快把聊天、检索增强、内容生成、代码助手等能力加到 Next.js 应用中,而且成本更可控。
शुरू करने के लिए तैयार?
कुछ ही मिनटों में Claude और GPT जोड़ें, सबसे कम कीमत पर। साइन अप करें और API key पाएं।
मुफ़्त साइन अप