Desenvolvedores · Apps
Construa um fluxo de venda de USDC que os usuários consigam de fato concluir.
Um bom app de off-ramp é principalmente um gerenciamento de estado entediante: coletar a rota, deixar a carteira assinar, recuperar métodos de pagamento controlados por extensão, mostrar um link de depósito e reconciliar eventos do ciclo de vida depois que a aba fecha.
01
Caminho de frontend
- 1Colete valor, plataforma de pagamento, moeda fiat e identificador de pagamento.
- 2Passe o WalletClient da viem conectado para useOfframp() ou createOfframp({ walletClient }).
- 3Exponha os estados de progresso: aprovando, registrando, depositando, confirmando, delegando, restringindo, retomando, concluído.
- 4Capture EXTENSION_REGISTRATION_REQUIRED para PayPal e Wise, depois conduza usePeerExtensionRegistration(platform).
- 5Chame deposits(address) no carregamento da página para que um refresh não deixe um vendedor em andamento na mão.
02
Estado que você deve armazenar
| Campo | Motivo |
|---|---|
| depositId | Handle principal para close(), links OTC e suporte |
| txHash | Prova de que o usuário assinou e transmitiu a transação de depósito |
| platform + currency | Exibição da rota, suporte e segmentação de analytics |
| rótulo do identifier | Referência de pagamento legível por humanos; não armazene segredos |
| integratorId | Atribuição estável para telemetria de produto e suporte |
03
Restrições de UX
- O SDK aponta para a mainnet da Base; não há sandbox público. Teste com o mínimo de 1 USDC.
- Todo depósito criado pelo SDK delega o pricing ao vault da Delegate. Não apresente controles manuais de taxa para esse caminho.
- O fiat fica fora do SDK. O comprador e o vendedor liquidam diretamente dentro do app de pagamento selecionado.
- Trate webhooks como dicas do ciclo de vida, depois reconcilie o estado restrito do dono com deposits(); use a API da Peerlytics para dados de mercado e analytics mais amplos.
Keep exploring
Common questions
Um app de carteira deve usar a função independente ou o React hook?
Use o React hook quando quiser estados de loading, progresso, erro e resultado prontos. Use createOfframp({ walletClient }) quando o seu app tiver a sua própria máquina de estado.
O que devo mostrar quando o PayPal ou a Wise falham no registro?
Capture EXTENSION_REGISTRATION_REQUIRED, peça ao usuário para instalar ou conectar a extensão Peer, complete a captura de credencial de vendedor por meio de usePeerExtensionRegistration() e depois tente o depósito original novamente.