# Dojo React Native SDK Documentation > Guides for integrating Dojo payments into React Native apps using the Dojo React Native SDK. API quick reference: - **API base URL**: https://api.dojo.tech - **Environment selection**: Sandbox and production both use `https://api.dojo.tech`; the API key determines which environment receives the request - **Authentication**: `Authorization: Basic ` (literal `Basic ` prefix; do not base64-encode `api_key:`) - **Version header**: `version: 2026-02-27` The React Native SDK handles client-side payment collection. Your backend typically creates payment intents, receives webhooks, and performs refunds with the Dojo API. Machine-readable specs: - [Dojo API v3](https://docs.dojo.tech/api/v3/bundled.json) For complete integration, also load: - `llms-payment-intents.txt` — backend payment intent lifecycle, webhooks, refunds, and saved-card flows This file contains all documentation content in a single document following the llmstxt.org standard. ## Mobile integration {/* -- enable as option 2 import MobileCards from "@site/src/components/MobileCards" */} > Our mobile SDKs are available in iOS, Android, and React Native. Choose your integration. [![iOS](https://img.shields.io/badge/-iOS-blue?logo=Github&labelColor=grey)](https://github.com/dojo-engineering/dojo-ios-sdk-drop-in-ui) [![Android](https://img.shields.io/badge/Android-blue?logo=Github&labelColor=grey)](https://github.com/dojo-engineering/android-dojo-pay-sdk) [![React Native](https://img.shields.io/badge/React_Native-blue?logo=Github&labelColor=grey)](https://github.com/dojo-engineering/react-native-pay-sdk) Our mobile SDKs have been designed with developers in mind, making the integration simple and intuitive to use. Whether you're an experienced developer or just getting started, our SDK provides a smooth checkout experience by allowing you to easily integrate Dojo checkout screens and UI elements in your app. {/* enable as option 2 */} ![](https://docs.dojo.tech/images/mobile-integration.png) {/* ## Supported features // UNCOMMENT WHEN APPROVED */} The Dojo mobile SDKs support the following payment intent features: |Scenario| Currency | Wallet| Card |-------|:--------:|----|-----| |`Created`| **GBP** | ![yes](https://docs.dojo.tech/images/dojo-icons-small/CheckCircle.svg) | ![yes](https://docs.dojo.tech/images/dojo-icons-small/CheckCircle.svg) | |`Authorized`| **GBP** | ![yes](https://docs.dojo.tech/images/dojo-icons-small/CheckCircle.svg) | ![yes](https://docs.dojo.tech/images/dojo-icons-small/CheckCircle.svg) | |`Canceled`| **GBP** | ![yes](https://docs.dojo.tech/images/dojo-icons-small/CheckCircle.svg) | ![yes](https://docs.dojo.tech/images/dojo-icons-small/CheckCircle.svg) | |`Captured`| **GBP** | ![yes](https://docs.dojo.tech/images/dojo-icons-small/CheckCircle.svg) | ![yes](https://docs.dojo.tech/images/dojo-icons-small/CheckCircle.svg) | |`Reversed`| **GBP** | ![yes](https://docs.dojo.tech/images/dojo-icons-small/CheckCircle.svg) | ![yes](https://docs.dojo.tech/images/dojo-icons-small/CheckCircle.svg) | |`Refunded`| **GBP** | ![yes](https://docs.dojo.tech/images/dojo-icons-small/CheckCircle.svg) | ![yes](https://docs.dojo.tech/images/dojo-icons-small/CheckCircle.svg) | [![](https://docs.dojo.tech/images/dojo-icons/AppleLogo.svg) **iOS** Compatible with: iOS 11.0 and later.](/mobile-integration/ios) [![](https://docs.dojo.tech/images/dojo-icons/AndroidLogo.svg) **Android** Compatible with: Android 5.0 and later.](/mobile-integration/android) [![](https://docs.dojo.tech/images/dojo-icons/ReactNative.svg) **React Native** Compatible with: iOS 11.0 and later, Android 5.0 and later.](/mobile-integration/react-native) --- ## Step-by-step guide > Learn how to accept payments in your React Native app using our mobile SDK. This guide explains the process of integrating the checkout experience in your app. ## Checkout experience flow The following explains the flow of a user's journey in the checkout experience. > **Info:** - The term `user` used in this document refers to a customer trying to make a payment through your mobile application. > - This guide assumes you named the button on your checkout screen as **Checkout**. 1. A user visits your app and taps **Checkout**. 2. Your mobile app sends the user's purchase information to your backend. Then, your backend sends this information to Dojo's backend to [create a payment intent](https://docs.dojo.tech/mobile-integration/react-native/accept-payments/step-by-step-guide#step-1-create-a-payment-intent). 3. Your mobile app starts the checkout process using the mobile SDK. 4. The mobile SDK collects the user payment details, sends them to the Dojo backend, and presents a result screen to the user. The mobile SDK then notifies the hosting application of the [payment result](https://docs.dojo.tech/mobile-integration/react-native/accept-payments/step-by-step-guide#result-code). 5. Your backend receives a [webhook notification](https://docs.dojo.tech/mobile-integration/react-native/accept-payments/step-by-step-guide#step-3-handle-post-payment-events) when the payment is completed. ![](https://docs.dojo.tech/images/flow-checkout-page-ios.png) ## How to process a payment This is a step-by-step guide that demonstrates how to process payments with Dojo's backend and your backend into your mobile app using Dojo's mobile SDK. ### Before you start This guide contains the following steps: 1. [Create a payment intent](https://docs.dojo.tech/mobile-integration/react-native/accept-payments/step-by-step-guide#step-1-create-a-payment-intent). 2. [Start the checkout process](https://docs.dojo.tech/mobile-integration/react-native/accept-payments/step-by-step-guide#step-2-start-checkout-process). 3. [Handle post-payment events](https://docs.dojo.tech/mobile-integration/react-native/accept-payments/step-by-step-guide#step-3-handle-post-payment-events). 4. [Test and go live](https://docs.dojo.tech/mobile-integration/react-native/accept-payments/step-by-step-guide#step-4-test-and-go-live). ### Step 1. Create a payment intent With the checkout button in your app, call your backend and then call Dojo's backend endpoint to create a payment intent. To create a payment intent, the following parameters are required: - `amount`: This includes the currency and value, in minor units, for example, "1000" for 10.00 GBP. - `reference`: Your unique reference for the payment intent, like the *order number*. Here's an example of how to create a payment intent for 10 GBP on your backend: ```py title="server.py" from urllib import response from flask import Flask, jsonify, request, render_template app = Flask(__name__) @app.route('/checkout', methods=['GET', 'POST']) def hello(): # POST request if request.method == 'POST': print(request.get_json()) # parse as JSON conn = http.client.HTTPSConnection("api.dojo.tech") # call post payment-intent payload = json.dumps({ "amount": { "value": 1000, "currencyCode": "GBP" }, "reference": "Order 245" }) headers = { 'Content-Type': "application/json", 'Version': "2024-02-05", 'Authorization': "Basic sk_sandbox_c8oLGaI__msxsXbpBDpdtwJEz_eIhfQoKHmedqgZPCdBx59zpKZLSk8OPLT0cZolbeuYJSBvzDVVsYvtpo5RkQ" # <-- Change to your secret key } conn.request("POST", "/payment-intents/", payload, headers) # handling the response from POST res = conn.getresponse() data = res.read() resp_data = {} resp_data['id'] = json.loads(data)["id"] json_data = json.dumps(resp_data) ``` See the [API reference](https://docs.dojo.tech/api#operation/PaymentIntents_CreatePaymentIntent) for a complete list of parameters that can be used for payment intent creation. For configurations that apply to our mobile SDK, go to [Configurations]. ### Step 2. Start checkout process Once you've created the payment intent, pass the payment intent ID to your payment flow code. > **Info:** To start the checkout process, ensure you have installed the [latest SDK](https://docs.dojo.tech/mobile-integration/react-native/setup). ```javascript title="capture-card.js" const result = await startPaymentFlow({ intentId: "" }); console.log(result); ``` After the user fills in the payment information on the checkout screen, Dojo processes the payment and redirects the user to the result screen and your app receives a [result code](https://docs.dojo.tech/mobile-integration/react-native/accept-payments/step-by-step-guide#result-code). ### Step 3. Handle post-payment events ### Step 4. Test and go live Before going live, test your integration using the test card numbers: ### Result Code After integrating our SDK into your app and making a payment, you will receive a `result` code. Refer to the following result codes for more information. | Result Code | Result |Description | |-----|-----|-----| |`0` |**Successful**|The transaction was successful.| |`3` |**Authorizing**| The card holder hasn't completed 3DS, this status will only be seen on the REST API.| |`4` |**Referred**| The card issuer has parked the transaction awaiting contact with the customer before proceeding to authorize or decline the transaction.| |`5` |**Declined**| The transaction was declined by the card issuer or acquiring bank.| |`20` |**Duplicate Transaction**| The transaction which was processed was a duplicate. Ensure each transaction has a unique OrderId.| |`30` |**Failed**| Error executing transaction.| |`400` |**Invalid Request**| The request has failed validation by our servers and the transaction hasn't been submitted to the gateway. Possible causes for this are invalid transaction type or other data in the request.| |`401` |**Issue with Access Token**| The access token being used isn't valid, the transaction hasn't been submitted to the gateway. This can be caused if the token has already been used or the 30 minute expiry time has elapsed.| |`404` |**No Access Token Supplied**| No access token has been supplied. Transaction hasn't been submitted to the gateway.| |`500` |**Internal Server Error**| There's been an error submitting the transaction, please check the REST API for the status of the transaction.| |`7770` | **Sdk Internal Error**| There's a problem on the SDK side. Contact [Dojo](https://support.dojo.tech/hc/en-gb/requests/new) for more information.| --- --- ## Accept payments with React Native >All you need to know about accepting payments using our React Native SDK. [![](https://docs.dojo.tech/images/dojo-icons/BookBookmark.svg) **Step-by-step Guide** Guide to start accepting payments using React Native SDK.](accept-payments/react-native-step-by-step-guide) [![](https://docs.dojo.tech/images/dojo-icons/Headset.svg) **Need a hand?** Our support team is always happy to help with any questions you have.](https://support.dojo.tech/hc/en-gb) [![](https://docs.dojo.tech/images/dojo-icons/AppleLogo.svg) **Integrate with Apple Pay** Guide to accept payments with Apple Pay.](../ios/accept-payments/ios-setup-apple-pay) [![](https://docs.dojo.tech/images/dojo-icons/AndroidLogo.svg) **Integrate with Google Pay** Guide to accept payments with Google Pay.](../android/accept-payments/android-setup-google-pay) --- ## React Native integration >Learn more about React Native SDK integration with Dojo. With React Native SDK, you can: - [**Accept payments from all major credit and debit cards**](https://docs.dojo.tech/mobile-integration/react-native/react-native/react-native-accept-payments) Allow users to pay using a card that works best for them. - [**Accept Apple Pay payments**](https://docs.dojo.tech/mobile-integration/ios/accept-payments/ios-setup-apple-pay) Integrate Apple Pay to your checkout screen in addition to card payments. - [**Accept Google Pay payments**](https://docs.dojo.tech/mobile-integration/android/accept-payments/android-setup-google-pay) Integrate Google Pay to your checkout screen in addition to card payments. --- ## Ready to get started? [![](https://docs.dojo.tech/images/dojo-icons/Wrench.svg) **Install SDK** Install our React Native SDK to start accepting payments in mobile apps.](react-native/setup) --- ## Setup > Learn how to set up the React Native SDK. [![GitHub release](https://img.shields.io/github/v/release/dojo-engineering/react-native-pay-sdk?logo=Github&labelColor)](https://github.com/dojo-engineering/react-native-pay-sdk/releases) This package is published privately to GitHub packages. ## Before you begin Before using our React Native SDK, you must [authenticate `npm` or `yarn` with GitHub](https://docs.github.com/en/packages/working-with-a-github-packages-registry/working-with-the-npm-registry#installing-a-package). ## Adding dependencies To add the dependencies to your environment: 1. Add the package to your project. ```ruby npm install https://github.com/dojo-engineering/react-native-pay-sdk/ ``` 2. According to your environment, add the following dependencies to your project: Add the native dependencies to your Podfile: ```ruby title="Podfile" pod 'dojo-ios-sdk-drop-in-ui', :git => 'git@github.com:dojo-engineering/dojo-ios-sdk-drop-in-ui.git', :tag => '1.3.2' pod 'dojo-ios-sdk', :git => 'git@github.com:Dojo-Engineering/dojo-ios-sdk.git', :tag => '1.4.0' ``` Add the native dependencies to your apps build.gradle: ```java title="build.gradle" dependencies { ... implementation ("tech.dojo.pay:sdk:1.6.2") implementation ("tech.dojo.pay:uisdk:1.3.5") } ``` Add the necessary repositories to retrieve the dependencies: ```java title="build.gradle" repositories { ... maven { url = uri("https://cardinalcommerceprod.jfrog.io/artifactory/android") credentials { // Contact Dojo support for credentials username = "" password = "" } } } ``` You must set the credentials for accessing both repositories in your `~/.gradle/gradle.properties`: ```java cardinal.user={cardinal user} cardinal.key={cardinal password} ``` Add the following code to your apps `MainActivity.java`: ```java @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); DojoPay.init(this); } ``` > **Info:** Ensure that you exclude payment-related fields from tracking if you are using screen recording or session recording services like **LogRocket** or **UXCam**. You can do that by setting `themeSettings.analyticsExcludedFieldsIdentifier` with your identifier value. [![](https://docs.dojo.tech/images/dojo-icons/BookBookmark.svg) **Releases** Details on the latest SDK changes and previous versions.](https://github.com/dojo-engineering/react-native-pay-sdk/releases) --- ## Strong Customer Authentication [Strong Customer Authentication (SCA)](https://www.fca.org.uk/firms/strong-customer-authentication) is a security protocol that requires customers to provide at least two forms of authentication before completing an online transaction. It is designed to reduce fraud and increase security for online transactions, especially for electronic payment systems that use credit cards, bank transfers, and e-wallets. Under SCA, customers are required to provide two or more of the following forms of authentication: - Something the customer knows (such as a password or PIN) - Something the customer has (such as a mobile phone or a smart card) - Something the customer is (such as a fingerprint or facial recognition) SCA is mandated by the [European Union's Payment Services Directive 2 (PSD2)](https://www.ecb.europa.eu/paym/intro/mip-online/2018/html/1803_revisedpsd.en.html) for all electronic payment transactions initiated by customers in the [European Economic Area (EEA)](https://www.efta.int/eea). It aims at protecting customers' financial data and prevent unauthorized access to their accounts.