Skip to content
React Native bridge for Google Pay
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
Example
android add stripe support (#3) Jul 11, 2019
.gitattributes Initial commit Jun 13, 2019
.gitignore Initial commit Jun 13, 2019
.npmignore Initial commit Jun 13, 2019
CHANGELOG.md
README.md Update README.md Jul 11, 2019
emulator.gif Initial commit Jun 13, 2019
index.d.ts add stripe support (#3) Jul 11, 2019
index.js Initial commit Jun 13, 2019
package.json bump version (1.3.0) Jul 11, 2019

README.md

react-native-google-pay

react-native version npm npm (tag)

Accept Payments with Google Pay for React Native apps.


Getting started

$ yarn add react-native-google-pay

Mostly automatic installation

$ react-native link react-native-google-pay

Manual installation

Android

  1. Open up android/app/src/main/java/[...]/MainActivity.java
  • Add import com.busfor.RNGooglePayPackage; to the imports at the top of the file
  • Add new RNGooglePayPackage() to the list returned by the getPackages() method
  1. Append the following lines to android/settings.gradle:
    include ':react-native-google-pay'
    project(':react-native-google-pay').projectDir = new File(rootProject.projectDir, 	'../node_modules/react-native-google-pay/android')
    
  2. Insert the following lines inside the dependencies block in android/app/build.gradle:
      implementation project(':react-native-google-pay')
    

Enable Android Pay in your Manifest

To enable Google Pay in your app, you need to add the following Google Pay API meta-data element to the <application> element of your project's AndroidManifest.xml file.

<meta-data
    android:name="com.google.android.gms.wallet.api.enabled"
    android:value="true" />

Usage

import { GooglePay } from 'react-native-google-pay';

const allowedCardNetworks = ['VISA', 'MASTERCARD'];
const allowedCardAuthMethods = ['PAN_ONLY', 'CRYPTOGRAM_3DS'];

const requestData = {
  cardPaymentMethod: {
    tokenizationSpecification: {
      type: 'PAYMENT_GATEWAY',
      // stripe (see Example):
      gateway: 'stripe',
      gatewayMerchantId: '',
      stripe: {
        publishableKey: 'pk_test_TYooMQauvdEDq54NiTphI7jx',
        version: '2018-11-08',
      },
      // other:
      gateway: 'example',
      gatewayMerchantId: 'exampleGatewayMerchantId',
    },
    allowedCardNetworks,
    allowedCardAuthMethods,
  },
  transaction: {
    totalPrice: '10',
    totalPriceStatus: 'FINAL',
    currencyCode: 'USD',
  },
  merchantName: 'Example Merchant',
};

// Set the environment before the payment request
GooglePay.setEnvironment(GooglePay.ENVIRONMENT_TEST);

// Check if Google Pay is available
GooglePay.isReadyToPay(allowedCardNetworks, allowedCardAuthMethods)
  .then((ready) => {
    if (ready) {
      // Request payment token
      GooglePay.requestPayment(requestData)
        .then((token: string) => {
          // Send a token to your payment gateway
        })
        .catch((error) => console.log(error.code, error.message));
    }
  })

Demo

You can run the demo by cloning the project and running:

$ yarn demo

You can’t perform that action at this time.