Configuração do Metaframe e adição dele ao seu aplicativo web.
Configuração do Metaframe na Conta de Distribuidor
Para fazer a configuração básica do Metaframe:
- No seu projeto na Conta de Distribuidor, vá para a seção Metaframe.
- Clique em Create Metaframe.
Aviso
O botão Create Metaframe só fica disponível depois de assinar o contrato de licenciamento.
- Clique na opção Enable Metaframe.
- No campo Login project, selecione o projeto Login configurado na etapa anterior.
Para informações mais detalhadas sobre a configuração dos recursos avançados do Metaframe, veja:
Integração do Metaframe em um aplicativo da web
Para adicionar o Metaframe ao seu aplicativo:
- No seu projeto na Conta de Distribuidor, vá para a seção Metaframe.
- Clique em Copy script code.
- Adicione o script ao seu código em uma das seguintes maneiras:
- Insira o script no cabeçalho ou corpo do arquivo HTML antes do seu aplicativo é inicializado como exibido no exemplo abaixo.
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>
- Crie um elemento script dentro do código JS do seu aplicativo e chame o método
window.metaframe.createdepois de carregar o script, como exibido no exemplo abaixo. Isso permite que o script Metaframe seja carregado dinamicamente.
- Crie um elemento script dentro do código JS do seu aplicativo e chame o 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);
Observação
Para uma descrição detalhada dos parâmetros do método
window.metaframe.create , veja a seção Explorar métodos e eventos do Metaframe.Este artigo foi útil?
Obrigado pelo seu feedback!
Avaliaremos sua mensagem e a usaremos para melhorar sua experiência.Encontrou um erro de texto ou digitação? Selecione o texto e pressione Ctrl+Enter.
