Fuspay
WebsiteSupportDemo Meeting
  • Overview
    • Welcome
  • API ONBOARDING
    • Introduction
    • Partner Onboarding
    • Regenerate Partner Keys
    • IP Check & Whitelisting
  • API Onboarding
  • Authentication
    • Swap, Collection, & P2P Automation
  • Webhook Validation & Request Integrity
  • Currency Swap
    • Introduction
    • Authentication
      • Partner Onboarding Endpoints
      • Partner Activate Endpoint
      • Regenerate Partners Public & Private Keys
      • Digital Signature
    • User KYC
      • Create KYC
      • Verify KYC Status
      • Reconciliation
      • Post KYC Data
    • Exchange Rate
    • Buy
      • Create Order
      • Events
    • Sell
      • Create Order
      • Events
    • Transaction Resolution
      • Overview
      • Log Issue
      • Check Issue Status
    • Transaction Records
      • Pending Transaction
      • Get Single Order Endpoint
      • Get Multiple Order Endpoint
      • Sell/Payout Verification Endpoint
    • Provider/Bank Codes
  • Virtual card
    • Introduction
      • Getting Started
        • Partner Onboarding
        • Partner Activate Endpoint
    • Authentication
    • Partner
      • Create Merchant
      • List of Merchants
    • Merchant
      • Create User
      • Verify User KYC Status
      • List Users
    • User
      • Create Card
      • Fetch Cards
      • Get Card Details
    • Card
      • Fund Card
      • Freeze Card
      • Delete Card
    • Payments
      • Withdraw From Card
      • Withdrawal History
    • Transactions
      • Card Transactions
      • Export Card Transactions
      • Filter Card Transactions
    • Wallet
      • Merchant Wallet Balance
      • Card Wallet Balance
  • Collection and payout
    • Introduction
    • Onboarding
    • Getting Started for Partner
      • Partner Onboarding Endpoints
      • IP Capture & Whitelisting
      • Regenerate Partners Pub/Priv Keys
    • Getting Started for Merchant
    • Collection
      • Digital Signatures
      • Collection (GHS, KHS, ZAR)
      • Collection (Virtual Account-NGN )
      • Fetch Order
      • Assigning Virtual Accounts
        • Get Available Assignable Virtual Account
        • Check if specific account is available for use
        • Create Order- using Available Virtual Account from your Account Pool
        • Cancel Order
      • Get Mobile Money Providers
    • Payout
      • Account verification
      • Payout
      • Payout Status
      • Crypto Withdrawal
        • Wallet Balance
        • Withdrawal Payout
        • Get Withdrawal Payout Fee
      • Bank and Bank Codes
    • Transaction History
      • Get Transaction Records
  • P2p Automation
    • Integration Journey (API-Dashboard)
  • Payment and Utilities
    • Introduction
      • Sign Up
      • Compliance
      • Create an App
      • Configure App
    • Authentication
    • User Onboarding
    • Error Handling
    • Plugin (Frontend)
      • Integrating Finswich checkout via NPM or Yarn
      • Integrating the Finswich Checkout on your Vanilla Javascript app
      • Steps for integrating Finswich Checkout via Flutter
      • Pseudocode for Integrating Finswich Checkout in Application (Native iOS & Android)
    • Services (Backend)
      • Inter-wallet Transfer
      • Bank Transfer
      • Wallet Funding
      • Utility Purchases
  • KYC As A Service
    • Introduction
    • App Registration Endpoint
    • App Activate/Verify Endpoint
    • Request Verification Token
    • KYC (Individual)
      • Get KYC Types
      • Create KYC Request
      • Get Verification Status and User's Data
      • Create order with meta data
      • Migrate
    • KYC (Business)
      • Get KYC Types
      • Create KYC Request
      • Get Verification Status and User's Data
    • Face Stamp
      • Create Facestamp Order
      • Create OTP
      • Verify OTP
      • Post Transaction Data
    • KYC(Transactional)
    • Callbacks (Webhook Responses)
Powered by GitBook
On this page
  1. Payment and Utilities
  2. Plugin (Frontend)

Integrating the Finswich Checkout on your Vanilla Javascript app

<script src="https://cdn.jsdelivr.net/npm/[email protected]/index.min.js"></script>
vanilla Javascript Integration
<!<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Static Template</title>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/index.min.js"></script>
</head>

<body>

    <button onclick="Open()" >Open</button>
    <button onclick="Close()" >Close</button>
    <script>
        let myModal;
        
        const init_option = {
            reference: "your_user_ref",
            public_key:"your_finswich_live_public_key",
            balance: "your_current_user_balance",
            origin: "your_whitelisted_app_origin"
        };

        
        document.addEventListener("DOMContentLoaded", function () {
             myModal = new FinSwitch(init_option);
       
            });
            
            const Close = () => { 
                myModal.closeModal()
            }
            const Open = () => { 
                myModal.openModal()

         }    

    </script>
</body>

</html>

Integrating our checkout for Flutter and Dart Applications (Mobile)

PreviousIntegrating Finswich checkout via NPM or YarnNextSteps for integrating Finswich Checkout via Flutter

Last updated 3 months ago

https://pub.dev/packages/finswich_checkout