技能 ai-sdk-handler
📦

ai-sdk-handler

安全

Создание AI-приложений с Vercel AI SDK

Создание AI-приложений требует сложной интеграции LLM, потоковой передачи и управления состоянием. Этот навык предоставляет исчерпывающее руководство по реализации чат-ботов, структурированных выводов, генеративного UI и рабочих процессов агентов с использованием Vercel AI SDK в приложениях Next.js.

支援: Claude Codex Code(CC)
📊 69 充足
1

下載技能 ZIP

2

在 Claude 中上傳

前往 設定 → 功能 → 技能 → 上傳技能

3

開啟並開始使用

測試它

正在使用「ai-sdk-handler」。 Create a streaming chat API route at /api/chat with authentication

預期結果:

Я создам API-маршрут потокового чата с аутентификацией. Маршрут будет использовать streamText из Vercel AI SDK с OpenAI, включать аутентификацию через withAuthRequired и возвращать потоковый ответ с отслеживанием использования токенов.

正在使用「ai-sdk-handler」。 Build an endpoint that extracts structured recipe data from text

預期結果:

Я создам API-маршрут с использованием generateObject и Zod-схемы, которая определяет структуру рецепта, включая название, массив ингредиентов и шаги приготовления, обеспечивая безопасный по типам JSON-вывод.

正在使用「ai-sdk-handler」。 How do I handle multimodal chat with image uploads?

預期結果:

Для мультимодального чата используйте параметр experimental_attachments в функции handleSubmit в useChat. На клиенте захватывайте файловые входные данные и передавайте их в handleSubmit. Серверный маршрут получит изображения в массиве сообщений для обработки.

安全審計

安全
v6 • 1/21/2026

This skill contains only documentation and code examples for the Vercel AI SDK integration. All static findings are false positives: backticks in code examples were misidentified as shell commands, and legitimate API key environment variable usage follows Next.js security best practices. No executable code or security risks detected.

4
已掃描檔案
1,775
分析行數
0
發現項
6
審計總數
未發現安全問題
審計者: claude 查看審計歷史 →

品質評分

38
架構
100
可維護性
87
內容
21
社群
100
安全
83
規範符合性

你能建構什麼

Чат-бот технической поддержки

Создание интерактивного чат-интерфейса технической поддержки с потоковыми ответами, аутентификацией и отслеживанием истории разговора.

Конвейер извлечения данных

Извлечение структурированных данных из неструктурированного текста с использованием generateObject и Zod-схем для заполнения базы данных или форм.

AI-powered дашборд

Создание динамических дашбордов с генеративным UI, который отображает пользовательские React-компоненты на основе анализа LLM и запросов пользователя.

試試這些提示

Настройка базового потокового чата
Создайте API-маршрут потокового чата в /api/chat с аутентификацией, использующий Vercel AI SDK
Извлечение структурированных данных
Создайте API-эндпоинт, который извлекает информацию о рецепте, включая название, ингредиенты и шаги, из предоставленного пользователем текста с использованием generateObject
Реализация генеративного UI
Создайте маршрут генеративного UI, который может отображать карточки погоды или компоненты с ценами акций на основе вызовов инструментов LLM
Создание агента фонового исследования
Реализуйте многошаговый агент исследования с использованием Inngest, который генерирует план исследования, выполняет шаги и синтезирует результаты

最佳實務

  • Всегда используйте аутентификацию на AI-маршрутах для предотвращения несанкционированного доступа и контроля затрат
  • Предпочитайте потоковые ответы для текстовой генерации для улучшения воспринимаемой производительности
  • Определяйте Zod-схемы для структурированных выводов для обеспечения безопасности типов и валидации

避免

  • Публичный доступ к AI-маршрутам без аутентификации приводит к злоупотреблению и неожиданным затратам
  • Выполнение длительных AI-рабочих процессов в стандартных API-маршрутах превысит лимиты времени serverless
  • Хранение API-ключей в коде вместо использования переменных окружения компрометирует безопасность

常見問題

When should I use ai-sdk-handler versus ai-handler?
Используйте ai-sdk-handler для текстовых LLM-функций, включая чат, структурированные выводы и агентов. Используйте ai-handler для генерации изображений и видео с такими сервисами, как Replicate или Fal.ai.
How do I prevent API route timeouts for long AI tasks?
Используйте интеграцию Inngest для рабочих процессов, превышающих лимиты serverless. Инициируйте события Inngest из вашего UI и запускайте многошаговую AI-логику в фоновых функциях с автоматическими повторными попытками и отслеживанием шагов.
Can I use multiple LLM providers in the same application?
Да, настройте нескольких провайдеров в вашем AI-библиотечном файле. Вы можете использовать OpenAI, Anthropic или других поддерживаемых провайдеров и переключаться между ними, передавая разные экземпляры моделей в streamText или generateObject.
How do I handle authentication in AI routes?
Оберните ваши обработчики маршрутов с помощью withAuthRequired для проверки пользовательских сессий. Всегда проверяйте session.user.id перед обработкой запросов и рассмотрите возможность логирования использования для каждого пользователя для отслеживания затрат.
What is generative UI and when should I use it?
Генеративный UI использует streamUI для рендеринга React-компонентов с сервера на основе решений LLM. Используйте его для дашбордов или интерфейсов, требующих динамического рендеринга компонентов на основе AI-анализа.
How do I cache AI responses to reduce costs?
Используйте Next.js unstable_cache для кэширования ответов на идентичные запросы. Установите соответствующее время ревалидации в зависимости от вашего случая использования. Это хорошо работает для повторяющихся запросов или справочных данных.

開發者詳情

檔案結構