Skip to main content
ExodeMiniApp — основной класс клиента. Один экземпляр на приложение. Все методы типизированы и возвращают Promise.

Создание экземпляра

import { ExodeMiniApp } from '@exode-team/sdk/miniapp'

const app = new ExodeMiniApp({
  appId: 'my-app',        // required
  targetOrigin: '*',      // default '*'
  timeout: 10_000,        // ms, default 10000
})

Параметры конфигурации

appId
string
required
Идентификатор мини-приложения. Передаётся в handshake для валидации на стороне хоста.
targetOrigin
string
Origin хост-окна. По умолчанию *. В проде рекомендуется указывать конкретный origin Exode для безопасности.
timeout
number
Таймаут handshake и всех команд (мс). По умолчанию 10000.
Клиент должен исполняться внутри iframe. Попытка init() в top-level окне выбросит ошибку ExodeMiniApp must be used inside an iframe.

Инициализация

const ctx = await app.init()

console.log(ctx.user.firstName)
console.log(ctx.theme.scheme)
Метод выполняет handshake с хостом и возвращает MiniAppContext. Повторный вызов init() выбросит ошибку.
Если handshake не успел завершиться за timeout мс — Promise отклоняется. Проверьте, что iframe открыт внутри Exode и targetOrigin корректен.

Навигация (app.route)

// Open a route in the main app
await app.route.navigate('/course/123')

// With params
await app.route.navigate('/course/123', { tab: 'lessons' })

// Back through host history
await app.route.back()

UI-команды (app.ui)

// Snackbar notification
await app.ui.showSnackbar({
  message: 'Сохранено!',
  type: 'success', // 'success' | 'error' | 'info'
})

// Hide / show host bottom navigation
await app.ui.setTabbarVisible(false)

// Hide / show host header
await app.ui.setHeaderVisible(false)

// Close the mini app
await app.ui.close()

События (app.on)

Подписка на события хоста. Возвращает функцию отписки.
const unsubscribe = app.on('theme:changed', (theme) => {
  document.body.className = theme.scheme
})

app.on('user:updated', (user) => {
  console.log('User changed:', user.firstName)
})

app.on('route:changed', ({ path, params }) => {
  console.log('Host navigated to:', path)
})

// Unsubscribe
unsubscribe()
Полный список событий и их payload’ов — в разделе Контекст и типы.

Получение текущего контекста

init() возвращает контекст один раз. Для последующего доступа используйте getContext() — он всегда актуален, так как bridge автоматически применяет события context:updated.
const ctx = app.getContext()

if (ctx) {
  console.log(ctx.user.firstName)
}

Уничтожение

app.destroy()
Закрывает bridge, отключает слушатели postMessage, очищает обработчики событий. Вызывайте при размонтировании приложения.

Полный пример

import { ExodeMiniApp } from '@exode-team/sdk/miniapp'

const app = new ExodeMiniApp({ appId: 'my-app' })

async function start() {
  const ctx = await app.init()

  document.body.className = ctx.theme.scheme
  document.getElementById('hello')!.textContent = `Привет, ${ctx.user.firstName}`

  app.on('theme:changed', (theme) => {
    document.body.className = theme.scheme
  })

  document.getElementById('btn-save')!.addEventListener('click', async () => {
    await app.ui.showSnackbar({ message: 'Сохранено!', type: 'success' })
  })
}

start().catch(console.error)

window.addEventListener('beforeunload', () => app.destroy())