Socket
Socket
Sign inDemoInstall

@juspay/ec-react-native-sdk

Package Overview
Dependencies
Maintainers
1
Versions
1
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@juspay/ec-react-native-sdk

React native wrapper around ExpressCheckout's native sdk


Version published
Maintainers
1
Created
Source

React Native wrapper around our native SDK. We currently only support Android.

Before proceeding, you must understand ExpressCheckout's payment flow, please check : https://juspay.in/docs/advanced/ec/android_integration/index.html

Getting Native SDK

The native sdk must be added to the app's build.gradle. Add the following to {project_directory}/android/app/build.gradle file

repositories {
  mavenCentral()
  maven {
    url 'https://s3-ap-southeast-1.amazonaws.com/jp-build-packages/ec-android-sdk'
  }
  maven {
    url 'https://s3-ap-southeast-1.amazonaws.com/godel-release/godel/'
  }
}

dependencies {
  compile 'in.juspay:ec-android-sdk:1.1.4'
  compile 'com.android.support:support-v4:23.4.0'
}

Installation

Run the following command from your project directory to install the sdk

$ npm i @juspay/ec-react-native-sdk --save

Link the library with the following command

$ react-native link @juspay/ec-react-native-sdk

Usage

Import ExpressCheckout module to your component

import ExpressCheckout from '@juspay/ec-react-native-sdk'

Native Checkout

An inbuilt native screen is provided for convenience - this is more flexible and offers greater customization options. Offers native support for the following payment methods: Cards, NetBanking and Wallets.

var paymentOptions = {
  "environment" : "PRODUCTION",
  "merchantId" : "merchant",
  "orderId" : "order_id",
  "endUrlRegexes" : ["https:\\/\\/shop\\.com\\/payment-response"],
  "paymentInstruments" : ["SAVED_CARD", "CARD", "NB", "WALLET"],
  "orderSummary" : {
    "openModeTitle" : "ExpressCheckout",
    "closedModeTitle" : "ExpressCheckout",
    "Name" : "Customer Name",
    "Amount" : "INR 1",
    "Phone" : "9876543210"
  }
}
ExpressCheckout.expressCheckoutScene(paymentOptions, (url) => {
  // endUrlCallback : Called whenever an endUrl is matched with the URL that is loading in the browser
  // The matched url will be passed
}, () => {
  // errorCallback : Called whenever an error occurs or when the user presses back button
  // Recommended to show the cart screen with an error message
})

Mobile Web Checkout

This mode of checkout opens a mobile optimized web page within the android app to take the payment input from the customer. This is the most straightforward integration. If you wish to disallow certain payment options, you have to explicitly remove the option from the array. If an empty array is passed, then all options are made available

var paymentOptions = {
  "environment" : "SANDBOX",
  "merchantId" : "merchant",
  "orderId" : "order_id",
  "endUrlRegexes" : ["https:\\/\\/shop\\.com\\/payment-response"],
  "paymentInstruments" : ["SAVED_CARD", "CARD", "NB", "WALLET"]
}
ExpressCheckout.mobileWebCheckoutScene(paymentOptions, (url) => {
  // endUrlCallback : Called whenever an endUrl is matched with the URL that is loading in the browser
  // The matched url will be passed
}, () => {
  // errorCallback : Called whenever an error occurs or when the user presses back button
  // Recommended to show the cart screen with an error message
})

Core API Checkout

If you have already built screens to accept card & netbanking options, then you can directly initiate a payment with the customers choice.

Card Payment API

var paymentOptions = {
  "environment" : "SANDBOX",
  "merchantId" : "merchant",
  "orderId" : "order_id",
  "endUrlRegexes" : ["https:\\/\\/shop\\.com\\/payment-response"],
  "nameOnCard" : "Name",
  "cardNumber" : "4242424242424242",
  "cardExpiryMonth" : "05",
  "cardExpiryYear" : "2020",
  "cardSecurityCode" : "123"
}
ExpressCheckout.cardPaymentAPI(paymentOptions, (url) => {
  // endUrlCallback : Called whenever an endUrl is matched with the URL that is loading in the browser
  // The matched url will be passed
}, () => {
  // errorCallback : Called whenever an error occurs or when User presses back button
  // Recommended to show the cart screen with an error message
})

NetBanking Payment API

var paymentOptions = {
  "environment" : "SANDBOX",
  "merchantId" : "merchant",
  "orderId" : "order_id",
  "endUrlRegexes" : ["https:\\/\\/shop\\.com\\/payment-response"],
  "bank" : "NB_AXIS"
}
ExpressCheckout.netBankingPaymentAPI(paymentOptions, (url) => {
  // endUrlCallback : Called whenever an endUrl is matched with the URL that is loading in the browser
  // The matched url will be passed
}, () => {
  // errorCallback : Called whenever an error occurs or when the user presses back button
  // Recommended to show the cart screen with an error message
})

Wallet Payment API

var paymentOptions = {
  "environment" : "PRODUCTION",
  "merchantId" : "merchant",
  "orderId" : "order_id",
  "endUrlRegexes" : ["https:\\/\\/shop\\.com\\/payment-response"],
  "wallet" : "OLAMONEY"
}
ExpressCheckout.walletPaymentAPI(paymentOptions, (url) => {
  // endUrlCallback : Called whenever an endUrl is matched with the URL that is loading in the browser
  // The matched url will be passed
}, () => {
  // errorCallback : Called whenever an error occurs or when the user presses back button
  // Recommended to show the cart screen with an error message
})

Keywords

FAQs

Package last updated on 03 Jan 2017

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc