Didomi - Developers documentation
  • Introduction
  • SDKs
    • Introduction
    • Web SDK
      • Getting started
      • Tags and vendors management
        • Tags management
          • Events & Variables
            • Deprecated
            • Custom events
          • Tag managers
            • Adobe Launch/DTM
            • Eulerian
            • Google Tag Manager
              • Configure the Didomi / GTM integration
              • Didomi's GTM template
            • Tealium
            • Other tag managers
        • Custom Didomi <script> tags
        • Third-party integrations
          • Google Ad Manager / AdSense
            • GDPR via Non-Personalized Ads
              • Share consent and load/refresh ads
              • Share consent without loading or refreshing ads
            • US states laws
          • Google Consent Mode V2
          • Kameleoon
          • Piano Analytics (AT Internet)
          • Prebid
            • GDPR via IAB TCF
            • US states laws
          • Salesforce DMP (Krux)
        • IAB frameworks
        • Programmatic API
      • Configuration
        • Bots (SEO & Performance tools)
        • Configuration by URL
        • Cookies and storage
        • Custom domains for events
        • Notice
          • Behavior
          • Interactions
          • Look and feel
        • Preferences
        • Theme
      • AB tests
      • Custom domain
        • Domain delegation
        • Reverse proxy
      • Share consents between domains
      • Share consents across devices
      • Pass user choices in query string
      • Serve Didomi assets from your domain
      • Reference
        • API
          • Deprecated
        • Events
      • Performance
      • Versions
    • Mobile and TV SDKs
      • Android and Android TV
        • Setup
        • Logging
        • Reference
          • API
            • Deprecated
          • Events
        • Versions
      • iOS and tvOS
        • Setup
        • Logging
        • App Tracking Transparency (iOS 14.5+)
        • Reference
          • API
            • Deprecated
          • Events
        • Versions
      • Unity
        • Setup
        • Reference
        • Versions
        • Troubleshooting
      • React Native
        • Setup
        • Reference
          • Deprecated
        • Versions
      • Flutter
        • Setup
        • Reference
        • Versions
      • Consent notice
        • Getting started
        • Customize the notice
        • Customize the preferences popup
        • Customize the theme & UI
        • Load notice by ID
      • Third-party SDKs
      • Share consents across devices
      • Share consent with WebViews
      • Google Consent Mode v2
      • FAQ
    • AMP SDK
      • Blocking Behaviors
        • Load immediately on page load
        • Load only after consent (positive or negative)
        • Load only after positive consent
      • Consent status for vendors
    • Help & Support
  • API
    • Introduction
      • Authentication
      • Errors
      • Pagination
      • Filters
      • Caching
      • Rate limiting
      • Quotas
      • Translations
    • Data Manager
      • Regulations
      • Configuration Tree
      • Purposes
        • Purposes & Vendors Numerical IDs
      • Preferences Library
      • User Rights
    • Widgets
      • Consent notices
        • Notices
        • Configurations
        • Multi-Regulation Configurations
          • Migration of Existing Notices and API Updates
        • Deployments
        • Tutorials
          • Create and publish a consent notice
          • Create and publish a multi-regulation consent notice
      • Privacy widgets
        • Create a widget
        • Retrieve widgets
        • Edit a widget
          • Content & Design
            • Themes & Shapes
            • Components
              • auth
              • dsar_form
              • footer
              • header
              • preference
              • preference_value
              • save
              • section
              • sections
            • Options
          • Purposes & preferences
          • Settings
        • Deploy a Widget
          • Use your own subdomain
          • Use your own domain
          • Implement an embeddable widget on your website
        • Authentication
          • Manage authentication providers
          • Authenticate your end-user
        • Archive a widget
        • Headless widgets
          • Public Methods
          • Custom elements
          • Custom events
          • Event listeners
        • Tutorial
          • Launch a Preference Center from a mobile app
    • Compliance Reports
      • Properties
      • Reports
      • CSV format reference
      • Websites
    • Consents and Preferences
      • Events
        • Generate IAB TCF consent string
      • Links
      • Proofs
      • Tokens
      • Secrets
      • Users
      • Tutorial
        • Collect and operate data
    • Privacy Requests
      • Requests
      • Notes
      • Links
      • Emails
  • Integrations
    • Introduction
      • Quotas
    • Generic integrations
      • Batch export
        • Destinations
          • AWS S3 Bucket (owned by Didomi)
          • GCP Storage Bucket
        • Exported data
          • Notices consents
        • Logs
      • Webhooks
      • Batch import
      • Analytics export
        • Destinations
          • AWS S3 Bucket (owned by Didomi)
          • GCP Storage Bucket
    • Third-party apps
      • CMP integrations
        • Didomi-mParticle integration for your CMP
        • Deploy Didomi’s SDK for your Adobe Commerce website
      • Preference Management Platform integrations
        • Actito
        • Adobe Campaign Classic
        • Adobe Experience Cloud
        • Adobe Marketo Engage
        • Adobe Source Connector
        • Braze
        • Dotdigital
        • Hubspot
        • Mailchimp
        • Microsoft Dynamics 365
        • Salesforce Marketing Cloud
        • Salesforce Sales & Service Cloud
        • Selligent
        • Brevo (ex Sendinblue)
    • Tutorials
      • Configure a HTTP webhook
      • Configure a batch export
      • Configure an analytics export
    • Emailing
      • Configurations
        • Actito Email
        • Actito SMS
        • Adobe Campaign Classic
        • Adobe Campaign Standard
      • Emails
        • Templates
        • Manage your templates
Powered by GitBook
On this page
  • Add the SDK to your project
  • Initialize the SDK
  • Setup the SDK UI
  • Deep links
  • Configure the SDK
  • From the Console (Recommended)
  • Local file
  • Remote file
  1. SDKs
  2. Mobile and TV SDKs
  3. React Native

Setup

Add the SDK to your project

Install using yarn add @didomi/react-native or npm i @didomi/react-native

Then install required pods for iOS with cd ios && pod install

As Didomi requires Swift runtime for iOS, if your project does not contain Swift code, you need to add an empty Swift file (to create a bridging header) into Xcode project.

Then you can import project from your js code:

import { Didomi, DidomiEventType } from '@didomi/react-native';

Initialize the SDK

Once our SDK has been added to your project, you need to initialize it. The initialization process will prepare the SDK for interactions with the user and your application. It is important to launch the SDK initialization as soon as possible.

In your code, call the initialize method and pass your API key:

function init() {
    Didomi.onReady().then(() => {
        // From this point, SDK is ready
    });

    var parameters = {
      apiKey: '<YOUR_API_KEY>',
      noticeId: '<YOUR_NOTICE_ID>'
    };
    Didomi.initializeWithParameters(parameters);
}

�Keep in mind that the SDK initialization is an asynchronous process so you must avoid interacting with the DidomiSdk object until it is actually ready to handle your requests. Use the onReady event in js to register a listener for the ready event.

Take a look at our sample app to see how the setup is done.

Setup the SDK UI

Note: the setupUI method should be called only from your contexts where the application starts.

You do not need to call onReady, isReady or shouldConsentBeCollected before calling setupUI because they are called internally. Therefore, by calling this method the consent notice will be displayed if it is required and only once the SDK is ready.

Call the setupUI function of the SDK in your context where the application starts:

Didomi.setupUI();

Deep links

If you are using deep links or have multiple pages in your react-native app, make sure that the setupUI function is called on every context that the user can launch the app on. This will ensure that consent is always collected as needed and there is no path where the user can launch the app without consent being collected. If setupUI is missing in some entry points, you will see lower consent rates as users will be using the app without giving consent.

Configure the SDK

We support three options for configuring the UI and the behavior of the SDK:

From the Console (Recommended)

To enable this option, omit the disableDidomiRemoteConfig parameter or pass it as false when calling the initialize method, as shown below.

var parameters = {
  apiKey: '<YOUR_API_KEY>',
  disableDidomiRemoteConfig: false, // it can be omitted as well.
  noticeId: '<YOUR_NOTICE_ID>'
};
Didomi.initializeWithParameters(parameters);

The SDK will automatically use the remote configuration hosted by Didomi and cache it locally. The cached version is refreshed every 60 minutes. If there is no connection available to download the remote configuration and no locally cached version, the SDK will try to use a local didomi_config.json configuration file as a fallback. See the Local option below for more information on how to configure the SDK through a local configuration file.

Local file

Using a local file automatically disables the TCF integration. If your app uses the TCF, you must use a configuration from the Didomi Console.

Using a local file will prevent you to support multiple regulations.

With this option, you create your own SDK configuration file and embed it in your app package.

The SDK behavior is configured in a didomi_config.json file that must be placed in the Android and iOS folders of your project.

You can create a file with the following content to get started:

{
    "app": {
        "name": "My App Name",
        "privacyPolicyURL": "http://www.website.com/privacy",
        "vendors": {
            "iab": {
                "all": true
            }
        },
        "gdprAppliesGlobally": true,
        "gdprAppliesWhenUnknown": true
    }
}

For Android, the configuration file must be placed in the assets folder of the Android platform code (in this example: android/app/src/main/assets)

For iOS, add the configuration file to the project and make sure the project.pbxproj file is updated.

var parameters = {
  apiKey: '<YOUR_API_KEY>',
  disableDidomiRemoteConfig: true,
  noticeId: '<YOUR_NOTICE_ID>'
};
Didomi.initializeWithParameters(parameters);

Remote file

Enabling this option will prevent the configuration from being loaded from the Didomi Console.

You can provide a remote URL for the SDK to download the didomi_config.json configuration file from. That allows you to update the SDK configuration without having to re-publish you mobile application.

When that configuration is enabled, the SDK will automatically use the remote configuration and cache it locally. The cached version is refreshed every 60 minutes. If there is no connection available to download the remote file and no locally cached version, the SDK will try to use the local didomi_config.json (described above) as a fallback.

To enable that option, change your call to initialize to provide the remote file URL:�

var parameters = {
  apiKey: '<YOUR_API_KEY>',
  remoteConfigurationUrl: 'http://www.website.com/didomi_config.json',
  noticeId: '<YOUR_NOTICE_ID>'
};
Didomi.initializeWithParameters(parameters);

Also see the reference documentation of the initialize function for more information.

PreviousReact NativeNextReference

Last updated 3 months ago

: the SDK is configured remotely from the Didomi Console

: the SDK is configured from a didomi_config.json file embedded in your app package

: the SDK is configured from a remote didomi_config.json file

You can configure the consent notice in your app by creating a notice in your Didomi Console. It will automatically be linked to your app through your API Key and, optionally, your notice id. You can access the Didomi console .

You also need to disable loading the remote configuration to ensure that only the local file is loaded and that no HTTP request is sent. Update your call to set the disableDidomiRemoteConfig parameter to true:

Your SDK is now setup. of our Mobile SDKs to learn more about how to configure it to match your app UI and requirements.

here
initialize
Read the Getting started section
Didomi Console
Local file
Remote file