Configure Metaframe y añádalo a la aplicación web
Configure Metaframe en Cuenta del editor
Para realizar la configuración básica de Metaframe:
- En su proyecto de Cuenta del editor, vaya a la sección Metaframe.
- Haga clic en Copy script code.
Aviso
El botón Create Metaframe solo está disponible después de firmar el acuerdo de licencia.
- Haga clic en la opción Enable Metaframe.
- En el campo Login project, seleccione el proyecto de Login que estableció en el paso anterior.
Para obtener información detallada sobre la configuración de funciones avanzadas de Metaframe, consulte:
Integre Metaframe en la aplicación web
Para añadir Metaframe a su aplicación:
- En su proyecto de Cuenta del editor, vaya a la sección Metaframe.
- Haga clic en Copy script code.
- Añada el script a su código de una de las siguientes formas:
- Inserte el script en la cabecera o en el cuerpo del archivo HTML antes de iniciar la aplicación, como se muestra en el siguiente ejemplo.
Copy
- html
<!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>
- Cree un elemento script dentro del código JS de su aplicación y llame al método
window.metaframe.createdespués de cargar el script como se muestra en el siguiente ejemplo. Esto permite que el script Metaframe se cargue de forma dinámica.
- Cree un elemento script dentro del código JS de su aplicación y llame al método
Copy
- javascript
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);
Nota
Para obtener una descripción detallada de los parámetros del método
window.metaframe.create , consulte la sección Explore métodos y eventos de Metaframe.¿Te ha resultado útil este artículo?
¡Gracias por tu mensaje!
Nos ayudará a mejorar tu experiencia.¿Has encontrado una errata u otro error de texto? Selecciona el texto y pulsa Ctrl+Intro.
