Expo

Em apps Expo você usa o mesmo pacote @malvo/react-native-connect, que embute o widget hospedado do Malvo Connect ({baseUrl}/connect?token=...) numa react-native-webview.

O pacote usa módulos nativos (react-native-webview), por isso não roda no Expo Go. É necessário um dev client ou um build nativo (EAS Build / prebuild) para testá-lo e publicá-lo.

A conectividade fala com um único host de API, https://api.malvo.io. O widget e o dashboard ficam em https://malvo.io. Não há iniciação de pagamento (ITP).

Pré-requisitos

O único dado obrigatório é um Connect Token gerado pelo seu backend (POST /auth → apiKey → POST /connect_token → accessToken, TTL de 30 minutos). O clientId/clientSecret ficam só no servidor e nunca vão para o app.

Instalação

npx expo install @malvo/react-native-connect react-native-webview

Como o pacote tem código nativo, crie/atualize um dev client antes de rodar:

eas build --profile development --platform ios
eas build --profile development --platform android

npx expo prebuild
npx expo run:ios
npx expo run:android

Rodar pelo Expo Go falhará porque o react-native-webview é um módulo nativo não incluído nele. Sempre use um dev client ou um build nativo.

Uso

Renderize MalvoConnect dentro de um <Modal>, igual ao React Native puro:

import { Modal } from "react-native";
import { MalvoConnect } from "@malvo/react-native-connect";

function ConnectModal({ token, visible, onClose }) {
  return (
    <Modal visible={visible} animationType="slide" onRequestClose={onClose}>
      <MalvoConnect
        connectToken={token}
        baseUrl="https://malvo.io"
        includeSandbox={__DEV__}
        onSuccess={({ item }) => {
          console.log("connected", item.id);
          onClose();
        }}
        onError={(error) => console.warn(error.code, error.message)}
        onClose={onClose}
      />
    </Modal>
  );
}

Webhooks são a fonte da verdade. O onSuccess é apenas UX best-effort. Persista as conexões a partir dos webhooks item/created / item/updated no seu backend. Veja Webhooks.

Open Finance / OAuth (deep link)

Por padrão o consentimento roda dentro da WebView e retoma automaticamente. Para instituições que recusam WebViews embarcadas, configure oauthRedirectUri com o deep link completo. No Expo, o scheme do app é declarado no app.json e o prebuild gera os arquivos nativos correspondentes (CFBundleURLTypes no iOS, intent-filter no Android):

app.json

{
  "expo": {
    "scheme": "malvo"
  }
}

Defina o scheme no app.json

Use expo.scheme (ex.: malvo). O prebuild registra o scheme nativamente.

Passe o oauthRedirectUri ao gerar o token

No POST /connect_token do seu backend, informe options.oauthRedirectUri casando com o scheme, ex.: malvo://oauth-callback.

Defina oauthRedirectUri no componente

Passe oauthRedirectUri="malvo://oauth-callback" ao MalvoConnect.

No retorno do deep link, o SDK valida o URI completo e exige que o malvoFlowId reservado, adicionado pelo backend, corresponda ao connectTokenId atual. Só então recarrega a rota autenticada /connect?token=...&resumeItemId=..., sem encaminhar bearer, code bancário ou malvoFlowId pela bridge. Após recriar o processo, seu app precisa restaurar com segurança o mesmo Connect Token ainda válido; o SDK não persiste o token. Eventos nativos ainda exigem o nonce separado do fluxo (malvoBridgeNonce/claim bridgeNonce). Não adicione parâmetros reservados manualmente.

Props

string

required

O Connect Token de 30 minutos gerado pelo seu backend. Única prop obrigatória.

string

default:"https://malvo.io"

Origem que serve o widget hospedado.

boolean

Exibe conectores de sandbox (use __DEV__).

string

URI completo (ex.: malvo://oauth-callback) para o retorno do OAuth via navegador externo. O scheme deve casar com expo.scheme do app.json.

string

Compatibilidade legada baseada somente no scheme. Não use em novas integrações.

Prop	Tipo	Notas
`connectToken`	`string`	Obrigatória. Token de 30 min do seu backend.
`baseUrl`	`string`	Origem que serve o widget. Padrão `https://malvo.io`.
`includeSandbox`	`boolean`	Exibe conectores de sandbox.
`updateItem`	`string`	Id do item para o fluxo de atualização.
`connectorTypes` / `connectorIds` / `countries` / `language` / `selectedConnectorId`	—	Filtros / dicas de UX.
`oauthRedirectUri`	`string`	URI completo preferencial para validar o retorno OAuth externo.
`oauthRedirectScheme`	`string`	Legado; valida somente o scheme.
`onSuccess` / `onError` / `onOpen` / `onClose` / `onEvent`	callbacks	Callbacks de ciclo de vida do widget.

Próximos passos

React Native — detalhes de props e callbacks.
Connect Widget — opções completas do widget.
Webhooks — a fonte da verdade para persistir conexões.

Visão geral

Web & JavaScript

Mobile

Pré-requisitos

Instalação

Uso

Open Finance / OAuth (deep link)

Props

Próximos passos

​Pré-requisitos

​Instalação

​Uso

​Open Finance / OAuth (deep link)

​Props

​Próximos passos

Pré-requisitos

Instalação

Uso

Open Finance / OAuth (deep link)

Props

Próximos passos