Інтеграція Claude API в мобільний додаток
Типова ситуація: ви розробляєте мобільний чат-асистент на Swift або Kotlin і вибираєте між OpenAI та Anthropic. Claude API від Anthropic дає контекст до 200k токенів (claude-3-5-sonnet), нативну підтримку vision та відмінну якість російської мови. Ми підключаємо Claude до вашого додатку під ключ: від архітектури backend-proxy до фінального тестування streaming. Наш досвід — понад 30 проєктів з AI-інтеграціями, що дозволяє скоротити час виведення на ринок у 2-3 рази порівняно з самостійною розробкою.
Безпечна робота з ключами
Anthropic API key (sk-ant-...) категорично заборонено зберігати на клієнті. Правило одне: ключ тільки на backend. Мобільний клієнт спілкується з вашим proxy-сервером, який додає заголовок x-api-key і передає запит в api.anthropic.com. Архітектура proxy: будь-який backend — Laravel, FastAPI, Cloudflare Worker. Мінімальна реалізація на Cloudflare Worker займає ~30 рядків і обробляє як звичайні запити, так і streaming. Холодний старт Workers — 5–10 ms, latency непомітна.
На стороні мобільного клієнта: JWT-аутентифікація користувача на proxy. Proxy перевіряє токен, застосовує rate limiting (наприклад, 20 запитів/хвилину на користувача) і логує input_tokens/output_tokens для аналітики витрат. Ми гарантуємо, що ключ не покине backend.
Чому Messages API відрізняється від OpenAI?
Anthropic Messages API відрізняється від OpenAI Chat Completions кількома деталями:
- Системний промпт — окреме поле system, не елемент масиву messages. Правильніше тримати системний контекст у system, а не в messages[0] з role: "system".
- Ролі: тільки user та assistant (немає system у messages).
- Немає function_calling — є tools з input_schema у форматі JSON Schema.
{
"model": "claude-haiku-4-5",
"max_tokens": 1024,
"system": "Ти помічник у мобільному додатку ...",
"messages": [
{
"role": "user",
"content": "Поясни цей документ"
},
{
"role": "assistant",
"content": "Звісно, ..."
},
{
"role": "user",
"content": "А що означає пункт 3?"
}
]
}Streaming на мобільному: як прискорити відповідь
Claude API підтримує SSE-streaming з stream: true. Формат трохи відрізняється від OpenAI: подія content_block_delta несе delta.text — це токен; message_stop — кінець потоку. На iOS парсимо через URLSessionDataDelegate, на Android — OkHttp EventSource. Дельта-події приходять кожні 10–50 ms при активній генерації. Буферизуємо перед оновленням UI: оновлюємо @Published var streamText не при кожній події, а через Throttle publisher (iOS) або distinctUntilChanged + debounce (Android Flow).
Порівняння streaming Claude vs OpenAI:
| Параметр | Claude (SSE) | OpenAI (SSE) |
|---|---|---|
| Формат подій | content_block_delta / message_stop | choices[i].delta.content / finish_reason |
| Затримка першого токена | ~350 мс (середня) | ~300 мс |
| Підтримка vision у streaming | Так | Так (але через gpt-4-vision) |
| Буферизація на клієнті | Throttle / debounce | Аналогічно |
Як аналізувати зображення через Claude на мобільному?
Claude 3+ нативно підтримує зображення у messages. Формат:
{
"role": "user",
"content": [
{
"type": "image",
"source": {
"type": "base64",
"media_type": "image/jpeg",
"data": "<base64>"
}
},
{
"type": "text",
"text": "Що зображено на фото?"
}
]
}На мобільному: стискаємо зображення перед відправленням. JPEG якість 70, максимальний розмір 1568×1568 (обмеження API). Resize + compress через UIGraphicsImageRenderer (iOS) або Bitmap.createScaledBitmap + compress (Android). Економія токенів у 5–10 разів порівняно з відправленням RAW.
Управління діалогом та RAG
Claude тримає 200k токенів, але для мобільного чату це overkill і дорого. На практиці — ковзне вікно останніх 20 повідомлень достатньо. Для спеціалізованих додатків (юридичний асистент, медичний довідник) — RAG (Retrieval Augmented Generation): зберігаємо документи у векторній БД на backend, при кожному запиті доповнюємо system промпт релевантними фрагментами. Не збільшує розмір історії, але дає доступ до великої бази знань. Детальніше про RAG у документації Anthropic.
Обробка помилок Anthropic API
529 Overloaded — сервери перевантажені, застосовуємо експоненційний backoff. 400 з error.type = "invalid_request_error" — зазвичай перевищено max_tokens або невірний формат content. 401 — невірний ключ на proxy. Всі помилки логуємо з request ID (x-request-id) — потрібен для звернення в підтримку Anthropic.
Кейс: юридичний асистент для B2B-додатку. Використали claude-3-5-sonnet, аналіз договорів. Користувач фотографує сторінку договору, асистент виділяє ключові умови та ризики. Зображення resize до 1200px по довгій стороні, JPEG 80. Середній запит: 2400 input tokens (зображення ~1800 + текст 600) + 800 output. Streaming — перші слова з'являються через 350 ms. Користувачі не помічають затримку при streaming порівняно з «порожнім екраном 4 секунди» без нього.
Порівняння моделей Claude
| Модель | Швидкість | Контекст | Вартість за 1M токенів (input/output) |
|---|---|---|---|
| Claude Haiku | Швидка | 200k | $0.25 / $1.25 |
| Claude Sonnet | Середня | 200k | $3.00 / $15.00 |
| Claude Opus | Повільна | 200k | $15.00 / $75.00 |
Вибір моделі залежить від сценарію: для простого чату Haiku, для складного аналізу — Sonnet або Opus. Ми допоможемо підібрати оптимальну модель та налаштувати fallback для зниження витрат.
Що входить у роботу
- Архітектура backend-proxy (Cloudflare Worker / Laravel / FastAPI)
- Інтеграція Messages API з streaming та vision
- Управління діалогами (ковзне вікно, RAG при необхідності)
- Логування токенів та обробка помилок
- Документація з розгортання та підтримки
- Тестування з TestFlight / Firebase App Distribution
Терміни та вартість
Базова інтеграція з streaming, контекстом діалогу та backend-proxy — 3–5 робочих днів. З підтримкою зображень та RAG — 1–2 тижні. Вартість розраховується індивідуально. Зв'яжіться з нами для оцінки вашого проєкту — ми підготуємо пропозицію протягом дня. Також ви можете замовити консультацію з архітектури — її вартість спишеться з основного проєкту.
