Вбудувати 6MM Trading Widget: Швидкий старт

Trading Widget SDK інтегрує 6MM торговий інтерфейс у веб-сторінку, що належить партнеру. Найшвидша інтеграція вимагає видимого контейнера, скрипта SDK виробництва та виклику TradingWidget.create().

Перш ніж почати

• Запустити приклад із веб-сторінки, яка може завантажувати ресурси з https://app.6mm.com.
• Надайте контейнеру віджета явну ширину та висоту.
• Завантажте SDK перед тим, як викликати TradingWidget.create().
• Планувати потік автентифікації перед тим, як увімкнути функції облікового запису або торгівлі у продакшенгу.

Мінімальний приклад

1
<div id="trading-widget" style="width: 100%; height: 720px"></div>
2
3
<script src="https://app.6mm.com/sdk/trading-widget/v1/index.js"></script>
4
<script>
5
  const widget = TradingWidget.create('#trading-widget', {
6
    baseUrl: 'https://app.6mm.com',
7
    symbol: 'BTCUSDT',
8
    theme: 'dark',
9
    locale: 'en',
10
    layout: 'default',
11
    display: {
12
      showHeader: false,
13
      showTicker: false,
14
      hidden: [],
15
    },
16
    onReady(event) {
17
      console.log('ready', event)
18
    },
19
    onError(error) {
20
      console.error('error', error)
21
    },
22
  })
23
</script>

Коли інтеграція успішна, SDK створює iframe всередині #trading-widget і викликає onReady. Захоплюйте onError під час розробки, щоб було видно збої при конфігурації та навантаженні.

SDK URL

Встановити baseUrl явно

Під час тестування зі сторінок, що належать партнеру, пропускайте baseUrl так, щоб iframe завжди вказував на веб-домен 6MM .

Керування відображенням

Партнерські вбудовки за замовчуванням приховують заголовок ПК і тікер нижнього ринку. Використовуйте display , коли потрібно показати ці оболонкові зони або приховати високорівневі контейнери на вбудованій сторінці торгівлі.

1
display: {
2
  showHeader: false,
3
  showTicker: false,
4
  hidden: ['account'],
5
}

Розмір контейнера

Для адаптивних макетів тримайте ширину плавною і встановлюйте відповідну мінімальну висоту для кожної точки розриву. Контейнер з нульовою висотою може успішно завантажити SDK , залишаючи торговий інтерфейс невидимим.

Перевірте інтеграцію

1. Переконайтеся, що скрипт SDK успішно повертається в мережевій панелі браузера.
2. Підтвердити, onReady запускається після ініціалізації iframe.
3. Протестуйте налаштовані symbol, locale, тему та приховані секції.
4. Змініть розмір сторінки між десктопними та мобільними точками зупинки.
5. Завершити автентифіковане тестування з невиробничим користувачем перед запуском.

Поширені проблеми

Наступні кроки