Overview

Overview of CloudX React Native SDK setup and core features

npm

The CloudX React Native SDK enables monetization of your React Native apps with banner, MREC, interstitial, rewarded, and App Open ads on iOS and Android. It supports both the New Architecture (Fabric) and the legacy architecture (Paper).

Manual Installation

Requires React Native 0.70+, React 18.0+, iOS 13.0+, and Android API 23+.

npm install cloudx-react-native

iOS Setup

Add ad network adapter pods to your ios/Podfile:

target 'YourApp' do
  # ... existing config ...

  # CloudX ad network adapters (add as needed)
  pod 'CloudXMetaAdapter', '~> 6.21.1.0'            # FBAudienceNetwork 6.21.1
  pod 'CloudXVungleAdapter', '~> 7.7.4.0'           # VungleAds 7.7.4
  pod 'CloudXInMobiAdapter', '~> 11.3.0.0'          # InMobiSDK 11.3.0
  pod 'CloudXMintegralAdapter', '~> 8.1.5.0'        # MintegralAdSDK 8.1.5
  pod 'CloudXUnityAdsAdapter', '~> 4.19.0.0'        # UnityAds 4.19.0
  pod 'CloudXMagniteAdapterV2', '~> 1.0.0.1'        # MagniteSDK 1.0.0
  pod 'CloudXMobileFuseAdapter', '~> 1.11.0.0'      # MobileFuseSDK 1.11.0
  pod 'CloudXMolocoAdapter', '~> 4.8.0.0'           # MolocoSDKiOS 4.8.0
  pod 'CloudXVerveAdapter', '~> 3.9.0.0'            # HyBid 3.9.0
  pod 'CloudXDigitalTurbineAdapter', '~> 8.4.8.0'   # Fyber Marketplace SDK 8.4.8
  pod 'CloudXGoogleWaterfallAdapter', '~> 13.6.0.2' # Google Mobile Ads SDK 13.6.0
  pod 'CloudXPangleAdapter', '~> 8.2.0.7.0'         # Ads-Global (Pangle / ByteDance) 8.2.0.7
  pod 'CloudXTaurusXAdapter', '~> 1.18.1.0'          # TaurusX SDK 1.18.1
end

Then install pods:

cd ios && pod install

App Transport Security

The CloudX SDK does not require disabling App Transport Security. If a mediated network serves assets over plain HTTP from a specific host, scope an exception to that domain in your Info.plist instead of allowing arbitrary loads app-wide (a blanket NSAllowsArbitraryLoads weakens your app’s transport security and can draw App Store review scrutiny):

<key>NSAppTransportSecurity</key>
<dict>
  <key>NSExceptionDomains</key>
  <dict>
    <key>example-ad-network.com</key>
    <dict>
      <key>NSExceptionAllowsInsecureHTTPLoads</key>
      <true/>
      <key>NSIncludesSubdomains</key>
      <true/>
    </dict>
  </dict>
</dict>

Android Setup

Add CloudX SDK and adapter dependencies to your android/app/build.gradle:

dependencies {
    // CloudX Android SDK
    implementation "io.cloudx:sdk:4.5.0"

    // Adapters for ad networks (add as needed)
    implementation "io.cloudx:adapter-digitalturbine:8.4.7.0"     // Digital Turbine Marketplace SDK 8.4.7
    implementation "io.cloudx:adapter-googlewaterfall:25.2.0.2"   // Google Mobile Ads SDK 25.2.0
    implementation "io.cloudx:adapter-inmobi:11.4.0.1"            // InMobi SDK 11.4.0
    implementation "io.cloudx:adapter-magnite:1.0.0.1"            // Magnite Ads SDK 1.0.0
    implementation "io.cloudx:adapter-meta:6.22.0.0"              // Meta Audience Network 6.22.0
    implementation "io.cloudx:adapter-mintegral:17.1.71.1"        // Mintegral SDK 17.1.71
    implementation "io.cloudx:adapter-mobilefuse:1.11.0.1"        // MobileFuse SDK 1.11.0
    implementation "io.cloudx:adapter-moloco:4.11.0.0"            // Moloco SDK 4.11.0
    implementation "io.cloudx:adapter-pangle:8.2.0.4.0"           // Pangle SDK 8.2.0.4
    implementation "io.cloudx:adapter-taurusx:1.18.3.0"           // TaurusX SDK 1.18.3
    implementation "io.cloudx:adapter-unityads:4.19.0.1"          // Unity Ads SDK 4.19.0
    implementation "io.cloudx:adapter-verve:3.9.0.1"              // Verve HyBid SDK 3.9.0
    implementation "io.cloudx:adapter-vungle:7.7.7.0"             // Vungle SDK 7.7.7
}

If you integrate the Mintegral adapter, also declare its Maven repository in android/build.gradle:

allprojects {
    repositories {
        maven { url "https://dl-maven-android.mintegral.com/repository/mbridge_android_sdk_oversea" }
    }
}

Optional MMP Ad-Revenue Connectors

If your app already uses Adjust or AppsFlyer, add the native connector dependency to forward CloudX-won impression revenue to your MMP without React Native JavaScript glue code:

target 'YourApp' do
  pod 'CloudXAdjustConnector', '~> 5.0.0.0'
  pod 'CloudXAppsFlyerConnector', '~> 6.15.0.0'
end

The connector does not initialize the MMP SDK. Your app must already integrate and initialize Adjust or AppsFlyer with your own credentials. Use either a connector or your own onAdRevenuePaid forwarding code, not both.

Initialization

Initialize the SDK before loading any ads:

import { CloudX, CloudXLogLevel } from 'cloudx-react-native';

// Optional: enable verbose logging (development only)
CloudX.setMinLogLevel(CloudXLogLevel.VERBOSE);

// Initialize with your app key
const result = await CloudX.initialize('YOUR_APP_KEY');
if (result.success) {
    console.log('CloudX initialized');
} else {
    console.error('CloudX init failed:', result.message);
}

CloudX.initialize() returns a CloudXInitializationResult with:

  • success: boolean — whether initialization succeeded
  • message?: string — additional details, populated on failure

Other initialization utilities:

const initialized = await CloudX.isInitialized();
const version = await CloudX.getVersion();
const tablet = await CloudX.isTablet();

Ad Formats

CloudX React Native supports banner, MREC, interstitial, rewarded, and App Open ad integrations. Use the format-specific guides for implementation details:

Ad Information (CloudXAdInfo)

Most ad event callbacks receive a CloudXAdInfo object:

PropertyTypeDescription
adUnitIdstringThe ad unit ID
adFormatstringAd format: BANNER, MREC, INTERSTITIAL, REWARDED, or APP_OPEN
networkNamestringName of the winning ad network
networkPlacementstring | nullNetwork-specific placement ID
placementstring | nullCustom placement set by your integration
revenuenumberRevenue value in USD
adValuesRecord<string, string>SDK-provided ad metadata, used by features such as Trusted Arbiter

Error Handling

All SDK errors are returned as error objects in callbacks and rejected promises:

PropertyTypeDescription
codeCloudXErrorCodeError category
messagestring | nullHuman-readable description

Error Code Categories

RangeCategoryCommon Codes
0GeneralinternalError
100-199NetworknetworkError, networkTimeout, networkNoConnection
200-299InitializationnotInitialized, sdkDisabled, invalidAppKey
300-399Ad LoadingnoFill, invalidAdUnit, adsDisabled
400-499DisplayadNotReady, adAlreadyShowing
600-699AdapteradapterNoFill, adapterTimeout

See CloudXErrorCode export for the full list of error codes.

Advanced Features

Debug Logging

import { CloudX, CloudXLogLevel } from 'cloudx-react-native';

// Enable verbose logging (call before initialize)
CloudX.setMinLogLevel(CloudXLogLevel.VERBOSE);

// Available levels: VERBOSE, DEBUG, INFO, WARN, ERROR, NONE

Log Levels: VERBOSE < DEBUG < INFO < WARN < ERROR < NONE

Native SDK logs appear in the iOS and Android platform logs. JavaScript-side calls and event handling can also be logged through your app’s normal React Native logging.

Impression-Level Revenue Tracking

Set an addAdRevenuePaidListener callback on any ad format to receive impression-level revenue events. The CloudXAdInfo object includes the revenue value in USD and the winning network name.

CloudXInterstitialAd.addAdRevenuePaidListener((adInfo) => {
    trackRevenue(adInfo.revenue, adInfo.networkName, adInfo.adUnitId);
});

Works with all React Native ad formats: banner, MREC, interstitial, rewarded, and App Open.

To forward paid events from another mediation or reporting platform into CloudX, call CloudX.reportRevenueData(). Revenue is a currency-unit number, not micros.

import { CloudX, CloudXRevenuePlatform, CloudXRevenuePrecision } from 'cloudx-react-native';

const accepted = await CloudX.reportRevenueData({
    platform: CloudXRevenuePlatform.ADMOB,
    revenue: adValue.valueMicros / 1_000_000.0,
    adFormat: 'INTERSTITIAL',
    currencyCode: adValue.currencyCode,
    precision: CloudXRevenuePrecision.ESTIMATED,
    networkName: 'admob',
    adUnitId: 'interstitial_ad_unit',
});

Use CloudXRevenuePlatform.GAM for Google Ad Manager paid events. Use CloudXRevenuePlatform.custom('TopOn'), CloudXRevenuePlatform.custom('InMobi'), or another non-empty platform name for mediation platforms without a JavaScript constant.

Publisher-Reported Revenue Data

If your app receives impression-level revenue callbacks from AdMob, Google Ad Manager, or another provider outside the CloudX ad flow, forward those events to CloudX after initialization:

FieldRequiredDescription
platformYesCloudXRevenuePlatform.ADMOB, CloudXRevenuePlatform.GAM, or CloudXRevenuePlatform.custom("MyProvider")
revenueYesRevenue for one impression in the supplied currency, not CPM/eCPM
adFormatYesAd format string such as banner, mrec, interstitial, or rewarded
currencyCodeNoISO 4217 currency code, if known
precisionNoCloudXRevenuePrecision.EXACT, ESTIMATED, PUBLISHER_DEFINED, or UNDEFINED
networkNameNoWinning ad network name, if known
adUnitIdNoMediation-platform ad unit ID
thirdPartyAdPlacementIdNoNetwork-side ad unit or placement ID
creativeIdNoCreative ID from the ad network
networkPlacementNoNetwork placement identifier
countryCodeNoUser country code, if known
userSegmentNoUser segment, if known

CloudX.reportRevenueData() resolves true when the event is accepted into the CloudX revenue pipeline. It resolves false when the payload is invalid, the platform name is blank, the SDK is not initialized, or revenue tracking is unavailable.

AdMob paid events

Google does not provide an official React Native AdMob plugin. This example uses react-native-google-mobile-ads, a third-party React Native wrapper around the official Google Mobile Ads Android and iOS SDKs.

const toCloudXRevenuePrecision = (precision) => {
    switch (precision) {
        case RevenuePrecisions.PRECISE:
            return CloudXRevenuePrecision.EXACT;
        case RevenuePrecisions.ESTIMATED:
            return CloudXRevenuePrecision.ESTIMATED;
        case RevenuePrecisions.PUBLISHER_PROVIDED:
            return CloudXRevenuePrecision.PUBLISHER_DEFINED;
        case RevenuePrecisions.UNKNOWN:
        default:
            return CloudXRevenuePrecision.UNDEFINED;
    }
};

const reportAdMobPaidEvent = (event, adFormat, adUnitId) =>
    CloudX.reportRevenueData({
        platform: CloudXRevenuePlatform.ADMOB,
        revenue: event.value,
        adFormat,
        currencyCode: event.currency,
        precision: toCloudXRevenuePrecision(event.precision),
        adUnitId,
    });

const AdMobBanner = () => (
    <BannerAd
        unitId={ADMOB_BANNER_UNIT_ID}
        size={BannerAdSize.BANNER}
        onPaid={(event) => {
            reportAdMobPaidEvent(event, 'banner', ADMOB_BANNER_UNIT_ID);
        }}
    />
);

For Google Ad Manager paid events, keep the same revenue and precision mapping and set platform: CloudXRevenuePlatform.GAM.

Custom platform events

React Native has JavaScript constants for AdMob and Google Ad Manager. Use custom for providers that do not have a CloudX JavaScript SDK constant, such as InMobi, TopOn, TradPlus, and Nimbus. The value is only the provider name, such as CloudXRevenuePlatform.custom("TradPlus") or CloudXRevenuePlatform.custom("Nimbus"). Keep the name stable so CloudX can group that provider’s revenue consistently.

Do not include the amount or currency in the provider name. For a TradPlus impression worth USD 0.01, send platform: CloudXRevenuePlatform.custom("TradPlus"), revenue: 0.01, and currencyCode: "USD". If your source reports CPM/eCPM, divide by 1_000.0 first.

const reportCustomRevenueEvent = (
    providerName,
    revenue,
    adFormat,
    currencyCode,
    adUnitId,
    placementId,
) =>
    CloudX.reportRevenueData({
        platform: CloudXRevenuePlatform.custom(providerName),
        revenue,
        adFormat,
        currencyCode,
        precision: CloudXRevenuePrecision.PUBLISHER_DEFINED,
        adUnitId,
        thirdPartyAdPlacementId: placementId,
    });

Test Mode

Test mode is server-controlled via device whitelisting. This provides better security and control over which devices receive test ads.

To enable test mode:

  1. Initialize the SDK with verbose logging enabled.
  2. Find your device advertising ID in the iOS or Android platform logs.
  3. Add the advertising ID to your device whitelist on the CloudX server dashboard.

Note: Test mode is determined by the server, so you don’t need to change any code between development and production builds.

Privacy Compliance

The CloudX SDK supports GDPR and CCPA privacy compliance by reading standard IAB privacy strings from platform storage (NSUserDefaults on iOS, SharedPreferences on Android). These values are typically set automatically by your Consent Management Platform (CMP), such as Google UMP, OneTrust, or Sourcepoint.

How It Works

The native SDKs automatically detect user location and read consent signals:

  1. EU Users (GDPR): Checks TCF v2 consent for purposes 1 and 2 per the IAB Global Vendor List and vendor consent (CloudX Vendor ID: 1510)
  2. US Users (CCPA): Checks for sale/sharing opt-out signals
  3. Other Regions: No restrictions applied

When consent is denied or the user opts out, the SDK removes PII from ad requests:

  • Advertising ID (IDFA/GAID) is cleared
  • Geo coordinates (lat/lon) are removed
  • User key-values are not sent
  • Hashed user ID is removed from bidder-bound requests and suppressed from impression reporting

Supported Privacy Keys

KeyStandardDescription
IABGPP_HDR_GppStringGPPGlobal Privacy Platform string (modern)
IABGPP_GppSIDGPPSection IDs (e.g., “2” for EU, “7” for US-National, “8” for US-CA)
IABTCF_TCStringTCF v2GDPR consent string (legacy)
IABTCF_gdprAppliesTCF v2Whether GDPR applies (1 = yes, 0 = no)
IABUSPrivacy_StringUS PrivacyCCPA privacy string (legacy, e.g., “1YNN”)

Note: The SDK prioritizes GPP (modern standard) over legacy TCF/US Privacy strings when both are available.

Manual Privacy API

If you manage user consent yourself (without a CMP), you can set GDPR and CCPA privacy status directly. These can be called before or after SDK initialization.

import { CloudX } from 'cloudx-react-native';

// GDPR consent: true, false, or null to defer to CMP
CloudX.setHasUserConsent(true);

// CCPA do-not-sell: true, false, or null to defer to CMP
CloudX.setDoNotSell(true);

User Targeting

import { CloudX } from 'cloudx-react-native';

// Set hashed user ID for targeting
CloudX.setHashedUserID('hashed-user-id');

// Set custom user key-value pairs
CloudX.setUserKeyValue('age', '25');
CloudX.setUserKeyValue('gender', 'male');
CloudX.setUserKeyValue('location', 'US');

// Set custom app key-value pairs
CloudX.setAppKeyValue('app_version', '1.0.0');
CloudX.setAppKeyValue('user_level', 'premium');

// Clear all custom key-values
CloudX.clearAllKeyValues();

The hashed user ID is a publisher-provided pseudonymous identifier. When applicable privacy signals allow it, CloudX captures the value at auction time and returns it as hashed_user_id in the request and impression activity exports. Use auction_id to join the exports. Use the ID to join CloudX activity to cohorts in your own user data. The export value is empty when no ID was set, persistence was suppressed by privacy signals, or the value exceeded 128 characters. Do not pass raw personal data.

Per-load extra parameters

React Native SDK 3.4.4 and later can attach network or server-side configuration to an individual ad load. Values may be strings, numbers, booleans, null, arrays, or nested objects.

For programmatic ads, call the format’s setExtraParameters method before the method that starts the load:

import {
    CloudXBannerAd,
    CloudXMRECAd,
    CloudXInterstitialAd,
    CloudXRewardedAd,
    CloudXAdPosition,
} from 'cloudx-react-native';

const extraParameters = {
    requestId: 'request-456',
    bidFloor: 0.5,
    testRequest: false,
    keywords: ['sports', 'scores'],
    context: {
        screen: 'home',
        refreshIndex: null,
    },
};

// Call before createAd() for programmatic banner and MREC ads.
CloudXBannerAd.setExtraParameters(BANNER_AD_UNIT_ID, extraParameters);
CloudXBannerAd.createAd(BANNER_AD_UNIT_ID, CloudXAdPosition.BOTTOM_CENTER);

CloudXMRECAd.setExtraParameters(MREC_AD_UNIT_ID, extraParameters);
CloudXMRECAd.createAd(MREC_AD_UNIT_ID, CloudXAdPosition.CENTERED);

// Call before loadAd() for interstitial and rewarded ads.
CloudXInterstitialAd.setExtraParameters(INTERSTITIAL_AD_UNIT_ID, extraParameters);
CloudXInterstitialAd.loadAd(INTERSTITIAL_AD_UNIT_ID);

CloudXRewardedAd.setExtraParameters(REWARDED_AD_UNIT_ID, extraParameters);
CloudXRewardedAd.loadAd(REWARDED_AD_UNIT_ID);

For interstitial and rewarded ads, values are captured when loadAd() runs; later changes apply to the next load. For programmatic banner and MREC ads, set the values before createAd() to include them in the first auction. Changes made after creation apply to future refreshes.

For component placements, pass the values through the extraParameters prop on CloudXBannerView or CloudXMRECView instead of calling the programmatic setter:

import { CloudXBannerView, CloudXMRECView } from 'cloudx-react-native';

<CloudXBannerView
    adUnitId={BANNER_AD_UNIT_ID}
    extraParameters={{ section: 'top_stories', refreshIndex: 1 }}
/>

<CloudXMRECView
    adUnitId={MREC_AD_UNIT_ID}
    extraParameters={{ section: 'article_body', refreshIndex: 1 }}
/>

See Banner & MREC ads for the complete component API.

Identity passthrough

Pass UID 2.0, EUID, LiveRamp, and ID5 with setUserKeyValue. Set each value when you have it, and again when it refreshes.

KeyPass this
uidapi.comUID2 advertising token, not the refresh token. Do not decrypt it. UID2 docs
euid.euEUID advertising token, not the refresh token. Do not decrypt it. EUID docs
liveramp.comLiveRamp ATS envelope, not a RampID. LiveRamp docs
id5-sync.comID5 universal UID. Do not pass 0. ID5 docs

CloudX does not generate these IDs. Create them with UID2, EUID, LiveRamp ATS, or ID5, then pass the string. This is separate from hashed user ID.

CloudX.setUserKeyValue('uidapi.com', uid2Token);
CloudX.setUserKeyValue('euid.eu', euidToken);
CloudX.setUserKeyValue('liveramp.com', liveRampEnvelope);
CloudX.setUserKeyValue('id5-sync.com', id5Id);

App Tracking Transparency (iOS)

Request tracking authorization on iOS 14+:

import { requestTrackingAuthorization, getTrackingAuthorizationStatus, CloudXATTStatus } from 'cloudx-react-native';

const status = await requestTrackingAuthorization();
if (status === CloudXATTStatus.AUTHORIZED) {
    console.log('Tracking authorized');
}

ATT status values: AUTHORIZED, DENIED, RESTRICTED, NOT_DETERMINED, NOT_REQUIRED.

On Android or iOS < 14, requestTrackingAuthorization() returns NOT_REQUIRED.

Visual Debugging

Enable visual debugging overlays to see ad unit boundaries and network info:

CloudX.setVisualDebuggingEnabled(true);

Support

For support, contact support@cloudx.io