naoufal / react-native-payments

Accept Payments with Apple Pay and Android Pay using the Payment Request API.
https://www.npmjs.com/package/react-native-payments
1.59k stars 413 forks source link

Possible Unhandled Promise Rejection (id: 1) 10 (on Android) #263

Open MohammedAliBinTaleb opened 3 years ago

MohammedAliBinTaleb commented 3 years ago

Thank you for Great Payment package mr @naoufal

I have issues with react-native-payment when I try to press button to show Android Pay it give me this Errror Possible Unhandled Promise Rejection (id: 1) 10

Even when I try to catch Error in console.log(Error) it show me this ===> "10" !

this is my code 👇

import { StatusBar } from "expo-status-bar";
import React from "react";
import { Button, StyleSheet, Text, View } from "react-native";
let ReactNativePayment = require("react-native-payments");
import { NativeModules } from "react-native";
const { ReactNativePayments } = NativeModules;
// let {ReactNativePayments } = require("react-native-payments");
global.PaymentRequest = ReactNativePayment.PaymentRequest;
export default function App() {
  const METHOD_DATA = [
    {
      supportedMethods: ["android-pay"],
      data: {
        supportedNetworks: ["visa", "mastercard", "amex"],
        currencyCode: "SAR",
        environment: "TEST", // defaults to production
        paymentMethodTokenizationParameters: {
          tokenizationType: "PAYMENT_GATEWAY",
          parameters: {
            publicKey: "???-???-???",
          },
        },
      },
    },
  ];
  const DETAILS = {
    // id: "1",
    displayItems: [
      {
        label: "Movie Ticket",
        amount: { currency: "SAR", value: "15.00" },
      },
    ],
    total: {
      label: "Merchant Name",
      amount: { currency: "SAR", value: "15.00" },
    },
  };
  const onPay = async () => {
    const paymentRequest = new global.PaymentRequest(METHOD_DATA, DETAILS);
    let respons = await paymentRequest.show();
  };
  return (
    <View style={styles.container}>
      <Text>Good</Text>
      <Button title="Pay open" onPress={onPay} />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#fff",
    alignItems: "center",
    justifyContent: "center",
  },
});

note : I have no idea how to generate publish key is this could be a problem ?

I hope you can help me as soon as possible 😅

MohammedAliBinTaleb commented 3 years ago

publish key ====> public key

nabilfreeman commented 3 years ago

Hi Mohammed, yes it is a problem - you need to sign up for a merchant account with either Stripe or Braintree to use the tokenization options. They will give you an API key.

If you exclude those you should have an Apple/Google cryptogram returned but you will need to decrypt it server side which is pretty complex, so I'd recommend going with one of the above. The signup process for Stripe is much easier than Braintree.

ahmed3ly commented 3 years ago

mohamed did it work with you ?

govarthananve commented 2 years ago

Please try with try...catch block

const onPay = async () => {
   try {
    const paymentRequest = new global.PaymentRequest(METHOD_DATA, DETAILS);
    let respons = await paymentRequest.show();
    } catch (e){
    // handle error
  }
  };
showtan001 commented 2 years ago

Hi Mohammed, yes it is a problem - you need to sign up for a merchant account with either Stripe or Braintree to use the tokenization options. They will give you an API key.

If you exclude those you should have an Apple/Google cryptogram returned but you will need to decrypt it server side which is pretty complex, so I'd recommend going with one of the above. The signup process for Stripe is much easier than Braintree.

I don't use Stripe and Braintree. How can I get publicKey? @govarthananve @nabilfreeman