1. Installazione

consentmanager SDK è una soluzione completa per la gestione del consenso degli utenti nelle applicazioni mobili. Progettato per gestire la conformità al GDPR, le preferenze di privacy degli utenti e la trasparenza del tracciamento pubblicitario, questo SDK offre un'integrazione perfetta per le piattaforme iOS e Android. Inoltre, offre plugin/bridge wrapper per React Native, Flutter e Unity, rendendolo versatile in vari ambienti di sviluppo.

Passaggi – Descrizione di alto livello

1. Integrazione e configurazione:

   • Integra l'SDK nella tua app.
   • Configura le impostazioni dell'SDK in base alle tue esigenze.

2. Creazione di un'istanza e visualizzazione del Consent Layer:

   • All'avvio dell'app, crea un'istanza della CMPManager classe. Questa istanza gestirà il processo di consenso.
   • L'SDK visualizzerà automaticamente la schermata di consenso, se necessario.

3. Elaborazione dei dati relativi al consenso degli utenti:

   • Una volta raccolti i consensi, le informazioni vengono archiviate e sono disponibili per l'interrogazione tramite diverse proprietà e metodi esposti dal nostro SDK. Avrai informazioni sui consensi rifiutati o accettati, sui fornitori e sulle finalità.

1.1 Integrazione e configurazione

La libreria wrapper per Flutter è disponibile su pub.dev. Nella riga di comando o nella finestra del terminale, esegui:

flutter pub add cm_cmp_sdk_v3

Questo aggiungerà una riga come questa al file pubspec.yaml del tuo pacchetto (ed eseguirà un flutter pub get):

dependencies:  
	cm_cmp_sdk_v3: ^3.8.0

In alternativa, il tuo editor potrebbe supportare flutter pub get. Consulta la documentazione del tuo editor per saperne di più.

Android

dependencies {
    implementation "net.consentmanager.sdkv3:cmsdkv3:3.8.0" // Make sure this line is inserted
}

iOS

  s.dependency "cm-sdk-ios-v3", "3.8.0"

Importa

Ora nel tuo codice Dart puoi usare:

import 'package:cm_cmp_sdk_v3/cm_cmp_sdk_v3.dart';

1.2 Creazione di un'istanza e visualizzazione del layer di consenso

All'interno del tuo codice, devi creare un'istanza della classe CMPManager. Dovrai configurare due oggetti che verranno passati al metodo getInstance: UrlConfig, che gestisce la configurazione del CMP, come il Code-ID e la lingua predefinita, e ConsentLayerUIConfig. che configurerà l'aspetto della WebView che visualizzerà il layer di consenso. Dopodiché, sei pronto per utilizzare il metodo checkWithServerAndOpenIfNecessary() per recuperare automaticamente i dati necessari dal nostro server e determinare se la schermata di consenso debba essere mostrata o meno. In tal caso, l’SDK mostrerà automaticamente la schermata di consenso a questo punto, tramite un WebView creato dal nostro SDK, che visualizzerà il layer di consenso con il testo e i pulsanti in base alle configurazioni del CMP (scelte tramite il Code-ID del CMP), raccoglierà i dati e salverà le informazioni sul consenso nell'area NSUserDefaults/UserPreferences del dispositivo, in modo che l'app possa visualizzare gli annunci mirati di conseguenza. 

Esempio:

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'CMP SDK Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue),
        useMaterial3: true,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final CMPmanager _cmpManager = CMPmanager.instance;
  String _lastAction = '';

  @override
  void initState() {
    super.initState();
    _initializeCMP();
  }

  Future<void> _initializeCMP() async {
    try {
      await _cmpManager.setUrlConfig(
        id: "YOUR-CODE-ID-GOES-HERE",
        domain: "delivery.consentmanager.net", // or any other domain from your CMP dashboard
        appName: "CMDemoAppFlutter", // or any other app name, according to 
        language: "EN",
      );

      _cmpManager.addEventListeners(
        didReceiveConsent: (consent, jsonObject) {
          setState(() => _lastAction = 'Received consent: $consent');
        },
        didShowConsentLayer: () {
          setState(() => _lastAction = 'Consent layer shown');
        },
        didCloseConsentLayer: () {
          setState(() => _lastAction = 'Consent layer closed');
        },
        didReceiveError: (error) {
          setState(() => _lastAction = 'Error: $error');
        },
      );
    } catch (e) {
      setState(() => _lastAction = 'Initialization error: $e');
    }
  }
}

Nel caso decidessi di utilizzare un view model, ecco come apparirebbe:

 class CmpViewModel extends ChangeNotifier {
  static final CmpViewModel _instance = CmpViewModel._internal();
  static CmpViewModel get instance => _instance;

  late CMPmanager _cmpSdkPlugin;
  String _callbackLogs = '';

  CmpViewModel._internal();

  Future<void> initCmp() async {
    try {
      _cmpSdkPlugin = CMPmanager.instance;

      await CMPmanager.instance.setUrlConfig(
        appName: "CMDemoAppFlutter",
        id: "YOUR-CODE-ID-GOES-HERE",
        language: "EN",
        domain: "delivery.consentmanager.net",
      );

      _addEventListeners();
      await _cmpSdkPlugin.checkAndOpen();

    } catch (e) {
      _logCallback('Initialization error: $e');
      rethrow;
    }
  }

  void _addEventListeners() {
    _cmpSdkPlugin.addEventListeners(
      didShowConsentLayer: () => _logCallback('Consent layer opened'),
      didCloseConsentLayer: () => _logCallback('Consent layer closed'),
      didReceiveError: (error) => _logCallback('Error: $error'),
      didReceiveConsent: (consent, jsonObject) =>
          _logCallback('Consent: $consentnData: $jsonObject'),
      didChangeATTStatus: (oldStatus, newStatus, last) =>
          _logCallback('ATT Status changed: $oldStatus -> $newStatus'),
    );
  }

  void _logCallback(String message) {
    _callbackLogs = "$messagen$_callbackLogs";
    notifyListeners();
  }

  Future<void> forceOpen() async {
    try {
      await _cmpSdkPlugin.forceOpen();
      Fluttertoast.showToast(msg: 'Opening consent layer');
    } catch (e) {
      Fluttertoast.showToast(msg: 'Error opening consent layer: $e');
    }
  }

  Future<void> getGoogleConsentStatus() async {
    try {
      final settings = await _cmpSdkPlugin.getGoogleConsentModeStatus();
      final message = settings.entries.map((e) => '${e.key}: ${e.value}').join('n');
      _logCallback('Google Consent Mode Settings:n$message');
      Fluttertoast.showToast(msg: 'Check logs for Google Consent Mode settings');
    } catch (e) {
      Fluttertoast.showToast(msg: 'Error getting Google Consent Mode status: $e');
    }
  }
  // .
  // .
  // .
  // all the other method's implementations. 
}

1.3 Trattamento dei dati relativi al consenso degli utenti

Verifica dei consensi degli utenti

Il nostro SDK offre diversi metodi per verificare e recuperare le informazioni relative al consenso. I metodi principali sono illustrati nell'esempio qui sotto:

// On the example below retrieved from our Demo App, we have some examples 
// of how to check consents from the user, either accepted or rejected. 

  Future<void> getUserStatus() async {
    try {
      final status = await _cmpSdkPlugin.getUserStatus();
      final message = '''
User Choice: ${status.hasUserChoice}
TCF: ${status.tcf}
Additional Consent: ${status.addtlConsent}
Regulation: ${status.regulation}

Vendors Status:
${status.vendors.entries.map((e) => '${e.key}: ${e.value}').join('n')}

Purposes Status:
${status.purposes.entries.map((e) => '${e.key}: ${e.value}').join('n')}
''';
      _logCallback(message);
      Fluttertoast.showToast(msg: 'Check logs for User Status details');
    } catch (e) {
      Fluttertoast.showToast(msg: 'Error getting user status: $e');
    }
  }

Per ulteriori informazioni sugli altri metodi, consulta la nostra documentazione completa sull'API. 

Riaprire il Consent Layer per verificare le scelte degli utenti

Per consentire all'utente di verificare o modificare le proprie scelte, puoi semplicemente chiamare openConsentLayer()

void openConsentLayer() async {
  await _cmpSdkPlugin.forceOpen();
  notifyListeners();
}

Questo metodo visualizzerà il layer di consenso tramite la stessa istanza WebView creata nei passaggi precedenti. 

Importazione/esportazione delle informazioni sul consenso verso altre fonti

In alcuni casi un'app nativa potrebbe contenere webview per visualizzare informazioni, come pubblicità o contenuti. Per trasmettere le informazioni sul consenso dall'SDK alla webview, puoi recuperare la stringa di consenso utilizzando:

_cmpSdkPlugin.exportCMPInfo

Questo esporterà le informazioni sul consenso e tutti gli ulteriori dati necessari al CMP. Potrai quindi trasmettere queste informazioni al CMP presente nella tua webview aggiungendole all'URL richiamato nella webview.

Se, invece, hai bisogno di importare la stringa di consenso utilizzando l'SDK, puoi utilizzare l'esempio qui sotto:

await _cmpSdkPlugin.importCMPInfo(
          'Q1FERkg3QVFERkg3QUFmR01CSVRCQkVnQUFBQUFBQUFBQWlnQUFBQUFBQUEjXzUxXzUyXzUzXzU0XzU1XzU2XyNfczI3ODlfczI3OTBfczI3OTFfczI2OTdfczk3MV9VXyMxLS0tIw'
      )

Integrazione con Apple Tracking Transparency (ATT)

Se utilizzi strumenti di tracciamento o analisi nella tua app, ti consigliamo di leggere la guida sull'implementazione dell'ATT qui.

Creazione di un layout personalizzato

Per creare una vista personalizzata di WKWebView, ad esempio modificandone il posizionamento o lo sfondo, puoi modificare la configurazione passata all'oggetto ConsentLayerUIConfig come di seguito:

ConsentLayerUIConfig(
    position: .halfScreenTop,
    backgroundStyle: .dimmed(.grey, 0.75),
    cornerRadius: 20,
    respectsSafeArea: false,
    allowsOrientationChanges: true)

Accesso

Quando utilizzi il nostro SDK per iOS, potresti avere la necessità di eseguire il debug o analizzare le informazioni di log per vari scopi. I log generati dal nostro SDK sono contrassegnati con "CMP", consentendoti di filtrare facilmente e visualizzare solo i log rilevanti. Per ulteriori informazioni, consulta questa sezione della nostra documentazione.