Разработчикам · Приложения

Создайте флоу продажи USDC, который пользователи действительно смогут завершить.

Хорошее офрамп-приложение — это в основном скучное управление состоянием: соберите маршрут, дайте кошельку подписать, восстановите способы оплаты, требующие расширения, покажите ссылку на депозит и сверьте события жизненного цикла после закрытия вкладки.

01

Фронтенд-путь

  1. 1Соберите сумму, платёжную платформу, фиатную валюту и идентификатор для выплаты.
  2. 2Передайте подключённый viem WalletClient в useOfframp() или createOfframp({ walletClient }).
  3. 3Отобразите состояния прогресса: approving, registering, depositing, confirming, delegating, restricting, resuming, done.
  4. 4Перехватывайте EXTENSION_REGISTRATION_REQUIRED для PayPal и Wise, затем запускайте usePeerExtensionRegistration(platform).
  5. 5Вызывайте deposits(address) при загрузке страницы, чтобы обновление не оставило продавца в подвешенном состоянии.
02

Состояние, которое следует хранить

ПолеПричина
depositIdОсновной хэндл для close(), OTC-ссылок и поддержки
txHashДоказательство того, что пользователь подписал и отправил транзакцию депозита
platform + currencyОтображение маршрута, поддержка и сегментация аналитики
метка identifierЧитаемая человеком ссылка на выплату; не храните секреты
integratorIdСтабильная атрибуция для продуктовой телеметрии и поддержки
03

Ограничения UX

  • SDK работает с мейннетом Base; публичной песочницы нет. Тестируйте с минимумом в 1 USDC.
  • Каждый созданный SDK депозит делегирует ценообразование волту Delegate. Не предлагайте ручное управление курсом для этого пути.
  • Фиат остаётся вне SDK. Покупатель и продавец рассчитываются напрямую внутри выбранного платёжного приложения.
  • Относитесь к webhooks как к подсказкам жизненного цикла, затем сверяйте узкое состояние владельца через deposits(); используйте Peerlytics API для более широких рыночных данных и аналитики.

Keep exploring

Common questions

Должно ли приложение-кошелёк использовать отдельную функцию или React-хук?

Используйте React-хук, когда вам нужны встроенные состояния загрузки, прогресса, ошибки и результата. Используйте createOfframp({ walletClient }), когда у вашего приложения есть собственная машина состояний.

Что показывать, когда PayPal или Wise не проходит регистрацию?

Перехватите EXTENSION_REGISTRATION_REQUIRED, предложите пользователю установить или подключить расширение Peer, завершите захват учётных данных продавца через usePeerExtensionRegistration(), затем повторите исходный депозит.