Plexy
Pay API
Gate APISDKDashboard
Pay API
Gate APISDKDashboard
  1. Web
  • Overview
  • Authorization
  • Webhooks
  • API Errors
  • Test Scenarios
  • Ecommerce Plugins
  • API
    • Payments
      • Overview
      • Transaction Errors
      • Payment Links
        • Create Payment Link
        • List Payment Links
        • Retrieve Payment Link by Order Reference
        • Cancel Payment Link
        • Retrieve Payment Link
        • Update Payment Link Expiration
        • Retrieve Payment Links Statistics
      • Reccurent Payments
        • Create Merchant-Initiated Payment
      • Direct Payments
        • Get Keys
        • Create Host-to-Host Payment
      • Transaction Management
        • Find Transaction's History by ID
        • Find Transaction by Payment Link ID
        • Find Transaction by ID
        • Find Transaction by Order reference
      • Payment Management
        • Cancel Payment
        • Capture Payment
        • Process Refund
      • Split Requests
        • Create
        • List
        • Update
        • Get By Id
        • Delete
    • Payouts
      • Retrieve Payout Transactions
      • Process Payout
      • Save Card for Payouts
    • Customers
      • Get Customer's Card Tokens
      • List Customers
      • Create Customer
      • Get Customer by ID
      • Get Customer's Transactions
    • Merchants
      • Payment Beneficiary
        • Create
        • Update
        • Gey By Id
        • List
        • Transfer from beneficiary balance to merchant balance
        • Create manual settlement for beneficiary
      • Retrieve Merchant's Details
    • Wallet
      • Authorize
      • Сapture
      • Refund
      • Cancel
    • Payment Methods
      • Google Pay™ Integration
    • Invoice
      • List Bank Invoices
      • Create Bank Invoice
      • Get Bank Invoice
    • Distributions
      • Create distribution
      • List distributions
      • Get distribution by ID
      • Get distributions balance
  • Client SDK
    • SDK Overview
    • Wallet
      • Apple Pay
      • Google Pay
    • Android
      • Android Components
      • Android SDK
      • Android Drop-in
      • Android Customization
    • React Native
      • React Native SDK
    • Flutter
      • Flutter SDK
    • iOS
      • iOS Components
      • iOS Drop-in
      • iOS Customization
      • iOS SDK
    • Server Integration
      • Overview
      • Sessions Flow
      • Advanced Flow
      • Authentication
      • Result Codes and Errors
      • Payment Methods and Checkout Settings
      • Test and Live Payments
      • API Reference
      • Payment Methods
        • Get a list of available payment methods
      • Payments
        • Start a transaction
        • Submit details for a payment
      • Sessions
        • Create a payment session
        • Get the result of a payment session
    • Web
      • Web SDK
      • Web Customization
      • Web Drop-in
      • Web Components
  • Schemas
    • Schemas
      • response.TransactionList
      • entity.SplitRequest
      • entity.PaymentBeneficiary
      • request.CreatePaymentBeneficiary
      • entity.SettlementPaymentOrder
      • entity.PayoutRequest
      • entity.PayoutRequestRowData
      • entity.UserProfile Copy
      • entity.Store
      • request.AssignStoreToUser
      • request.RemoveStoreFromUser
      • entity.AccountExternalSystem
      • response.AssignStoreToUser
      • request.CreateStore
      • response.Store
      • response.UserList
      • request.WalletAuthorizeRequest
      • entity.ShortWalletTransaction
      • response.WalletAuthorizeResponse
      • request.WalletCapture
      • response.RemoveStoreFromUser
      • command.HandleThreeDResult
      • domain.Report
      • entity.CardSaveSessionCustomer
      • entity.Permission
      • entity.UserProfile
      • entity.UserRole
      • git_plexypay_com_ecom_back_api_internal_domain_view.Page-domain_Report
      • git_plexypay_com_ecom_back_api_internal_domain_view.Page-entity_UserProfile
      • models.CSVApiRequest
      • models.CreateBussinessDetails
      • models.KeyResponse
      • models.OnboardingRequest
      • models.Transaction
      • paymentcore.Address
      • paymentcore.CustomerDetails
      • request.AuthorizePayment
      • request.BrowserDetails
      • request.CardData
      • request.ChangeUserRole
      • request.ContinueThreeDS
      • request.CreateCardSaveSession
      • request.CreateInviteSession
      • request.CreatePaymentLink
      • request.CreatePaymentLinkMetadata
      • request.HandlePayout
      • request.MerchantInitiatedPayment
      • request.PasswordRequest
      • request.Recurring
      • request.RefundPayment
      • request.SaveCard
      • request.SaveOneCustomer
      • request.TwoStepAuthorizePayment
      • request.UpdateMerchantSettingsRequest
      • request.UpdatePaymentLink
      • response.AcquirerResponseThreeDSecure
      • response.AuthorizeAndCapturePayment
      • response.AuthorizePayment
      • response.CancelPaymentResponse
      • response.CapturePaymentResponse
      • response.ContinueThreeDS
      • response.Currency
      • response.Customer
      • response.CustomerTransaction
      • response.CustomerTransactions
      • response.Customers
      • response.Merchant
      • response.MerchantInitiatedPayment
      • response.MerchantSettings
      • response.PaymentLink
      • response.PaymentLinkInfo
      • response.PaymentLinkMetadata
      • response.PaymentLinksInfo
      • response.PaymentLinksStatistics
      • response.PaymentLinksStatisticsItem
      • response.Payout
      • response.Permission
      • response.RefundPaymentResponse
      • response.Report
      • response.SavedCard
      • response.Session
      • response.Settlement
      • response.SettlementTransaction
      • response.Store
      • response.Stores
      • response.Transaction
      • response.TransactionDetails
      • response.TransactionEvents
      • response.TransactionHistoryEvent
      • response.TransactionHistoryEventData
      • response.TransactionResponse
      • response.TransactionWebhookDetails
      • response.Transactions
      • response.UpdateMerchantSettingsResponse
      • response.UserProfile
      • value.PaymentMethod
    • receipt
    • Error
    • response.BankInvoice
    • DistributionStatus
    • LivenessResponse
    • DecimalAmount
    • errors.Source
    • Currency
    • AmountDto
    • ProductType
    • errors.Message
    • DistributionRecipient
    • PaymentMethodsRequestDto
    • ProductCategory
    • request.CreateBankInvoice
    • DistributionCreateRequest
    • PaymentMethodDto
    • Product
    • git_plexypay_com_ecom_back_api_internal_platform_errors.Code
    • DistributionBase
    • StoredPaymentMethodDto
    • response.Error
    • Order
    • DistributionCreatedResponse
    • PaymentMethodsResponseDto
    • AgentBalance
    • response.BankInvoiceList
    • DistributionDetailResponse
    • CreatePaymentDto
    • AgentDeposit
    • errors.Type
    • DistributionListItem
    • AdditionalDataDto
    • TopupRequest
    • DistributionListResponse
    • ActionDto
    • CreateOrderRequest
    • DistributionBalanceResponse
    • CreatePaymentResponseDto
    • PaymentDetailsDto
    • PaymentDetailsRequestDto
    • PaymentActionDto
    • FraudResultDto
    • ResponsePaymentMethodDto
    • PaymentDetailsResponseDto
    • ApplePayMerchantValidationRequestDto
    • ApplePayMerchantSessionResponseDto
    • ApplePaySessionRequestDto
    • ApplePaySessionResponseDto
    • GooglePayDecodeRequestDto
    • GooglePayPaymentMethodDetails
    • GooglePayDecryptedData
    • GooglePayDecodeSuccessResponseDto
    • RiskDataDto
    • GooglePayPaymentMethodDto
    • BrowserInfoDto
    • GooglePayPaymentRequestDto
    • EncryptedCardDataDto
    • GooglePayPaymentResponseDto
    • GooglePayPaymentErrorResponseDto
    • LineItemDto
    • AddressDto
    • CreateCheckoutSessionRequestDto
    • CreateCheckoutSessionResponseDto
    • PaymentDto
    • SessionResultResponseDto
    • EncryptedSessionDataDto
    • DecryptPaymentRequestDto
    • DecryptPaymentResponseDto
    • ThreeDSDetailsDto
    • SessionPaymentDetailsRequestDto
    • SessionPaymentDetailsResponseDto
    • CardDetailsRequestDto
    • CardBrandDetailsDto
    • CardDetailsResponseDto
    • PublicKeyResponseDto
  1. Web

Web SDK

The official Plexy client-side SDK for the browser. Build a full Drop-in checkout or compose individual payment Components in any web app, including React and Next.js. Works with either the Sessions flow (recommended) or the Advanced flow.
Requirements
Latest two versions of Chrome, Firefox, Safari, and Edge
Plexy Checkout API v2 or later
Node.js 18 or later for your server code

Installation#

Copy install command: npm install @plexy/plexy-web
Import the default stylesheet once in your app (for example in the root layout):

Imports#

The package ships two entry points:
@plexy/plexy-web (recommended): tree-shakable. Import only the components you use.
@plexy/plexy-web/auto: pre-registers every payment-method component. Simpler to start with but ships a larger bundle.
All examples below use the tree-shakable entry.

Browser Support#

The SDK supports the latest two versions of Chrome, Firefox, Safari, and Edge. Internet Explorer is not supported.

Next steps#

Drop-in
Mount the pre-built Plexy checkout UI in your web app
Components
Embed individual payment components for a fully custom flow
Customization
Theme the checkout, override per-method appearance, and customize the flow
Modified at 2026-07-07 10:25:45
Previous
Get the result of a payment session
Next
Web Customization
Built with