Unable to open on expo application

[alaksandarjesus]

I am trying to integrate Razor Checkout on my expo application and these are the steps i followed

https://razorpay.com/docs/payments/payment-gateway/react-native-integration/standard/build-integration-android/

npx expo install react-native-razorpay

npx expo prebuild

In my application

import RazorpayCheckout from 'react-native-razorpay';

const result = {
    "amount": 5000,
    "currency": "INR",
    "description": "Payment for credits",
    "image": "logo_url",
    "key": "rzp_live_**********",
    "name": "Site Name",
    "order_id": "order_NMUbv1Oagp6gss",
    "prefill": {
        "contact": "948********",
        "email": "r*******e@gmail.com",
        "name": "Name"
    },
    "theme": {
        "color": "#53a20e"
    }
}

RazorpayCheckout.open(result).then((data) => {
        // handle success
        alert(`Success: ${data.razorpay_payment_id}`);
    }).catch((error) => {
        // handle failure
        console.log("error", error)
        alert(`Error: ${error.code} | ${error.description}`);
});

And I get below error log

package.json

{
  "name": "******",
  "version": "1.0.0",
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo run:android",
    "ios": "expo run:ios",
    "web": "expo start --web",
    "build": "expo build",
    "publish": "expo publish"
  },
  "dependencies": {
    "@react-navigation/native": "^6.1.8",
    "@react-navigation/native-stack": "^6.9.14",
    "expo": "~49.0.13",
    "expo-file-system": "~15.4.5",
    "expo-image": "~1.3.5",
    "expo-secure-store": "~12.3.1",
    "expo-status-bar": "~1.6.0",
    "expo-storage": "^48.1.0",
    "formik": "^2.4.5",
    "lodash": "^4.17.21",
    "react": "18.2.0",
    "react-native": "0.72.6",
    "react-native-paper": "^5.10.6",
    "react-native-razorpay": "^2.3.0",
    "react-native-safe-area-context": "4.6.3",
    "react-native-screens": "~3.22.0",
    "react-native-vector-icons": "^10.0.0",
    "typescript": "^5.1.3",
    "yup": "^1.3.2",
    "expo-splash-screen": "~0.20.5"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0"
  },
  "private": true
}

[vivekshindhe]

@alaksandarjesus We've had other people face this issue. This is because the application is running on expo mode whereas it needs to run on development mode for the native modules to be used.

Here are the commands I followed. npx expo prebuild npx expo start -> expo go build a -> running app on android {you'll see error mentioned above} s -> switch to development mode a -> run app on android.

This is what we've seen works before too. Here's the link to the reply quoted above. Can you please try this and check if this resolves your issue?

[szaid6]

@alaksandarjesus We've had other people face this issue. This is because the application is running on expo mode whereas it needs to run on development mode for the native modules to be used.

Here are the commands I followed. npx expo prebuild npx expo start -> expo go build a -> running app on android {you'll see error mentioned above} s -> switch to development mode a -> run app on android.

This is what we've seen works before too. Here's the link to the reply quoted above. Can you please try this and check if this resolves your issue?

as far as I know there is only 1 build per day right for the free tier? we cant keep building and check if there are any issues occurred? or is there an another way to build where the apk is saved in the local system like every other framework?

[vivekshindhe]

@szaid6 It's not a limitation set by the Razorpay package. These are the steps we need to follow to allow native modules. And there are no limitations on following the steps above multiple times. Creating an APK is a different process. The steps mentioned above are run locally and are run through the expo app. Prebuild helps set the android/iOS projects, and does not count in the build section.