---
title: "Uploader API — загрузка ассетов по типу"
description: "Маршрутизация загрузок файлов и ссылок по типу ассета: обложка аудиоблока попадёт в ваш пайплайн изображений, а не в аудиоэндпоинт."
source: https://blokeditor.com/ru/docs/uploader-api/
lastmod: 2026-09-08
---

Фреймворк JavaScript

Расширение и система Загрузчик

На этой странице uploader.uploadByFile(file, ctx)

# Uploader API: загрузка ассетов по типу

Загрузить ассет через конвейер, который отвечает за его ТИП, а не через тот инструмент, который случайно оказался запрашивающим. Инструменты вызывают именно этот метод и не лезут в собственный `config.uploader`. Поэтому обложка аудиоблока попадает в ваш конвейер изображений, а не в аудиоэндпоинт, который её отверг бы.

Порядок разрешения для типа: сначала инструмент, у которого совпадает статический `assetKind` (например, `tools.image.config.uploader` для `'image'`), затем конфигурация `uploader` уровня редактора, затем локальный запасной вариант. Запасной вариант это `blob:` URL для файлов и URL как есть для ссылок.

Готовые реализации `uploader` смотрите на странице пресетов хранилищ: Supabase, S3-совместимое хранилище, Cloudinary и IndexedDB. Собственный бэкенд для них не нужен.

Обновлено 8 сент. 2026 г. [Редактировать на GitHub](https://github.com/JackUait/blok/blob/main/docs/src/components/api/api-data.ts)

### Как получить экземпляр редактора

Методы ниже вызываются на редакторе, созданном через new Blok(). Они доступны после того, как разрешится editor.isReady.

TypeScript

```
// You already hold the instance returned by the constructor.
const editor = new Blok({ holder: 'editor' });
await editor.isReady;

// Call any API method on it.
editor.caret.setToLastBlock('end');
```

## Методы

### uploader.uploadByFile(file, ctx)

Promise<{ url: string; fileName?: string }>

Сохранить файл и вернуть его URL. `ctx` это `{ kind, tool?, onProgress? }`, где `kind` это тип АССЕТА, а не запрашивающий инструмент. Они различаются всякий раз, когда инструмент держит ассет вне своего медиасемейства.

TypeScript

```
// Inside a custom block tool that holds a thumbnail
const { url } = await this.api.uploader.uploadByFile(file, {
  kind: 'image',
  tool: 'my-card',
  onProgress: (percent) => this.showProgress(percent),
});
```

### uploader.uploadByUrl(url, ctx)

Promise<{ url: string; fileName?: string }>

Разместить у себя ассет, который пользователь передал по URL, и вернуть сохранённый URL. Без загрузчика для этого типа URL сохраняется как есть. Настройте загрузчик, если строгая политика `img-src`/`media-src` или гниение ссылок сломают сторонние URL.

TypeScript

```
const { url } = await this.api.uploader.uploadByUrl(pastedUrl, {
  kind: 'image',
  tool: 'my-card',
});
```

### uploader.isConfigured(kind, method?)

boolean

Обрабатывает ли этот тип загрузчик хоста. False означает, что вызывающий получит локальный запасной вариант. Это помогает решить, стоит ли вообще загружать ассет: например, маленькую извлечённую обложку можно вместо этого встроить как `data:` URL.

TypeScript

```
if (this.api.uploader.isConfigured('image', 'uploadByFile')) {
  const { url } = await this.api.uploader.uploadByFile(artwork, { kind: 'image' });
} else {
  // no image pipeline — keep it inline rather than minting a doomed blob: URL
}
```