Comment empêcher les captures d’écran et enregistrements vidéo sur son site Web

Comment empêcher les captures d’écran et enregistrements vidéo sur son site Web

« Protéger son contenu en ligne, c’est comme verrouiller sa maison : vous savez que ce n’est pas infaillible, mais vous le faites quand même. »

Nous vivons à une époque où partager des informations en ligne est devenu naturel. Malheureusement, cela rend aussi vos contenus vulnérables. Que vous soyez développeur, formateur, propriétaire d’une plateforme e-learning ou tout simplement créateur de contenu, vous vous êtes peut-être déjà posé cette question : « Comment éviter que quelqu’un fasse une capture d’écran ou enregistre ma vidéo sans autorisation ? »

Et vous avez bien raison. Car même si l’on ne peut pas totalement empêcher ce genre de pratique, il existe des solutions concrètes pour rendre la tâche bien plus difficile, et ainsi protéger au mieux vos données, vidéos ou documents confidentiels.

Dans ce tutoriel, je vais vous expliquer clairement, les différentes méthodes que vous pouvez appliquer dès aujourd’hui, et ce, sans avoir besoin d’être un expert en cybersécurité.


Commençons par une vérité : aucune solution n’est infaillible

Soyons honnêtes dès le départ : il n’existe pas de méthode magique capable de bloquer toutes les tentatives de capture d’écran ou d’enregistrement vidéo. Même les géants comme Netflix ou Disney+, malgré des systèmes de protection avancés, ne peuvent empêcher quelqu’un de filmer son écran avec un téléphone.

Mais cela ne veut pas dire qu’il ne faut rien faire. Comme pour la sécurité d’un local ou d’un ordinateur, chaque barrière que vous ajoutez décourage un peu plus les utilisateurs malveillants.


Étape 1 : Désactiver le clic droit et les raccourcis clavier courants

Pourquoi c’est utile ?

La majorité des captures d’écran se déclenchent à l’aide de raccourcis clavier bien connus : « PrintScreen », « Ctrl+Shift+I » (pour ouvrir les outils de développement), ou encore « F12 ». De plus, de nombreux utilisateurs accèdent au code source via un simple clic droit.

Comment faire ?

Voici un script JavaScript simple à intégrer dans vos pages :

<script>
  document.addEventListener('contextmenu', e => e.preventDefault());

  document.addEventListener('keydown', function(e) {
    if (e.key === 'PrintScreen') {
      alert("La capture d'écran est désactivée sur ce site.");
      e.preventDefault();
    }
    if ((e.ctrlKey && e.shiftKey && e.key === 'I') || 
        (e.ctrlKey && e.key === 'U') || 
        (e.key === 'F12')) {
      alert("Cette action n’est pas autorisée.");
      e.preventDefault();
    }
  });
</script>

Ce code empêche :

  • l’ouverture du clic droit,
  • la vue du code source avec Ctrl+U,
  • l’accès à la console de développement avec F12 ou Ctrl+Shift+I,
  • et affiche une alerte si l’utilisateur tente une capture via la touche Impr. écran.

Limite : Cette méthode peut être contournée par les utilisateurs expérimentés, mais elle suffit à dissuader une bonne partie des internautes non techniques.


Étape 2 : Protéger vos vidéos contre les enregistrements

Une vidéo visible est une vidéo enregistrable

Dès qu’un contenu est affiché sur un écran, il devient techniquement possible de le copier ou de l’enregistrer. Mais vous pouvez tout de même limiter fortement les risques en utilisant certaines technologies.

Solution 1 – Utiliser un lecteur vidéo avec DRM

Si vous diffusez des vidéos (formations, conférences, documentaires…), utilisez un lecteur comme Shaka Player ou Video.js avec un système DRM (Digital Rights Management) comme Google Widevine.

Ces technologies chiffrent les vidéos côté serveur et ne permettent leur lecture que dans un contexte autorisé.

Cela empêche :

  • le téléchargement direct du fichier,
  • la capture via plugins ou outils comme Internet Download Manager,
  • et dans certains cas, même la capture d’écran est bloquée (sur Windows avec Edge/Chrome).

Solution 2 – Masquer les contrôles vidéo et le clic droit

<video controls oncontextmenu="return false;">
  <source src="video.mp4" type="video/mp4">
</video>

Ce code désactive le menu contextuel sur clic droit de la vidéo, empêchant ainsi de tenter un téléchargement rapide. C’est une couche supplémentaire de sécurité.


Étape 3 : Flouter ou masquer le contenu lorsqu’il perd le focus

Une astuce souvent négligée mais très efficace consiste à flouter automatiquement le contenu si l’utilisateur change d’onglet ou minimise la fenêtre.

Code :

<style>
  #contenu-confidentiel.flou {
    filter: blur(10px);
    pointer-events: none;
  }
</style>

<div id="contenu-confidentiel">
  <p>Voici du contenu que vous voulez garder privé.</p>
</div>

<script>
  document.addEventListener('visibilitychange', () => {
    const contenu = document.getElementById('contenu-confidentiel');
    if (document.hidden) {
      contenu.classList.add('flou');
    } else {
      contenu.classList.remove('flou');
    }
  });
</script>

Ainsi, dès que l’utilisateur bascule sur un autre onglet ou tente de capturer discrètement, le contenu devient illisible.


Étape 4 : Limiter techniquement l’accès aux fichiers sensibles

1. Utilisez un système d’authentification robuste

Avant d’afficher un contenu sensible, assurez-vous que l’utilisateur est authentifié, et que ses droits ont été vérifiés.

2. Générez des liens de téléchargement temporaires

Pour les fichiers PDF ou images, ne donnez jamais l’URL directe. Créez des liens temporaires dynamiques, valides quelques minutes, associés à un identifiant d’utilisateur.

3. Vérifiez le référent HTTP

Bloquez l’accès aux fichiers si le « référent » ne vient pas de votre propre domaine. Cela empêche le hotlinking ou l’accès direct via une URL copiée.


Étape 5 : Bonnes pratiques et outils complémentaires

  • Utilisez un gestionnaire de session pour détecter les connexions multiples ou suspectes.
  • Surveillez les comportements anormaux (téléchargements massifs, scripts inconnus, etc.).
  • Formez vos utilisateurs : expliquer pourquoi ces protections sont en place réduit le risque d’incompréhension ou de contournement.
  • Gardez vos scripts et CMS à jour pour éviter les failles exploitables par des extensions de navigateur.

En résumé

Aucune méthode ne peut garantir une sécurité absolue, mais plus vous ajoutez de couches, plus vous compliquerez la tâche aux curieux ou aux malveillants. Ce qui, dans la grande majorité des cas, suffit à protéger efficacement vos contenus.

TechniqueNiveau de protectionFacilité de mise en œuvre
Blocage JS des touchesMoyenFacile
DRM VidéoÉlevéComplexe
Floutage hors focusMoyenFacile
Authentification & liens temporairesÉlevéMoyen
Désactivation clic droitFaible à moyenTrès facile

Pour aller plus loin

Si vous souhaitez une analyse personnalisée de la sécurité de votre site, ou si vous cherchez à protéger un espace e-learning, un portail client ou des contenus sensibles, n’hésitez pas à me contacter ou à laisser un commentaire. N’hésitez pas aussi à consulte les autres articles du blog et à t’abonner à la NewsLetter pour ne rien rater. A bientôt !

Comments

No comments yet. Why don’t you start the discussion?

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *