Vercel AI

Portkey 是您 Vercel AI 应用的控制面板。它使您的 LLM 集成具备生产就绪、可靠、快速和成本高效的特点。

使用 Portkey 与您的 Vercel 应用进行以下操作：

调用 100 多个 LLM（开放和封闭）
记录和分析 LLM 使用情况
缓存响应
自动化后备、重试、超时和负载均衡
管理、版本控制和部署提示
根据用户反馈持续改进应用

指南：创建 Portkey + OpenAI 聊天机器人

1. 创建 NextJS 应用

继续创建一个 Next.js 应用，并安装 ai 和 portkey-ai 作为依赖。

pnpm dlx create-next-app my-ai-app
cd my-ai-app
pnpm install ai portkey-ai

2. 将认证密钥添加到 `.env`

在 Portkey 这里登录
为了将 OpenAI 与 Portkey 集成，将您的 OpenAI API 密钥添加到 Portkey 的虚拟密钥中
这将为您提供一个一次性密钥，您可以使用并轮换，而不是直接使用 OpenAI API 密钥
获取虚拟密钥和您的 Portkey API 密钥，并将其添加到 .env 文件中：

# ".env"
PORTKEY_API_KEY="xxxxxxxxxx"
OPENAI_VIRTUAL_KEY="xxxxxxxxxx"

3. 创建路由处理程序

创建一个 Next.js 路由处理程序，利用边缘运行时生成聊天完成。将结果流回 Next.js。

在此示例中，在 app/api/chat/route.ts 创建一个路由处理程序，调用 GPT-4，并接受一个包含字符串消息数组的 POST 请求：

// filename="app/api/chat/route.ts"
import { OpenAIStream, StreamingTextResponse } from 'ai';
import { Portkey } from 'portkey-ai';

// 创建 Portkey API 客户端
const portkey = new Portkey({
  apiKey: process.env.PORTKEY_API_KEY,
  virtualKey: process.env.OPENAI_VIRTUAL_KEY
});

// 设置运行时为边缘以获得最佳性能
export const runtime = 'edge';

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

  // 调用 GPT-4
  const response = await portkey.chat.completions.create({
    model: 'gpt-4',
    stream: true,
    messages
  });

  // 将响应转换为友好的文本流
  const stream = OpenAIStream(response);
  // 用流响应
  return new StreamingTextResponse(stream);
}

Vercel AI SDK 提供了 OpenAIStream 函数，该函数解码 response 中的文本令牌，并为简单消费正确编码。 StreamingTextResponse 类实用程序扩展了 Node/Edge 运行时的 Response 类，并带有默认头部。

Portkey 遵循与 OpenAI SDK 相同的签名，但扩展到支持 100+ LLMs。在这里，聊天完成调用将发送到 gpt-4 模型，响应将流式传输到您的 Next.js 应用。

4. 从 OpenAI 切换到 Anthropic

Portkey 由一个开源的通用 AI 网关提供支持，您可以使用相同的已知 OpenAI 规范路由到 100+ LLMs。

让我们看看如何通过更新 2 行代码（而不破坏其他内容）从 GPT-4 切换到 Claude-3-Opus。

将您的 Anthropic API 密钥或 AWS Bedrock 秘密添加到 Portkey 的虚拟密钥中
在实例化 Portkey 客户端时更新虚拟密钥
在进行 /chat/completions 调用时更新模型名称

让我们看看它是如何工作的：

// 设置运行时为边缘以获得最佳性能
export const runtime = 'edge';

// 创建 Portkey API 客户端
const portkey = new Portkey({
  apiKey: process.env.PORTKEY_API_KEY,
  virtualKey: process.env.ANTHROPIC_VIRTUAL_KEY
});

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

  // 从 GPT-4 切换到 Claude-3-Opus
  const response = await portkey.chat.completions.create({
    model: 'claude-3-opus-20240229',
    max_tokens: 512,
    stream: true,
    messages
  });

  const stream = OpenAIStream(response);
  return new StreamingTextResponse(stream);
}

5. 切换到 Gemini 1.5

同样，您只需将您的 Google AI Studio API 密钥添加到 Portkey，然后调用 Gemini 1.5：

const portkey = new Portkey({
  apiKey: process.env.PORTKEY_API_KEY,
  virtualKey: process.env.GOOGLE_VIRTUAL_KEY
});
const response = await portkey.chat.completions.create({
  model: 'gemini-1.5-pro-latest',
  stream: true,
  messages
});

对于其他提供者，如 Azure、Mistral、Anyscale、Together 等也将如此。

6. 连接用户界面

让我们创建一个客户端组件，该组件将包含一个表单来收集用户的提示并流式传回完成。 useChat 钩子将默认使用我们之前创建的 POST 路由处理程序 (/api/chat)。但是，您可以通过传递 api 属性来覆盖此默认值以使用 useChat（{ api: '...'}）。

//"app/page.tsx"
'use client';

import { useChat } from 'ai/react';

export default function Chat() {
  const { messages, input, handleInputChange, handleSubmit } = useChat();
  return (
    <div className="flex flex-col w-full max-w-md py-24 mx-auto stretch">
      {messages.map((m) => (
        <div key={m.id} className="whitespace-pre-wrap">
          {m.role === 'user' ? '用户: ' : 'AI: '}
          {m.content}
        </div>
      ))}

      <form onSubmit={handleSubmit}>
        <input
          className="fixed bottom-0 w-full max-w-md p-2 mb-8 border border-gray-300 rounded shadow-xl"
          value={input}
          placeholder="说点什么..."
          onChange={handleInputChange}
        />
      </form>
    </div>
  );
}

7. 记录请求

Portkey 记录您发送的所有请求，以帮助您调试错误，并获得请求级别 + 聚合成本、延迟、错误等的洞察。

您可以通过追踪某些请求、传递自定义元数据或用户反馈来增强日志记录。

使用元数据对请求进行分段

在 Portkey 中，在进行 chat.completions 调用时，您可以传递任何 {"key":"value"} 对。Portkey 根据元数据对请求进行分段，以便为您提供详细的洞察。

const response = await portkey.chat.completions.create(
  {
    model: 'gpt-4',
    messages: [{ role: 'user', content: '我该如何优化礼堂以实现最大容量？' }]
  },
  {
    metadata: {
      user_name: 'john doe',
      organization_name: 'acme'
    }
  }
);

了解更多关于追踪和反馈。

指南：处理 OpenAI 错误

1. 解决 5xx、4xx 错误

Portkey 帮助您在主要故障情况下自动触发对任何其他 LLM/提供商的调用。创建一个与 Portkey 的网关配置的后备逻辑。

例如，设置从 OpenAI 到 Anthropic 的后备时，网关配置如下：

{
  "strategy": { "mode": "fallback" },
  "targets": [{ "virtual_key": "openai-virtual-key" }, { "virtual_key": "anthropic-virtual-key" }]
}

您可以将此配置保存在 Portkey 应用中，并获得一个关联的配置 ID，以便在实例化 Portkey 客户端时传递：

2. 将配置应用于路由处理程序

const portkey = new Portkey({
  apiKey: process.env.PORTKEY_API_KEY,
  config: 'CONFIG_ID'
});

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

  const response = await portkey.chat.completions.create({
    model: 'gpt-4',
    stream: true,
    messages
  });

  const stream = OpenAIStream(response);
  return new StreamingTextResponse(stream);
}

3. 处理速率限制错误

您可以对多个 LLM 或账户进行负载均衡请求，防止任何一个账户达到速率限制阈值。

例如，将请求在 1 个 OpenAI 和 2 个 Azure OpenAI 账户之间路由：

{
  "strategy": { "mode": "loadbalance" },
  "targets": [
    { "virtual_key": "openai-virtual-key", "weight": 1 },
    { "virtual_key": "azure-virtual-key-1", "weight": 1 },
    { "virtual_key": "azure-virtual-key-2", "weight": 1 }
  ]
}

将此配置保存在 Portkey 应用中，并在实例化 Portkey 客户端时传递，就像我们上面所做的那样。

Portkey 还可以触发自动重试、设置请求超时等。

指南：缓存语义相似请求

Portkey 可以通过存储语义相似查询的响应并从缓存中提供它们，节省 LLM 成本并将延迟降低 20 倍。

对于问答用例，缓存命中率高达 50%。要启用语义缓存，只需在您的网关配置中将 cache mode 设置为 semantic：

{
  "cache": { "mode": "semantic" }
}

与上述相同，您可以在 Portkey 应用中保存您的缓存配置，并在实例化 Portkey 客户端时引用配置 ID。

此外，您可以设置缓存的 max-age 并强制刷新缓存。有关更多信息，请参见 docs。

指南：单独管理提示

将提示模板和说明存储在代码中是混乱的。使用 Portkey，您可以在一个地方创建和管理应用程序的所有提示，并直接调用我们的提示 API 以获取响应。有关 Portkey 上提示的更多信息，请查看 Prompts on Portkey 的功能。

要创建提示模板，

从仪表板中打开 Prompts
在 Prompts 页面中，点击 Create
添加您的说明、变量，您可以修改模型参数并点击 Save

在路由处理程序中触发提示

const portkey = new Portkey({
  apiKey: process.env.PORTKEY_API_KEY
});

export async function POST(req: Request) {
  const { variable_content } = await req.json();

  const response = await portkey.prompts.completions.create({
    promptID: 'pp-vercel-app-f36a02',
    variables: { variable_name: 'variable_content' }, // string
    stream: true
  });

  const stream = OpenAIStream(response);
  return new StreamingTextResponse(stream);
}

有关更多信息，请参见 docs。

与开发者交流

如果您有任何问题或疑虑，请在Discord这里联系我们。在Discord上，您还会遇到许多其他正在将他们的Vercel AI + Portkey应用投入生产的从业者。

PreviousMistral NextDeepinfra

Last updated 1 year ago