Metaframe einrichten und zur Web-Anwendung hinzufügen

Metaframe im Kundenportal einrichten

So wird Metaframe grundlegend eingerichtet:

  1. Navigieren Sie im Kundenportal zum Menüpunkt Metaframe.
  2. Klicken Sie auf Metaframe erstellen.
Achtung
Die Schaltfläche Metaframe erstellen ist erst nach dem Unterschreiben der Lizenzvereinbarung verfügbar.
  1. Klicken Sie auf den Schalter Metaframe aktivieren.
  2. Im Feld Login-Projekt das Login-Projekt auswählen, das Sie im vorangegangenen Schritt eingerichtet haben.

Ausführliche Informationen zur Einrichtung der erweiterten Metaframe-Funktionen finden Sie unter:

Metaframe in die Web-Anwendung integrieren

So fügen Sie Metaframe in Ihre Anwendung ein:

  1. Navigieren Sie im Kundenportal zum Menüpunkt Metaframe.
  2. Klicken Sie auf Skriptcode kopieren
  3. Fügen Sie den Skript zu Ihrem Code auf eine der folgenden Arten hinzu:
    1. Fügen Sie das Skript in den Kopf oder Text der HTML-Datei ein, bevor Ihre Anwendung initialisiert wird, wie im folgenden Beispiel gezeigt.
Copy
Full screen
Small screen
<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <title>Integration example</title>
</head>

<body>
    <script src="https://cdn.xsolla.net/metaframe-web-wallet-widget-prod/container/v1/metaframe.js"></script>
    <script>

        window.metaframe.create({

            loginProjectId: '00000000-0000-0000-0000-000000000000',
            merchantId: 000001,
            projectId: 000001,
            orbsApiHostId: '00000000-0000-0000-0000-000000000000',
            isMobile: false,
            isCollapsed: false,
            layoutSettings: {
                desktop: {
                    widgetMarginTop: 16
                },
                mobile: {
                    widgetMarginTop: 72
                },
            },

        });

    </script>
    <script src="YOUR_APPLICATION_HERE.js"></script>
</body>

</html>
    1. Erstellen Sie ein Skript-Element innerhalb des JS-Codes Ihrer Anwendung und rufen Sie die Methode window.metaframe.create nach dem Laden des Skripts auf, wie im folgenden Beispiel gezeigt. Dadurch kann das Metaframe-Skript dynamisch geladen werden.
      Copy
      Full screen
      Small screen
      const metaframeScript = document.createElement("script");
      
      metaframeScript.src = "https://cdn.xsolla.net/metaframe-web-wallet-widget-prod/container/v1/metaframe.js";
      
      metaframeScript.onload = () => {
      
          window.metaframe.create(
      
              {
                  loginProjectId: '00000000-0000-0000-0000-000000000000',
                  merchantId: 000001,
                  projectId: 000001,
                  orbsApiHostId: '00000000-0000-0000-0000-000000000000',
                  isMobile: false,
                  isCollapsed: false,
                  layoutSettings: {
                      desktop: {
                          widgetMarginTop: 16
                      },
                      mobile: {
                          widgetMarginTop: 72
                      },
                  },
              }
      
          );
      
      };
      
      document.body.appendChild(metaframeScript);
      
      Hinweis
      Eine detaillierte Beschreibung der Parameter der Methode window.metaframe.create finden Sie im Abschnitt Metaframe-Methoden und Ereignisse.
      War dieser Artikel hilfreich?
      Vielen Dank!
      Gibt es etwas, das wir verbessern können? Nachricht
      Das tut uns leid
      Bitte erläutern Sie, weshalb dieser Artikel nicht hilfreich ist. Nachricht
      Vielen Dank für Ihr Feedback!
      Wir werden Ihr Feedback aufgreifen und dazu nutzen, Ihr Erlebnis verbessern.
      Letztmalig aktualisiert: 13. Dezember 2024

      Haben Sie einen Tippfehler oder einen anderen Textfehler gefunden? Wählen Sie den Text aus und drücken Sie Strg+Eingabe.

Problem melden
Wir überprüfen unsere Inhalte ständig. Ihr Feedback hilft uns, sie zu verbessern.
Geben Sie eine E-Mail-Adresse an, damit wir Sie erreichen können
Vielen Dank für Ihr Feedback!