This library has been forked from https://github.com/elanic-tech/react-native-paytm Updated it to work with the latest version of react-native and latest PayTM SDK.
react-native-paytm | react-native |
---|---|
1.0.11 | < 0.60 |
1.0.12 | >= 0.60 |
npm i --save @philly25/react-native-paytm
or
yarn add @philly25/react-native-paytm
Link it:
react-native link @philly25/react-native-paytm
Use CocoaPods installation if auto-linking doesn't work.
Add to your Podfile:
pod 'RNPayTm', :path => '../node_modules/@philly25/react-native-paytm'
Install it:
pod install && pod update
If it's not gonna work, then add libPaymentsSDK.a
to "Link Binary With Libraries" Build Phase for the RNPayTm target (in Pods project).
Libraries
➜ Add Files to [your project's name]
node_modules/@philly25/react-native-paytm
and add RNPayTm.xcodeproj
libRNPayTm.a
to your project's Build Phases
➜ Link Binary With Libraries
Cmd+R
)startPayment(details: PayTmPaymentDetails): void
type PayTmPaymentDetails = {
mode: 'Staging' | 'Production',
MID: string,
INDUSTRY_TYPE_ID: string,
WEBSITE: string,
CHANNEL_ID: string,
TXN_AMOUNT: string,
ORDER_ID: string,
EMAIL?: string,
MOBILE_NO?: string,
CUST_ID: string,
CHECKSUMHASH: string,
CALLBACK_URL: string,
MERC_UNQ_REF?: string,
};
For more details check official documentation: iOS and Android.
Example:
import React from 'react';
import { Platform } from 'react-native';
import Paytm from '@philly25/react-native-paytm';
// Data received from PayTM
const paytmConfig = {
MID: 'Value from PayTM dashboard',
WEBSITE: 'Value from PayTM dashboard',
CHANNEL_ID: 'WAP',
INDUSTRY_TYPE_ID: 'Retail',
CALLBACK_URL: 'https://securegw.paytm.in/theia/paytmCallback?ORDER_ID='
};
export default class Test extends React.Component {
componentWillMount() {
Paytm.addListener(Paytm.Events.PAYTM_RESPONSE, this.onPayTmResponse);
}
componentWillUnmount() {
Paytm.removeListener(Paytm.Events.PAYTM_RESPONSE, this.onPayTmResponse);
}
onPayTmResponse = (resp) => {
const {STATUS, status, response} = resp;
if (Platform.OS === 'ios') {
if (status === 'Success') {
const jsonResponse = JSON.parse(response);
const {STATUS} = jsonResponse;
if (STATUS && STATUS === 'TXN_SUCCESS') {
// Payment succeed!
}
}
} else {
if (STATUS && STATUS === 'TXN_SUCCESS') {
// Payment succeed!
}
}
};
runTransaction(amount, customerId, orderId, mobile, email, checkSum, mercUnqRef) {
const callbackUrl = `${paytmConfig.CALLBACK_URL}${orderId}`;
const details = {
mode: 'Staging', // 'Staging' or 'Production'
MID: paytmConfig.MID,
INDUSTRY_TYPE_ID: paytmConfig.INDUSTRY_TYPE_ID,
WEBSITE: paytmConfig.WEBSITE,
CHANNEL_ID: paytmConfig.CHANNEL_ID,
TXN_AMOUNT: `${amount}`, // String
ORDER_ID: orderId, // String
EMAIL: email, // String
MOBILE_NO: mobile, // String
CUST_ID: customerId, // String
CHECKSUMHASH: checkSum, //From your server using PayTM Checksum Utility
CALLBACK_URL: callbackUrl,
MERC_UNQ_REF: mercUnqRef, // optional
};
Paytm.startPayment(details);
}
}