Aucun envoi de données
Les fichiers métier et les correspondances restent dans la mémoire du navigateur.
Cas d’usage 04 · Protection des données
Anonymiser les données sensibles d’un tableur avant de les confier à une IA, puis ré-identifier le résultat — entièrement dans le navigateur.
Les fichiers métier et les correspondances restent dans la mémoire du navigateur.
Détection prioritaire des CIN, téléphones +212, RIB, ICE, CNSS et identifiants associés.
Les codes anonymisés sont restaurés localement après le traitement effectué par l’IA.

Atelier pratique
L’application ci-dessous est la version HTML exacte fournie. Chargez l’exemple intégré ou le classeur de test pour dérouler l’exercice.
Données d’exercice
Utilisez ce jeu de données pour tester la détection automatique, comparer l’aperçu avant/après et générer les deux fichiers de sortie.
Télécharger le classeur# Prompt – Application AnonymIA
## 1. Rôle et objectif
Tu es un développeur front-end senior et un spécialiste de la protection des données (RGPD / loi marocaine 09-08 / CNDP).
Crée l'application web **« AnonymIA »** qui :
1. **anonymise** un fichier Excel/CSV avant de l'envoyer à une IA (ChatGPT, Copilot…) ;
2. **ré-identifie** le fichier renvoyé par l'IA, c'est-à-dire remet les vraies valeurs.
Toute l'interface, les messages, les rapports et les exports doivent être **en français**. Les formats marocains (CIN, téléphone +212, RIB, ICE, CNSS) sont prioritaires.
## 2. Contraintes techniques (HTML5 / JavaScript)
- **Un seul fichier `index.html`**, autonome, sans étape de compilation.
- **HTML5 + CSS3 + JavaScript natif (ES2020+)**, sans framework.
- Bibliothèque **SheetJS** (xlsx.full.min.js) via CDN, version fixe, pour lire et écrire .xlsx, .xls, .ods et .csv.
- **100 % côté navigateur** : aucune donnée n'est envoyée sur Internet. Ajoute une balise Content-Security-Policy restrictive et explique-le dans un commentaire.
- **Sécurité XSS** : afficher les valeurs des cellules uniquement avec `textContent`, jamais avec `innerHTML`.
- **Aucune donnée réelle** stockée dans localStorage ou IndexedDB.
- **Logos** « Académie Groupe CDG » et « UIR Executive Education » intégrés en base64 dans l'en-tête. Couleurs : gris foncé #3a3f44, vert #6a9a3a, accent doré.
- Code organisé en modules commentés :
- **Lecture** : lecture des fichiers
- **Normalisation** : préparation des valeurs
- **Détection** : repérage des colonnes sensibles
- **Traitements** : application des techniques d'anonymisation
- **Correspondance** : création du fichier JSON
- **RéIdentification** : restauration des vraies valeurs
- **Export** : création des fichiers à télécharger
- **Interface** : affichage et interactions
- **AutoTests** : tests intégrés
## 3. Interface (une seule page, simple et intuitive)
- **En-tête** : les deux logos, le titre « AnonymIA » et un bouton mode clair/sombre.
- **Deux grands onglets** : **Anonymiser** et **Ré-identifier**.
- **Étapes numérotées** avec une courte explication en français à chaque étape.
- **Retour à l'utilisateur** : gros boutons, zone de glisser-déposer, barre de progression, notifications (succès/erreur) et confirmation avant toute suppression.
- **Autres éléments** :
- bouton « Charger un exemple » (jeu de données marocain fictif) ;
- bouton « Effacer tout » ;
- fenêtre « Aide » ;
- accessibilité : libellés, navigation au clavier, contraste suffisant.
## 4. Mode ANONYMISER – étapes
### Étape 1 – Importer
- **Formats acceptés** : .xlsx, .xls, .ods, .csv. Taille maximale : 50 Mo, avec un message d'erreur clair en français au-delà.
- **CSV** : détection automatique du séparateur (`;` `,` tabulation) et de l'encodage (UTF-8, Windows-1252).
- **Classeur à plusieurs feuilles** : l'utilisateur choisit la feuille à traiter.
- **Lecture des cellules** : lire le **texte affiché** pour ne pas abîmer les RIB de 24 chiffres, les téléphones commençant par 0 et les dates.
### Étape 2 – Normaliser (pour comparer, jamais pour remplacer)
- **Texte** : supprimer les espaces en trop ; retirer les séparateurs (espace . - /) dans les identifiants.
- **Téléphone** : convertir au format **+212XXXXXXXXX**, que le numéro commence par +212, 00212 ou 0, ou qu'il s'agisse d'un nombre de 9 chiffres commençant par 5, 6 ou 7.
- **Email** en minuscules ; **CIN et IBAN** en majuscules.
- **Noms** : minuscules et sans accents. Pour l'arabe, retirer les voyelles courtes (tashkeel) et uniformiser les formes de l'alif.
- La **valeur d'origine** est toujours conservée dans la correspondance.
### Étape 3 – Détecter les colonnes sensibles
Analyser jusqu'à 500 lignes par colonne. Le score de confiance (0–100 %) combine :
- le taux de correspondance avec les expressions régulières ;
- les mots-clés de l'en-tête ;
- la proportion de chiffres ;
- la longueur des valeurs ;
- le taux de valeurs uniques ;
- les correspondances avec les dictionnaires.
Règles :
- **CIN** : `\b[A-Z]{1,2}\d{4,6}\b`, seulement si au moins 80 % des valeurs correspondent ou si l'en-tête contient cin, cni, carte nationale ou identité.
- **Téléphone** : mobiles et fixes marocains (05, 06, 07, +212, 00212).
- **RIB** : 24 chiffres. **IBAN** : `MA\d{26}`.
- **Carte bancaire** : 13 à 19 chiffres, avec vérification de Luhn.
- **Email, dates** : JJ/MM/AAAA, AAAA-MM-JJ et dates Excel.
- **ICE, CNSS, passeport** : seulement si l'en-tête contient le mot-clé correspondant.
- **Noms** : mots-clés d'en-tête (nom, prénom, client, bénéficiaire, titulaire, contact) et dictionnaire de prénoms et noms marocains et français, avec variantes (Mohamed / Mohammed / Mhamed).
- **Ville / adresse** : mots-clés d'en-tête et liste des villes marocaines.
- **Texte libre** : longueur moyenne supérieure à 40 caractères, ou en-tête commentaire, remarque, note, description ou observation.
- **Ne pas signaler** un code comme « REF2024 » sans en-tête CIN.
Affichage :
- **Couleurs de l'en-tête** : rouge = sensible, orange = probable, vert = non sensible.
- **Badge** : type et pourcentage de confiance.
- **Infobulle** : explique pourquoi la colonne a été détectée.
### Étape 4 – Choisir la technique par colonne
Une liste déroulante par colonne, avec la meilleure option présélectionnée :
- **Ne rien faire**.
- **Pseudonymiser (réversible)** : remplacer chaque valeur par un code typé `[[TYPE-NNNN]]`.
- Types : NOM, CIN, TEL, EMAIL, RIB, IBAN, CB, ADR, VILLE, ICE, CNSS, PASS, DATE, ID.
- La **même valeur normalisée** reçoit toujours **le même code**, quelle que soit la colonne.
- Vérifier qu'aucun code de ce format n'existe déjà dans les données.
- **Supprimer la colonne** : la colonne disparaît du fichier anonymisé, mais ses valeurs sont gardées dans le JSON (par ID_LIGNE) pour pouvoir être restaurées.
- **Nettoyer le texte libre** : dans les commentaires, remplacer les identifiants cachés dans l'ordre IBAN → RIB → carte → email → CIN → téléphone → noms. Remplacer aussi les noms déjà présents dans les colonnes Nom/Prénom de la même ligne. Prévenir que des noms inconnus peuvent passer.
- Options possibles (non réversibles) :
- **Masquage partiel** : j***@domaine.ma, AB****56, 4 derniers chiffres pour un RIB ;
- **Hachage** : HMAC-SHA-256 avec Web Crypto ;
- **Généralisation** : âge en tranches de 10 ans, date en mois ou année, ville en région.
- **Aperçu** des 10 premières lignes avec un bouton Avant / Après et les cellules modifiées surlignées.
### Étape 5 – Anonymiser et télécharger
- Ajouter une **colonne `ID_LIGNE`** en première position (L-00001, L-00002…). Elle sert à relier les lignes au retour de l'IA.
- **Protection contre l'injection de formules** : préfixer d'une apostrophe toute cellule commençant par = + - @ tabulation ou retour chariot.
- **Reconstruire un classeur propre** : valeurs seules, sans formules, commentaires, liens, feuilles masquées ni propriétés (auteur, société).
- **Deux téléchargements**, nommés à partir du fichier d'origine :
1. `NomDuFichier_anonymise.xlsx` (ou .csv), à envoyer à l'IA ;
2. `NomDuFichier_correspondance.json`, à garder en sécurité. Afficher l'avertissement : « Ne jamais envoyer ce fichier à l'IA ».
- **Contenu du JSON** :
- version, date et nom du fichier d'origine ;
- feuille traitée ;
- liste des colonnes avec leur type et la technique appliquée ;
- table `code → valeur d'origine` ;
- valeurs des colonnes supprimées, rangées par ID_LIGNE.
- **Consigne à copier pour l'IA** : « Les valeurs de la forme [[TYPE-NNNN]] sont des identifiants anonymisés. Conserve-les exactement tels quels, sans les modifier, traduire ni inventer de nouveaux identifiants. Conserve la colonne ID_LIGNE. »
## 5. Mode RÉ-IDENTIFIER – étapes
1. **Importer** le fichier traité par l'IA (n'importe quelle structure ; il peut avoir de nouvelles colonnes ou des lignes réordonnées) et/ou coller le texte de l'IA, puis importer le **fichier JSON de correspondance**.
2. **Rechercher** dans chaque cellule et dans le texte les codes `\[\[[A-Z]+-\d{4,}\]\]` et les remplacer par la valeur d'origine.
3. **Accepter les variantes** que l'IA peut produire (crochets simples, espaces, minuscules) et les marquer « à vérifier ».
4. **Restaurer les colonnes supprimées** en les rattachant par `ID_LIGNE`.
5. **Rapport** :
- ✅ restaurés ;
- ⚠️ à vérifier ;
- ❌ inconnus (codes peut-être inventés par l'IA) ;
- ℹ️ lignes ajoutées ou manquantes.
6. **Télécharger** `NomDuFichier_restaure.xlsx` (classeur propre) ou copier le texte restauré.
## 6. Tests intégrés
Fonction `runSelfTests()` (bouton + console), avec résultats en français (réussi / échoué). Elle teste :
- chaque règle de détection avec des exemples positifs et négatifs ;
- la normalisation ;
- la cohérence des codes ;
- l'aller-retour complet anonymiser → ré-identifier ;
- un code corrompu ;
- la protection contre l'injection de formules.
## 7. Critères d'acceptation
- **Détection** :
- détecte AB123456, « 06 12 34 56 78 », « +212 7 00 11 22 33 », 00212612345678, un RIB de 24 chiffres, MA + 26 chiffres, une carte valide (Luhn) et un email ;
- ne signale pas « REF2024 ».
- **Cohérence** : la même CIN dans deux colonnes donne le même code.
- **Aller-retour** : anonymiser, ajouter une colonne contenant des codes dans des phrases, réordonner les lignes, puis ré-identifier : 100 % des valeurs sont restaurées. Une colonne supprimée est restaurée par ID_LIGNE.
- **Code inventé** : il est signalé comme inconnu, sans être restauré.
- **Formules** : une cellule `=HYPERLINK(...)` est neutralisée à l'export.
- **Réseau** : aucune requête après le chargement de la page.
- **Tests** : tous les tests intégrés réussissent.
Livre le fichier `index.html` complet et fonctionnel, sans espace réservé ni « TODO ».