DASTRA
Français
Français
  • Introduction à Dastra
  • 🇪🇺Rappels utiles
    • Introduction au RGPD
    • Notions clefs du RGPD
      • Donnée personnelle
      • Registre des traitements
      • Analyse d'impact
      • Durées de conservation
      • Droits des personnes
      • Confidentialité dès la conception et par défaut
      • Mesures de sécurité
      • Violations de données
    • Gestion des risques
      • Définition des risques
      • Evaluation d'un risque
      • Risques sous-traitants
  • 👨‍💻Bien commencer
    • Mise en place
      • Les notions importantes
      • Créer et paramétrer un espace de travail
      • Créer et paramétrer les unités organisationnelles
      • Désigner un DPO
      • Ajouter une autorité chef de file
      • Inviter des utilisateurs
      • Gérer les rôles et permissions
      • Créer puis affecter des équipes
      • Questions fréquentes
    • Tutoriel
      • Etape 1 : La mise en place
      • Etape 2 : Cartographier vos traitements de données à caractère personnel et établir le registre
      • Etape 3 : Gérer les risques
      • Etape 4 : Prioriser les actions à mener
      • Etape 5 : Implémenter les processus internes
      • Etape 6 : Documenter la conformité
    • Support
      • L'assistant dastronaute
      • L'aide en ligne
      • Demande de support
      • Le processus de support client
  • ⚙️Les fonctionnalités
    • Tableau de bord
    • Généralités
      • Filtres avancés
      • Importer vos données (Excel, Csv)
      • Gestion des tags
      • Champs personnalisés
      • Assistant IA
      • Modèles email
      • 😇Foire aux questions
      • Discussions internes
    • Cartographie des données
      • Référentiels
    • Registre des traitements
      • Registre "Responsable de traitement"
      • Registre "Sous-traitant"
      • Etablissez votre registre
      • Exporter / importer le registre
      • Utiliser un modèle de traitement
      • Déclarer un traitement
      • Compléter un traitement
        • Général
        • Parties prenantes
        • Finalités
        • Actifs
        • Données et conservation
        • Personnes concernées
        • Droits des personnes
        • Destinataires
          • Transferts de données hors UE
        • Mesures de sécurité
        • Analyse d'impact
        • Documents
        • Récapitulatif
      • Créer des relations entre les traitements
      • Fraicheur des traitements
      • Partager le registre
      • Visualisation des données
        • Visualiser l'arborescence des traitements
        • Visualiser la cartographie des données du registre
        • Visualiser la carte des transferts
      • Questions fréquentes
    • Gestion de documents (GED)
      • Modèles de documents
    • Questionnaires et PIA
      • Créer ou modifier un modèle de questionnaire ou un PIA
        • Créer ou modifier un modèle de PIA
      • Planifier un questionnaire ou un PIA
      • Partager un rapport d'audit ou PIA
      • Supprimer un audit ou un modèle d'audit
      • Questions fréquentes
    • Privacy hubs
      • Créer un Privacy hub
      • Paramétrer votre Privacy hub
        • Page d'accueil et configuration générale
        • Questionnaires
        • Exercice des droits
        • Registre des traitements
        • Documents
        • Organigramme
        • Contacts
        • Sécurité
        • Apparence et design
      • Prévisualiser et partager votre Privacy hub
      • Collecter des projets de traitements, d'incidents, d'actifs ou de contrats
    • Contrats
      • Déclarer un contrat
      • Structure d'un contrat
      • Les documents
      • Les actifs
      • Les signataires
      • Utilisateurs associés
      • Signer le contrat
      • Intégration avec Docusign
      • Versionner le contrat
      • Revue régulière du contrat
      • Modèles de contrats dynamiques
    • Gestion des risques
      • Glossaire
      • Le processus de gestion des risques
        • 1. Identifier
        • 2. Evaluer
        • 3. Maîtriser
        • 4. Contrôler
        • Récapitulons
      • Comparaison Dastra / eBios RM
      • Associer un risque à un traitement
      • Questions fréquentes
    • Planification
      • Créez ou modifier une tâche
      • Créer ou modifier un projet ou une itération
      • Suivre, filtrer ou exporter les tâches
      • Personnaliser le workflow des tâches
      • Synchroniser avec d'autres calendriers
      • Questions fréquentes
    • Exercices des droits
      • Gestion des demandes d'exercices de droits
      • Formulaire de collecte de demandes
      • Intégration technique
      • Intégration de l'API
    • Violations de données
      • Documenter une nouvelle violation de données
      • Exportez vos violations de données
    • Cookies
      • Mise en place de la bannière
        • Etude préliminaire
        • Scannez les cookies déposés sur votre site Web
        • Classifiez les cookies par catégories de consentement
        • Les finalités des cookies
        • Configurez un widget de consentement aux cookies
        • Collectez les preuves de consentement cookies
        • Allez plus loin sur le consentement des cookies
        • En cas d'indisponibilité
      • Intégration technique
        • Fonctionnement de la bannière
        • Démarrage rapide
          • Wordpress
        • Gestion de la langue
        • Tester l'intégration d'un widget
        • Blocage des cookies
          • Blocage des iframes (twitter/youtube...)
          • Google Tag Manager
        • Design avancé
        • Gérer le consentement programmatiquement
        • Identification des utilisateurs
        • Applications mobiles
          • Applications hybrides
          • Applications natives
        • TCF 1.1/2.0
      • Conformité RGAA
      • Dépannage
    • Revue régulière (fraicheur)
    • Rapports personnalisés
      • Intégration dans les outils d'analyse de données (BI)
    • Systèmes d'IA
      • Etablir un registre des Systèmes d'IA
      • Analyse de risque et valeur ajoutée
      • Notice de transparence
      • Le référentiel des modèles d'IA
    • Configuration avancée
      • Rôles et permissions
      • Single Sign On (SSO)
        • SAML 2
        • OpenId
        • ADFS
        • Active Directory (MS Entra)
        • Okta
        • Problèmes connus
      • SCIM
      • Gestion des clés d'API
      • Notifications
      • Adresses emails de collecte
      • Intégrations OneDrive/Google Drive
      • Etapes de processus
      • Webhooks
      • Configuration du SMTP
      • Règles de workflows
      • Modèles de messages
      • Domaines emails
  • PARTENAIRES
    • Portail partenaire
  • 📄La documentation API
    • Liste des endpoints d'API
    • Cas d'usage de l'API
    • Configuration API
    • Authentification
    • API References
    • Intégrations via Zapier
      • Questions fréquentes
  • 🛡️La sécurité
    • Sécurité chez Dastra
    • Authentification forte
    • Qualité de nos services
  • Certifications
  • 🤖DIVERS
    • Foire aux questions
    • Problèmes connus
    • Notes de version
    • Webinaires
Propulsé par GitBook
Sur cette page
  • Objectifs
  • Prérequis
  • Mise en place du widget dans l'interface dédiée
  • Comment forcer la langue du formulaire ?
  • Comment envoyer automatiquement des valeurs de formulaire au widget ?
  • Envoi des paramètres en utilisant le mode page
  • Fermer le widget en cliquant en dehors de la fenêtre
  • Intégrer plusieurs widgets dans une seule page

Cet article vous a-t-il été utile ?

  1. Les fonctionnalités
  2. Exercices des droits

Intégration technique

Cet article vous présente comment intégrer le widget d'exercice de droit dans une page web

Dernière mise à jour il y a 6 mois

Cet article vous a-t-il été utile ?

Objectifs

Le widget d'exercice de droits vous permet de collecter automatiquement depuis une page de votre site des demandes d'exercice de droit de différents types (suppressions, modifications, rectifications...)

Le widget est intégré au SDK javascript de dastra.

Prérequis

Afin de mettre en place le widget d'exercice de droit, vous devez disposer d'une clé publique d'API : ou

Mise en place du widget dans l'interface dédiée

Pour commencer, vous devez mettre en place le widget dans d'exercice de droits :

Voici un exemple simple d'intégration du widget (en mode popup avec un bouton d'ouverture) :

<div id="customer-subject-form-custom" ></div>
<button id="customer-request-button">Open the widget</button>
<script src="https://cdn.dastra.eu/sdk/dastra.js?key={YOUR PUBLIC KEY}" async></script>
<script>
  window.dastra = window.dastra || [];
  dastra.debug = true;
  window.dastra.push(function(){
    dastra.loadCustomerSubjectForm({
      selector: '#customer-subject-form-custom',
      widgetId: {your widget id},
      onLoad: function (form) {
        document.getElementById('customer-request-button').addEventListener('click',function () {
          form.open()
        })
      }
    })
  })
</script>

Comment forcer la langue du formulaire ?

Par défaut, ce sera la langue du navigateur qui sera prise. Si la langue n'est pas disponible dans les traductions du widgets, la langue par défaut sera sélectionnée automatiquement. Vous pouvez forcer la langue courante du widget en ajoutant la propriété data-lang à la div où le formulaire s'affichera.

Dans cet exemple, la langue italienne sera sélectionnée par défaut (si elle est disponible)

<div id="customer-subject-popup" data-lang="it"></div>

Comment envoyer automatiquement des valeurs de formulaire au widget ?

<script>
  dastra.push(['set','dsr:refId','{your custom userId}'])
</script>

Vous pouvez remplacer le nom de la colonne refId par le nom de propriété suivante :

  • refId : the unique identifier of the user

  • familyName

  • givenName

  • email

  • city

  • zipCode

  • countryCode

  • address

  • phoneNumber

  • message

  • additionalDatas*

*Pour le cas spécifique des champs personnalisés, vous devez faire référence au nom additionalDatas :

<script>
  var payload = {
    customFieldSlug1: 'test', 
    customFieldSlug2: 'test'
  };
  
  // You can use this synthax for setting global custom fields as an object
  dastra.push(['set','dsr:additionalDatas', payload]);
  
   // Or directly for a single field, use the prefix @
   dastra.push(['set','dsr:@customFieldSlug1', 'test']);
</script>

Les champs additionnels seront automatiquement fusionnés.

Dans cette configuration, les champs prérenseignés apparaitront en lecture seule sous une forme grisée.

Envoi des paramètres en utilisant le mode page

Il est également possible de passer ces paramètres en utilisant les paramètres querystring, il suffit de préfixer le nom du paramètre par dsr_ :

https://api.dastra.eu/v1/client/customer-subject-form?id=<Your widget id>
&key=<your public key>
&dsr_email=test@github.org
&dsr_givenName=Dastonaute
&dsr_refId=123456
&...etc...

Fermer le widget en cliquant en dehors de la fenêtre

Si votre widget est configuré avec un type d'affichage "Popup", nous n'avons pas mis en place le comportement de fermeture de la modal en cas de clic en dehors de la fenêtre, car les risques de perte de données saisies par l'utilisateur sont trop importants.

Cependant, si vous souhaitez que le widget se ferme lorsque l'utilisateur clique en dehors du widget, il est possible de le mettre en place à l'aide du code suivant :

window.dastra.customerSubjectReady().then((form) => { 
  form.closeOnBackdrop = true; 
});

Attention, cela aura pour effet de supprimer l'intégralité du texte saisi par l'utilisateur sans aucun avertissement ! Si le formulaire est long, cela peut se produire facilement lors d'une sélection dépassant un champ textuel long.

Intégrer plusieurs widgets dans une seule page

Par défaut, Dastra ne permet pas l'intégration de plusieurs widgets au sein de la même page.

Cependant, il est possible de faire cette intégration avec la méthode suivante.

<html lang="en-GB">
<body>
  <h2>My first widget</h2>
  <div id="widget-1"></div>
  <h2>My second widget</h2>
  <div id="widget-2"></div>
  <script async src="https://cdn.dastra.eu/sdk/dastra.js?key={YOUR_PUBLIC_KEY}"></script>
  <script>
    dastra = dastra || [];
    
    // Widget 1 initialization
    dastra.push(function () {
      dastra.loadCustomerSubjectForm({
        selector: "#widget-1",
        widgetId: 991, // YOUR_WIDGET_ID_
        onLoad: function (form) {
          // Initialization
        },
      });
    });

    // Widget 2 initialization
    dastra.push(function () {
      dastra.loadCustomerSubjectForm({
        selector: "#widget-2",
        widgetId: 992, // the widget identifier for the second widget
        onLoad: function (form) {
          // Initialization
        },
      });
    });
  </script>
</body>
</html>

Pour intégrer les champs initiaux dans cette configuration, il faut utiliser le code suivant :

window.dastra.push(function () {
  dastra.loadCustomerSubjectForm({
    selector: "#customer-subject-form-custom",
    widgetId: widgetId,
    onLoad: function (form) {
      form.initialData = {
        givenName: "prénomTest"
      };
      document
        .getElementById("customer-request-button")
        .addEventListener("click", function () {
          form.closeOnBackdrop = true;
          form.open();
        });
    },
  });
});
⚙️
lire la documentation
accéder directement à la page de gestion des clés d'API
le panel de gestion des widgets