Incorpora il 6MM Trading Widget: Avvio rapido

Il Trading Widget SDK incorpora l’interfaccia di trading 6MM all’interno di una pagina web di proprietà del partner. L’integrazione più rapida richiede un container visibile, lo script di produzione SDK e una chiamata al TradingWidget.create().

Prima che iniziate

• Eseguire l’esempio da una pagina web che può caricare risorse da https://app.6mm.com.
• Assegnare al contenitore del widget una larghezza e un’altezza esplicite.
• Carica il SDK prima di chiamare TradingWidget.create().
• Pianificare il flusso di autenticazione prima di abilitare funzionalità di conto o trading in produzione.

Esempio minimo

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>

Quando l’integrazione ha successo, il SDK crea un iframe all’interno di #trading-widget e chiama onReady. Cattura onError durante lo sviluppo in modo che i fallimenti di configurazione e caricamento siano visibili.

SDK URL

**Impostato esplicitamente baseUrl **

Quando test da pagine di proprietà partner, passa baseUrl così l’iframe punta sempre al dominio web 6MM .

Controlli di visualizzazione

Gli embedded partner nascondono di default l’intestazione PC e il ticker di mercato inferiore. Usa display quando devi mostrare quelle aree di shell o nascondere container di alto livello nella pagina di trading incorporata.

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

Dimensione del contenitore

Per layout responsive, mantenere la larghezza fluida e impostare un’altezza minima appropriata per ogni punto di rottura. Un contenitore con altezza zero può caricare il SDK con successo lasciando invisibile l’interfaccia di trading.

Verifica l’integrazione

1. Conferma che lo script SDK ritorni con successo nel pannello di rete del browser.
2. Conferma onReady spara una volta che l’iframe è stato inizializzato.
3. Testare le symbolconfigurate, locale, tema e sezioni nascoste.
4. Ridimensionare la pagina tra i punti di interruzione desktop e mobile.
5. Completare un test autenticato con un utente non in produzione prima del lancio.

Problemi comuni

Passi successivi