Lorsqu'ils naviguent sur Internet, les utilisateurs peuvent constater qu'ils ont besoin de capturer quelque chose afin de le montrer ou de le démontrer à quelqu'un, mais parfois, la page Web peut contenir des informations sensibles que les développeurs ne souhaitent pas que les utilisateurs capturent.
Les utilisateurs peuvent appuyer sur les touches de fonction ainsi que sur la touche Windows et la barre d'espace pour prendre des captures d'écran. Sous MacOS, nous devons utiliser command, shift et 3 pour prendre une capture d'écran.
Dans cet article, nous apprendrons comment empêcher les utilisateurs de prendre des captures d'écran de pages Web.
Les commandes de capture d'écran ne peuvent pas être désactivées car ce sont des fonctionnalités intégrées et contrôlées par le système d'exploitation. Nous pouvons utiliser HTML, CSS et JavaScript, mais nous ne pouvons toujours pas empêcher les utilisateurs de prendre des captures d'écran. Empêcher les utilisateurs de prendre des captures d'écran est une tâche difficile, car les utilisateurs peuvent copier-coller le contenu d'un site Web ou utiliser un logiciel tiers pour le faire.
Cependant, nous pouvons utiliser certaines méthodes pour empêcher les utilisateurs de prendre des captures d'écran de pages Web dans une certaine mesure.
Dans l'exemple ci-dessous, nous avons inséré du texte puis l'avons inclus dans un div puis dans une section CSS. Après cela, nous utilisons media query et définissons l'affichage sur aucun. De cette façon, le contenu sera visible par l'utilisateur, mais celui-ci ne pourra pas imprimer l'écran.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Example of disabling the printing </title>
<style>
@media print {
html,
body {
display: none;
}
}
</style>
</head>
<body>
<div>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been
the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type
and scrambled it to make a type specimen book. It has survived not only five centuries, but also the
leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with
the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop
publishing software like Aldus PageMaker including versions of Lorem Ipsum.
</div>
</body>
</html>
Dans l'exemple suivant, nous avertirons l'utilisateur de ne pas copier ou capturer du contenu Web en affichant un message à l'écran.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Example of disabling the printing </title>
<style>
html {
user-select: none;
}
</style>
</head>
<body>
<div>
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
when an unknown printer took a galley of type and scrambled it to make a type specimen book.
It has survived not only five centuries, but also the leap into electronic typesetting,
remaining essentially unchanged. It was popularised in the 1960s with the release of
Letraset sheets containing Lorem Ipsum passages, and more recently with desktop
publishing software like Aldus PageMaker including versions of Lorem Ipsum.
</div>
</body>
</html>
Dans le code ci-dessus, nous avons utilisé le même paragraphe que celui que nous avons utilisé dans l'exemple précédent, cette fois dans la section CSS, nous avons utilisé la propriété user-select et défini sa valeur sur none. Désormais, l'utilisateur pourra voir ce qui est à l'écran mais ne pourra pas le sélectionner. Le résultat est le suivant
Dans l'exemple suivant, nous avertirons l'utilisateur de ne pas copier ou capturer du contenu Web en affichant un message à l'écran.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Example of printing a warning message to the user </title>
<script>
alert("Please!! do not try to take any kinds of screenshot of the content");
</script>
</head>
<body>
<div>
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
when an unknown printer took a galley of type and scrambled it to make a type
specimen book. It has survived not only five centuries, but also the leap into
electronic typesetting, remaining essentially unchanged. It was popularised in
the 1960s with the release of Letraset sheets containing Lorem Ipsum passages,
and more recently with desktop publishing software like Aldus PageMaker
including versions of Lorem Ipsum.
</div>
</body>
</html>
Dans le code ci-dessus, nous avons réutilisé le même paragraphe et utilisé une ligne de code en JavaScript qui avertira l'utilisateur s'il tente de prendre une capture d'écran de la page Web.
Il n'est pas possible d'empêcher complètement les utilisateurs de prendre tout type de capture d'écran ou de copier puis de coller votre contenu sur d'autres sites Web tiers. Print Screen est une fonctionnalité intégrée fournie par tous les systèmes d'exploitation comme Windows et MacOS, et ces fonctionnalités ne peuvent pas être désactivées car elles sont contrôlées par le système d'exploitation. Nous ne pouvons empêcher les utilisateurs de copier du contenu que dans une certaine mesure et pas plus.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Comment utiliser l'éditeur d'atomes
utilisation de la fonction de rééchantillonnage
Comment utiliser la fonction choisir
Comment créer un wifi virtuel dans Win7
Comment résoudre le problème de l'impossibilité d'ouvrir le gestionnaire de périphériques
Comment utiliser la fonction de longueur dans Matlab
Que signifie la fréquence d'images ?
La différence entre le câble de console et le câble réseau
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
