[Flottement] 1. consentmanager Intégration SDK
Sur ce document, vous trouverez des informations générales sur la façon d'intégrer notre SDK à votre projet. Pour plus de détails, veuillez vous référer à notre Référence de l'API Documentation.
1. Installation
consentmanager Le SDK est une solution complète de gestion du consentement des utilisateurs dans les applications mobiles. Conçu pour gérer la conformité au RGPD, les préférences de confidentialité des utilisateurs et la transparence du suivi des publicités, ce SDK offre une intégration transparente pour les plateformes iOS et Android. De plus, il propose des plugins/ponts wrapper pour React Native, Flutter et Unity, ce qui le rend polyvalent dans divers environnements de développement.
Étapes – Description de haut niveau
-
Intégration et configuration:
- Intégrez le SDK dans votre application.
- Configurez les paramètres du SDK en fonction de vos besoins.
-
Créer une instance et afficher la couche de consentement:
- Au démarrage de l'application, créez une instance du
CMPManagerclasse. Cette instance gérera le processus de consentement. - Le SDK affichera automatiquement l'écran de consentement si nécessaire.
- Au démarrage de l'application, créez une instance du
-
Traitement des données de consentement de l'utilisateur:
- Une fois les consentements recueillis, les informations sont stockées et peuvent être interrogées via différentes propriétés et méthodes exposées par notre SDK. Vous disposerez d'informations sur les consentements rejetés ou acceptés, les fournisseurs et les finalités.
1.1 Intégration et configuration
La bibliothèque wrapper pour Flutter est disponible sur pub.dev. Sur la ligne de commande ou dans la fenêtre du terminal, exécutez :
flutter pub add cm_cmp_sdk_v3Cela ajoutera une ligne comme celle-ci au pubspec.yaml de votre package (et exécutera un implicite flutter pub get):
dependencies:
cm_cmp_sdk_v3: ^3.2.0Alternativement, votre éditeur peut prendre en charge flutter pub get. Consultez la documentation de votre éditeur pour en savoir plus.
Assurez-vous également que vous build.gradle déposer à l'intérieur du android/app Le dossier de votre projet possède la bonne dépendance déclarée. Il s'agit d'un pont natif Flutter/Dart ; toutes les dépendances doivent donc être synchronisées. Il en va de même pour iOS : assurez-vous que votre podspec le fichier reflète la dépendance appropriée.
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"Importer
Maintenant, dans votre code Dart, vous pouvez utiliser :
import 'package:cm_cmp_sdk_v3/cm_cmp_sdk_v3.dart';1.2 Création d'une instance et affichage de la couche de consentement
Dans votre code, vous devez créer une instance de classe CMPManager. Vous devrez configurer deux objets qui seront transmis à la méthode getInstance : UrlConfig, qui gère votre configuration CMP, comme le code-ID et la langue par défaut, et ConsentLayerUIConfig. qui configurera l'apparence de la WebView qui affichera la couche de consentement. Après cela, vous êtes prêt à utiliser la méthode checkWithServerAndOpenIfNecessary() pour récupérer automatiquement les données nécessaires à partir de notre serveur et déterminer si l'écran de consentement doit être affiché ou non. Si tel est le cas, le SDK affichera automatiquement l'écran de consentement à ce stade, via un WebView créé par notre SDK, qui affichera la couche de consentement avec le texte et les boutons en fonction de vos configurations CMP (choisies via le Code-ID de votre CMP), collectera les données et conservera les informations de consentement dans la zone NSUserDefaults/UserPreferences de l'appareil, afin que l'application puisse afficher les publicités ciblées en conséquence.
Veuillez noter que les fonctionnalités liées à la détermination de la nécessité ou non du consentement, ainsi que l'affichage de la couche de consentement, dépendent d'une connexion réseau fiable. S'il n'y a pas de connexion disponible ou si le mécanisme de nouvelle tentative ne parvient pas à atteindre notre serveur, l'événement didReceiveError renverra une erreur de dépassement de délai, et le SDK sera donc totalement incapable de déterminer la nécessité d'un consentement, car il sera totalement incapable d'afficher la couche de consentement. Veuillez vous assurer que votre logique en tient compte.
Mise en situation :
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');
}
}
}Si vous décidez d'utiliser un modèle de vue, voici à quoi cela ressemblerait :
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 Traitement des données de consentement des utilisateurs
Vérification des consentements des utilisateurs
Notre SDK propose différentes méthodes pour vérifier et récupérer les informations de consentement. Les principales méthodes sont présentées dans l'exemple ci-dessous :
// 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');
}
}
Pour plus d'informations sur les autres méthodes, veuillez vous référer à notre API Documentation.
Réouverture de la couche de consentement pour vérifier les choix des utilisateurs
Afin de permettre à l'utilisateur de vérifier ou de modifier ses choix, vous pouvez simplement appeler openConsentLayer()
void openConsentLayer() async {
await _cmpSdkPlugin.forceOpen();
notifyListeners();
}
Cette méthode affichera la couche de consentement via la même instance WebView créée dans les étapes précédentes.
Importation/exportation des informations de consentement vers d'autres sources
Dans certains cas, une application native peut contenir des vues Web afin d'afficher des informations, comme de la publicité ou du contenu. Afin de transmettre les informations de consentement du SDK à la vue Web, vous pouvez récupérer la chaîne de consentement à l'aide de :
_cmpSdkPlugin.exportCMPInfoCela exportera les informations de consentement et toutes les autres données nécessaires à la CMP. Vous pouvez ensuite transmettre ces informations à la CMP qui se trouve dans votre vue Web en les ajoutant à l'URL appelée dans la vue Web.
Si, par ailleurs, vous devez importer la chaîne de consentement à l’aide du SDK, vous pouvez utiliser l’exemple ci-dessous :
await _cmpSdkPlugin.importCMPInfo(
'Q1FERkg3QVFERkg3QUFmR01CSVRCQkVnQUFBQUFBQUFBQWlnQUFBQUFBQUEjXzUxXzUyXzUzXzU0XzU1XzU2XyNfczI3ODlfczI3OTBfczI3OTFfczI2OTdfczk3MV9VXyMxLS0tIw'
)Intégration avec Apple Tracking Transparency (ATT)
Si vous utilisez le suivi ou l'analyse dans votre application, nous vous recommandons de lire le guide sur Mise en œuvre du TCA ici.
Création d'une mise en page personnalisée
Pour créer une vue personnalisée de WKWebView, comme modifier son positionnement ou son arrière-plan, par exemple, vous pouvez modifier la configuration transmise à l'objet ConsentLayerUIConfig comme ci-dessous :
ConsentLayerUIConfig(
position: .halfScreenTop,
backgroundStyle: .dimmed(.grey, 0.75),
cornerRadius: 20,
respectsSafeArea: false,
allowsOrientationChanges: true)Journal
Lorsque vous utilisez notre SDK iOS, vous pouvez avoir besoin de déboguer ou d'analyser les informations des journaux à diverses fins. Les journaux générés par notre SDK sont étiquetés sous « CMP », ce qui vous permet de filtrer et d'afficher facilement uniquement les journaux pertinents. Pour plus d'informations, veuillez consulter cette section de notre documentation.
