TanStack AI + Gonka — 低成本的 TypeScript AI 应用程序

安装包（核心 + OpenAI 适配器，其中包含 openaiCompatible）：

# pnpm
pnpm add @tanstack/ai @tanstack/ai-openai

# npm
npm install @tanstack/ai @tanstack/ai-openai

对于 React 上的聊天界面，添加客户端和钩子：

pnpm add @tanstack/ai-client @tanstack/ai-react

JoinGonka API 密钥：如果还没有，请在 gate.joingonka.ai/register 注册，获取 10M 免费令牌，并在 Dashboard → API Keys 中创建 jg-xxx 密钥。一个密钥和余额同时适用于 OpenAI 和 Anthropic 格式。

在 TanStack AI 中，可以通过 openaiCompatible() 函数配置自定义的 OpenAI 兼容提供程序：只需一次性设置 baseURL、apiKey 和模型列表，然后在每次调用时选择模型即可。我们的 Gateway 支持 Chat Completions 格式，因此保留 api: 'chat-completions'（默认值）。

import { openaiCompatible } from '@tanstack/ai-openai'

// Gonka 提供程序 — 只需配置一次
export const gonka = openaiCompatible({
  name: 'gonka',
  baseURL: 'https://gate.joingonka.ai/v1',
  apiKey: process.env.GONKA_API_KEY!, // jg-你的密钥
  api: 'chat-completions',
  models: [
    'moonshotai/Kimi-K2.6', // 默认
    'MiniMaxAI/MiniMax-M2.7',
  ],
})

服务器端流式聊天（例如 任何全栈框架 中的路由处理程序或 TanStack Start）。我们通过 modelOptions 设置响应长度 — 这是原生 wire 参数（max_tokens、temperature）的唯一设置点：

import { chat, toServerSentEventsResponse } from '@tanstack/ai'
import { gonka } from './gonka'

export async function POST(request: Request) {
  const { messages } = await request.json()

  const stream = chat({
    adapter: gonka('MiniMaxAI/MiniMax-M2.7'),
    messages,
    modelOptions: { max_tokens: 8192 }, // 通过 Gateway 设置输出上限
  })

  return toServerSentEventsResponse(stream)
}

React 客户端通过 useChat hook — 将来自服务器的响应流传输到 UI：

import { useChat } from '@tanstack/ai-react'

function Chat() {
  const { messages, sendMessage, status } = useChat({ api: '/api/chat' })

  return (
    <div>
      {messages.map((m) => (
        <p key={m.id}><b>{m.role}:</b> {m.content}</p>
      ))}
      <button onClick={() => sendMessage('Gonka 是什么？')}>
        询问
      </button>
    </div>
  )
}

无服务器模式：同一个提供程序可以直接在脚本或后端中运行 — 只需调用 chat() 并读取流即可。连接 Gonka 的方式在所有场景下都是一样的。

通过 Gateway 使用模型参数：两个模型的上下文均为 200K token。所有网络模型的 max_tokens 上限均为 8192。如果未指定 max_tokens，非流式输出的默认值为 1500，因此对于长文本响应，请显式设置它。

TanStack AI 通过调整 baseURL 即可轻松切换至 Gonka，无需改动其他逻辑，但价格差异巨大。让我们比较一下典型的 TanStack AI 生产负载情况：

TanStack AI 的 Provider-agnostic 方法意味着切换到 Gonka 仅需修改一行代码（baseURL），无需重写逻辑。同时，您的类型安全工具、结构化输出和 React hooks 保持不变。对于拥有数千用户的应用程序，每月节省的开支可达数万美元。

Gonka 价格：输入端约为每 1M token $0.003，输出端乘以 3。这比 OpenAI 和 Anthropic 的直接收费标准便宜数百至数千倍。

TanStack AI 的核心亮点是统一的 toolDefinition() 契约：只需描述一次工具（通过 Zod、ArkType、Valibot 或 JSON Schema 定义输入/输出），即可在服务器或客户端实现绑定。 Kimi K2.6 和 MiniMax-M2.7 通过 Gonka 支持原生工具调用 (tool calling)，因此代理程序运行非常稳健 — 无需解析文本响应。

import { chat, toolDefinition } from '@tanstack/ai'
import { gonka } from './gonka'
import { z } from 'zod'

const getWeather = toolDefinition({
  name: 'getWeather',
  description: '查询城市天气',
  inputSchema: z.object({ city: z.string() }),
  outputSchema: z.object({ tempC: z.number() }),
}).server(async ({ city }) => {
  return { tempC: 21 } // 你的真实 API 调用
})

const stream = chat({
  adapter: gonka('MiniMaxAI/MiniMax-M2.7'),
  messages: [{ role: 'user', content: '莫斯科的天气怎么样？' }],
  tools: [getWeather],
  modelOptions: { max_tokens: 8192 },
})

如何选择模型：

• moonshotai/Kimi-K2.6 — 在代码编写、推理和代理场景中表现强劲。响应上限 8192。
• MiniMaxAI/MiniMax-M2.7 — 默认选择，速度与质量的平衡，长上下文支持。响应上限 8192。

借助 TanStack AI 的运行时适配器切换功能，你可以在同一个提供程序中保留两个模型，并根据需求即时切换 — 例如：复杂的代理任务使用 Kimi，快速响应任务使用 MiniMax。