App Tracking Transparency (ATT)

This guide provides comprehensive instructions for implementing Apple's App Tracking Transparency (ATT) framework with the Trackier React Native SDK. ATT is required for iOS 14.5+ apps that want to access the Identifier for Advertisers (IDFA) for accurate attribution and tracking.

Overview

App Tracking Transparency (ATT) is Apple's privacy framework that requires apps to request user permission before accessing the IDFA. This is crucial for accurate attribution and tracking on iOS 14.5 and later.

Prerequisites

• iOS 14.5 or later
• Xcode 12.0 or later
• Trackier React Native SDK installed
• Access to your app's Info.plist file
• react-native-permissions package installed

Installation

Install the permissions package:

npm install react-native-permissions@^5.4.4

Configure iOS Podfile

Add permissions setup to your ios/Podfile:

ios/Podfile

# Setup permissions for react-native-permissions
setup_permissions([
  'AppTrackingTransparency',
])

Then install pods:

cd ios && pod install && cd ..

Package Link: react-native-permissions on npm

Implementation

Step 1: Add Permission Description

Add the following key-value pair to your Info.plist to describe why your app needs tracking permission:

ios/YourApp/Info.plist

<key>NSUserTrackingUsageDescription</key>
<string>We use tracking to personalize your experience and improve our services.</string>

Step 2: Complete Implementation

note

Important: On iOS, request ATT permission first, then call waitForATTUserAuthorization(20) between creating the SDK config and initializing. Once the user grants permission, the SDK will automatically fetch and send IDFA to the panel.

Here's the complete implementation:

App.js

import React, { useEffect } from 'react';
import { Platform } from 'react-native';
import { request, PERMISSIONS, RESULTS } from 'react-native-permissions';
import TrackierSDK, { TrackierConfig } from 'react-native-trackier-sdk';

const App = () => {
  useEffect(() => {
    initializeApp();
  }, []);

  const initializeApp = async () => {
    await initializeTrackierSDK();
  };

  const requestATTPermission = async () => {
    if (Platform.OS === 'ios') {
      try {
        console.log('Requesting ATT (App Tracking Transparency) permission...');
        const result = await request(PERMISSIONS.IOS.APP_TRACKING_TRANSPARENCY);
        console.log('ATT permission result:', result);
        
        switch (result) {
          case RESULTS.GRANTED:
            console.log('ATT permission granted');
            // The Trackier SDK will automatically fetch and send IDFA to the panel
            break;
          case RESULTS.DENIED:
            console.log('ATT permission denied');
            break;
          case RESULTS.BLOCKED:
            console.log('ATT permission blocked');
            break;
          case RESULTS.UNAVAILABLE:
            console.log('ATT is not available on this device');
            break;
          case RESULTS.LIMITED:
            console.log('ATT permission limited');
            break;
        }
        
        return result;
      } catch (error) {
        console.log('Error requesting ATT permission:', error);
        return null;
      }
    }
  };

  const initializeTrackierSDK = async () => {
    try {
      // Create SDK configuration
      const sdkConfig = new TrackierConfig('YOUR_SDK_KEY', 'production');

      // iOS: Request ATT permission and configure timeout
      if (Platform.OS === 'ios') {
        console.log('Requesting ATT permission before SDK initialization...');
        await requestATTPermission();
        
        console.log('Waiting for ATT user authorization (20 seconds timeout)...');
        TrackierSDK.waitForATTUserAuthorization(20);
        console.log('ATT wait completed');
      }

      // Initialize SDK
      TrackierSDK.initialize(sdkConfig);
      console.log('Trackier SDK initialized successfully');
    } catch (error) {
      console.log('Error in SDK initialization:', error);
    }
  };

  return (
    // Your app components
  );
};

export default App;

How It Works

1. Create SDK Config: Create TrackierConfig with your SDK key
2. Request ATT Permission (iOS only): Request permission using react-native-permissions
3. Set Timeout: Call waitForATTUserAuthorization(20) - sets 20 second timeout
4. Initialize SDK: Call TrackierSDK.initialize(sdkConfig)
5. Auto IDFA: When user allows, SDK automatically fetches and sends IDFA to panel

info

The order is important: Create Config → Request Permission → Set Timeout → Initialize SDK

Key Features

• waitForATTUserAuthorization(timeoutInterval): Configures the SDK to wait for user's ATT decision before starting tracking. The timeout can be adjusted based on your app's needs.
• Automatic IDFA Handling: Once permission is granted, the SDK automatically fetches and sends IDFA to the panel.
• Manual Permission Request: You control when to show the ATT permission dialog to users.
• Platform-Specific: Only runs on iOS, gracefully skips on other platforms.

warning

Always replace "YOUR_SDK_KEY" with your actual SDK token from the Trackier Panel. Using an incorrect token will cause attribution issues.

Visual Examples

ATT Permission Dialog:

IDFA Console Logs:

IDFA Panel in Trackier Dashboard: When tracking is properly configured with ATT, you can see the IDFA details in the Trackier panel for installs and events:

This panel shows the IDFA information when users grant tracking permission, allowing for accurate attribution and detailed tracking analytics.

ATT Permission Result Values

Result	Description	SDK Behavior
RESULTS.GRANTED	User granted permission	Full tracking enabled, IDFA available
RESULTS.DENIED	User denied permission	Limited tracking, no IDFA
RESULTS.BLOCKED	Permission blocked (settings)	Limited tracking, no IDFA
RESULTS.LIMITED	Limited tracking permission	Limited tracking
RESULTS.UNAVAILABLE	ATT not available on device	Continue without IDFA

Best Practices

• Timing: Request permission after app launch (1-2 second delay)
• User Experience: Explain why tracking is needed before requesting permission
• Timeout Configuration: Adjust timeout based on your app's flow (default 20 seconds)
• Platform Check: Always check if running on iOS before calling ATT methods
• Check Status First: Always check if permission has already been determined before requesting
• Handle All Cases: Implement proper handling for all ATT status values

Troubleshooting

Common Issues

ATT Permission Not Requested

• Ensure NSUserTrackingUsageDescription is added to Info.plist
• Check that the app targets iOS 14.5 or later
• Verify setup_permissions(['AppTrackingTransparency']) is added to Podfile
• Ensure react-native-permissions package is properly installed (version 5.4.4+)
• Run cd ios && pod install after adding to Podfile

IDFA Not Available

• Check if user granted permission (status should be authorized)
• Ensure the device supports IDFA (not available on simulator)
• Verify the app is not restricted by parental controls

SDK Initialization Issues

• Make sure waitForATTUserAuthorization is called before SDK initialization
• Check that the timeout value is appropriate for your app flow
• Verify the SDK token is correct

Platform Check Not Working

• Ensure Platform.OS === 'ios' is correctly implemented
• Verify the Platform import from react-native

Support

For technical support and questions:

• Support Email: support@trackier.com
• Documentation: Trackier Documentation Portal

---

This guide provides comprehensive implementation of App Tracking Transparency with the Trackier React Native SDK, ensuring compliance with Apple's privacy requirements while maintaining accurate attribution and tracking capabilities.