Osadz 6MM Trading Widget: Szybki start

Trading Widget SDK osadza interfejs 6MM tradingu na stronie należącej do partnera. Najszybsza integracja wymaga widocznego kontenera, skryptu SDK produkcyjnego oraz wywołania TradingWidget.create().

Zanim zaczniesz

• Uruchom przykład ze strony internetowej, która może ładować zasoby z https://app.6mm.com.
• Nadać kontenerowi widżetu wyraźną szerokość i wysokość.
• Załaduj SDK przed zadzwonieniem TradingWidget.create().
• Zaplanuj przepływ uwierzytelniania przed włączeniem funkcji konta lub handlu w produkcji.

Minimalny przykład

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>

Gdy całkość się powiedzie, SDK tworzy ramkę i-frame wewnątrz #trading-widget i wywołuje onReady. Rejestruj onError podczas tworzenia, aby awarie konfiguracji i ładowania były widoczne.

SDK URL-y

Ustaw baseUrl wprost

Podczas testowania ze stron należących do partnerów przekażcie baseUrl , aby iframe zawsze wskazywał 6MM domenę internetową.

Sterowanie wyświetlaczem

Partnerskie osadzenia domyślnie ukrywają nagłówek PC i indeks rynku najniższego dochodu. Używaj display , gdy musisz pokazać te obszary powłoki lub ukryć kontenery wysokiego poziomu na osadzonej stronie handlowej.

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

Rozmiar pojemnika

Dla responsywnych układów utrzymuj płynność szerokości i ustaw odpowiednią minimalną wysokość dla każdego punktu przerwania. Kontener o zerowej wysokości może skutecznie załadować SDK , pozostawiając interfejs handlowy niewidocznym.

Zweryfikowaj integrację

1. Potwierdź, że skrypt SDK powraca pomyślnie w panelu sieciowym przeglądarki.
2. Potwierdź onReady uruchamia się po iuruchomieniu ramki i-frame.
3. Testuj skonfigurowane symbol, locale, motyw i ukryte sekcje.
4. Zmieniać rozmiar strony na pulpitach i urządzeniach mobilnych.
5. Przed premierą przeprowadzić uwierzytelniony test z użytkownikiem spoza produkcji produkcyjnej.

Typowe problemy

Kolejne kroki