[Flattern] 1. consentmanager SDK-Integration
In diesem Dokument finden Sie allgemeine Informationen zur Integration unseres SDK in Ihr Projekt. Weitere Einzelheiten entnehmen Sie bitte unserer API-Referenz Dokumentation.
1. Installation
consentmanager SDK ist eine umfassende Lösung für die Verwaltung der Benutzereinwilligung in mobilen Anwendungen. Dieses SDK wurde für die Einhaltung der DSGVO, die Berücksichtigung von Benutzerdatenschutzeinstellungen und die Transparenz der Anzeigenverfolgung entwickelt und bietet eine nahtlose Integration für iOS- und Android-Plattformen. Darüber hinaus bietet es Wrapper-Plugins/Bridges für React Native, Flutter und Unity, wodurch es in verschiedenen Entwicklungsumgebungen vielseitig einsetzbar ist.
Schritte – Beschreibung auf hoher Ebene
-
Integration und Konfiguration:
- Integrieren Sie das SDK in Ihre App.
- Konfigurieren Sie die SDK-Einstellungen entsprechend Ihren Anforderungen.
-
Erstellen einer Instanz und Anzeigen des Consent Layers:
- Erstellen Sie beim Start der App eine Instanz von
CMPManager
Klasse. Diese Instanz übernimmt den Einwilligungsprozess. - Das SDK zeigt bei Bedarf automatisch den Zustimmungsbildschirm an.
- Erstellen Sie beim Start der App eine Instanz von
-
Verarbeitung der Einwilligungsdaten des Benutzers:
- Sobald die Einwilligungen eingeholt wurden, werden die Informationen gespeichert und stehen für Abfragen über verschiedene Eigenschaften und Methoden zur Verfügung, die unser SDK bereitstellt. Sie erhalten Informationen über abgelehnte oder akzeptierte Einwilligungen, Anbieter und Zwecke.
1.1 Integration und Konfiguration
Die Wrapper-Bibliothek für Flutter ist verfügbar unter pub.dev. Führen Sie in der Befehlszeile oder im Terminalfenster Folgendes aus:
flutter pub add cm_cmp_sdk_v3
Dadurch wird eine Zeile wie diese zur pubspec.yaml Ihres Pakets hinzugefügt (und eine implizite ausgeführt flutter pub get
):
dependencies:
cm_cmp_sdk_v3: ^3.2.0
Alternativ könnte Ihr Herausgeber Sie unterstützen flutter pub get
. Weitere Informationen finden Sie in den Dokumenten Ihres Redakteurs.
Stellen Sie außerdem sicher, dass Sie build.gradle
Datei in der android/app
Ordner Ihres Projekts die richtige Abhängigkeit deklariert hat. Da es sich um eine Flutter/Dart Native Bridge handelt, müssen alle Abhängigkeiten synchron sein. Dasselbe gilt für iOS: Stellen Sie sicher, dass Ihr podspec
Die Datei spiegelt die richtige Abhängigkeit wider.
Android
dependencies {
implementation "net.consentmanager.sdkv3:cmsdkv3:3.2.0" // Make sure this line is inserted
}
iOS
s.dependency "cm-sdk-ios-v3", "3.2.0"
Import
Jetzt können Sie in Ihrem Dart-Code Folgendes verwenden:
import 'package:cm_cmp_sdk_v3/cm_cmp_sdk_v3.dart';
1.2 Erstellen einer Instanz und Anzeigen der Zustimmungsebene
Innerhalb Ihres Codes müssen Sie eine Instanz der Klasse erstellen CMPManager
Sie müssen zwei Objekte einrichten, die an die Methode getInstance übergeben werden: UrlConfig
, das Ihre CMP-Konfiguration verwaltet, wie Code-ID und Standardsprache, und ConsentLayerUIConfig
. Dadurch wird das Aussehen der WebView konfiguriert, die die Zustimmungsebene anzeigt. Danach können Sie die Methode verwenden checkWithServerAndOpenIfNecessary()
um automatisch die erforderlichen Daten von unserem Server abzurufen und zu bestimmen, ob der Zustimmungsbildschirm angezeigt werden muss oder nicht. Wenn ja, zeigt das SDK den Zustimmungsbildschirm an dieser Stelle automatisch an, und zwar über einen WebView
Erstellt durch unser SDK, das die Zustimmungsebene mit dem Text und den Schaltflächen entsprechend Ihren CMP-Konfigurationen anzeigt (ausgewählt über die Code-ID Ihres CMP), die Daten sammelt und die Zustimmungsinformationen im Bereich NSUserDefaults/UserPreferences des Geräts speichert, damit die App die zielgerichteten Anzeigen entsprechend anzeigen kann.
Bitte beachten Sie, dass die Funktionen zur Bestimmung, ob eine Zustimmung erforderlich ist oder nicht, sowie die Anzeige der Zustimmungsebene von einer zuverlässigen Netzwerkverbindung abhängen. Wenn keine Verbindung verfügbar ist oder der Wiederholungsmechanismus unseren Server nicht erreichen kann, gibt das Ereignis didReceiveError einen Timeout-Fehler zurück. Das SDK kann daher überhaupt nicht feststellen, ob eine Zustimmung erforderlich ist, da es die Zustimmungsebene überhaupt nicht anzeigen kann. Bitte stellen Sie sicher, dass Ihre Logik dies berücksichtigt.
Ejemplo:
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');
}
}
}
Falls Sie sich für die Verwendung eines Ansichtsmodells entscheiden, würde es so aussehen:
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: $consent\nData: $jsonObject'),
didChangeATTStatus: (oldStatus, newStatus, last) =>
_logCallback('ATT Status changed: $oldStatus -> $newStatus'),
);
}
void _logCallback(String message) {
_callbackLogs = "$message\n$_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 Verarbeitung von Einwilligungsdaten der Nutzer
Überprüfung der Einwilligungen der Benutzer
Unser SDK bietet verschiedene Methoden zum Überprüfen und Abrufen von Einwilligungsinformationen. Die wichtigsten Methoden werden im folgenden Beispiel angezeigt:
// 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');
}
}
Weitere Informationen zu den anderen Methoden finden Sie in unserem ausführlichen API-Dokumentation.
Erneutes Öffnen des Consent Layers, um die Auswahl der Benutzer zu überprüfen
Um dem Benutzer die Möglichkeit zu geben, seine Auswahl zu überprüfen oder zu ändern, können Sie einfach anrufen openConsentLayer()
void openConsentLayer() async {
await _cmpSdkPlugin.forceOpen();
notifyListeners();
}
Diese Methode zeigt die Zustimmungsebene über dieselbe WebView-Instanz an, die in den vorherigen Schritten erstellt wurde.
Importieren/Exportieren von Einwilligungsinformationen in andere Quellen
In einigen Fällen kann eine native App Webviews enthalten, um Informationen wie Werbung oder Inhalte anzuzeigen. Um die Zustimmungsinformationen vom SDK an die Webview zu übertragen, können Sie die Zustimmungszeichenfolge wie folgt abrufen:
_cmpSdkPlugin.exportCMPInfo
Dadurch werden die Einwilligungsinformationen und alle weiteren Daten exportiert, die das CMP benötigt. Sie können diese Informationen dann an das CMP weitergeben, das sich in Ihrer Webansicht befindet, indem Sie sie der URL hinzufügen, die in der Webansicht aufgerufen wird.
Wenn Sie die Zustimmungszeichenfolge andernfalls mithilfe des SDK importieren müssen, können Sie das folgende Beispiel verwenden:
await _cmpSdkPlugin.importCMPInfo(
'Q1FERkg3QVFERkg3QUFmR01CSVRCQkVnQUFBQUFBQUFBQWlnQUFBQUFBQUEjXzUxXzUyXzUzXzU0XzU1XzU2XyNfczI3ODlfczI3OTBfczI3OTFfczI2OTdfczk3MV9VXyMxLS0tIw'
)
Integration mit Apple Tracking Transparency (ATT)
Falls Sie Tracking oder Analysen in Ihrer App verwenden, empfehlen wir Ihnen, die Anleitung auf zu lesen ATT-Implementierung hier.
Erstellen eines benutzerdefinierten Layouts
Um eine benutzerdefinierte Ansicht der WKWebView zu erstellen, z. B. indem Sie ihre Positionierung oder ihren Hintergrund ändern, können Sie die an das ConsentLayerUIConfig-Objekt übergebene Konfiguration wie folgt ändern:
ConsentLayerUIConfig(
position: .halfScreenTop,
backgroundStyle: .dimmed(.grey, 0.75),
cornerRadius: 20,
respectsSafeArea: false,
allowsOrientationChanges: true)
Protokollierung
Wenn Sie unser iOS SDK verwenden, müssen Sie möglicherweise Protokollinformationen für verschiedene Zwecke debuggen oder analysieren. Die von unserem SDK generierten Protokolle sind unter „CMP“ gekennzeichnet, sodass Sie einfach nur die relevanten Protokolle filtern und anzeigen können. Weitere Informationen finden Sie unter In diesem Abschnitt unserer Dokumentation.