Skip to content

Inicializando Frame

O método App.initializeFrame() é o principal ponto de entrada do SDK. Ele cria um singleton do objeto Frame e prepara a comunicação com a janela pai da plataforma.

Requisito

A aplicação deve ser executada dentro de um iframe da interface da plataforma Flowlu

ts
import App from '@flowlu/miniapp-jssdk'

const frame = await App.initializeFrame()
js
const App = window.FlowluMiniApp;

const frame = await App.initializeFrame();

Exemplo

Exibindo uma notificação com o nome do usuário atual:

ts
import { App, Toast } from '@flowlu/miniapp-jssdk'

try {
  const frame = await App.initializeFrame()

  // obter o usuário atual
  let result = await frame.rest.get('/core/user/get/')
  const user = result?.response

  if (user) {
    // notificação com o nome do usuário
    new Toast({
      title: `Olá, ${user.first_name || user.last_name || user.username}!`,
    }).show()
  } else {
    throw new Error('Não foi possível obter os dados do usuário atual')
  }
} catch (error) {
  console.error(error)
}
html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Flowlu MiniApp Demo</title>
  </head>
  <body>
    <script src="https://unpkg.com/@flowlu/miniapp-jssdk@latest/dist/miniapp-jssdk.min.js"></script>
    <script>
    document.addEventListener('DOMContentLoaded', async () => {
      const App = FlowluMiniApp;

      try {
        const frame = await App.initializeFrame();

        // obter o usuário atual
        let result = await frame.rest.get('/core/user/get/');
        const user = result?.response;

        if (user) {
          // notificação com o nome do usuário
          new App.Frame.Toast({
            title: `Olá, ${user.first_name || user.last_name || user.username}!`,
          }).show();
        } else {
          throw new Error('Não foi possível obter os dados do usuário atual');
        }
      } catch (error) {
        console.error(error);
      }
    });
    </script>
  </body>
</html>

Publicado sob a licença MIT.