hujung hadapan web
tutorial css
Adakah mungkin untuk menghalang pengguna daripada mengambil tangkapan skrin halaman web?
Adakah mungkin untuk menghalang pengguna daripada mengambil tangkapan skrin halaman web?
Semasa menyemak imbas internet, pengguna mungkin mendapati bahawa mereka perlu menangkap sesuatu untuk menunjukkan atau menunjukkan kepada seseorang, tetapi kadangkala mungkin terdapat maklumat sensitif pada halaman web yang mungkin tidak mahu pengguna tangkap skrin oleh pembangun.
Pengguna boleh menekan kekunci fungsi serta kekunci Windows dan bar ruang untuk mengambil tangkapan skrin. Dalam MacOS kita perlu menggunakan arahan, shift dan 3 untuk mengambil tangkapan skrin.
Dalam artikel ini, kita akan belajar cara menghalang pengguna daripada mengambil tangkapan skrin halaman web.
Bagaimana untuk menghalang pengguna daripada mengambil tangkapan skrin?
Arahan tangkapan skrin tidak boleh dilumpuhkan kerana ini adalah ciri terbina dalam dan dikawal oleh sistem pengendalian. Kami boleh menggunakan HTML, CSS dan JavaScript, tetapi masih tidak dapat menghalang pengguna daripada mengambil tangkapan skrin. Menghalang pengguna daripada mengambil tangkapan skrin adalah tugas yang sukar kerana pengguna boleh menyalin-tampal kandungan tapak web atau beberapa perisian pihak ketiga boleh digunakan untuk melakukan ini.
Walau bagaimanapun, kami boleh menggunakan beberapa kaedah untuk menghalang pengguna daripada mengambil tangkapan skrin halaman web pada tahap tertentu.
Contoh
Dalam contoh di bawah, kami telah memasukkan beberapa teks dan kemudian memasukkannya ke dalam div dan kemudian dalam bahagian CSS. Selepas itu kami menggunakan pertanyaan media dan tetapkan paparan kepada tiada. Dengan cara ini kandungan akan kelihatan kepada pengguna, tetapi pengguna tidak akan dapat mencetak skrin.
<!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>
Contoh
Dalam contoh seterusnya, kami akan memberi amaran kepada pengguna untuk tidak menyalin atau tangkapan skrin kandungan web dengan memaparkan mesej pada skrin.
<!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>
Dalam kod di atas, kami telah menggunakan perenggan yang sama yang kami gunakan dalam contoh sebelumnya, kali ini dalam bahagian CSS, kami telah menggunakan atribut pilihan pengguna dan menetapkan nilainya kepada tiada. Kini pengguna akan dapat melihat apa yang ada pada skrin tetapi tidak akan dapat memilihnya. Outputnya adalah seperti berikut
Contoh
Dalam contoh seterusnya, kami akan memberi amaran kepada pengguna untuk tidak menyalin atau tangkapan skrin kandungan web dengan memaparkan mesej pada skrin.
<!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>
Dalam kod di atas, kami telah menggunakan perenggan yang sama sekali lagi dan menggunakan baris kod dalam JavaScript yang akan memberi amaran kepada pengguna jika mereka cuba mengambil tangkapan skrin halaman web.
Kesimpulan
Tidak mungkin untuk menghalang sepenuhnya pengguna daripada mengambil apa-apa jenis tangkapan skrin atau menyalin dan kemudian menampal kandungan anda pada tapak web pihak ketiga yang lain. Skrin Cetak ialah ciri terbina dalam yang disediakan oleh setiap sistem pengendalian seperti Windows dan MacOS, dan ciri ini tidak boleh dilumpuhkan kerana ia dikawal oleh sistem pengendalian. Kami hanya boleh menghalang pengguna daripada menyalin kandungan sehingga satu tahap dan tidak lebih.
Atas ialah kandungan terperinci Adakah mungkin untuk menghalang pengguna daripada mengambil tangkapan skrin halaman web?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Alat AI Hot
Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik
AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.
Undress AI Tool
Gambar buka pakaian secara percuma
Clothoff.io
Penyingkiran pakaian AI
AI Hentai Generator
Menjana ai hentai secara percuma.
Artikel Panas
Alat panas
Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma
SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan
Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa
Dreamweaver CS6
Alat pembangunan web visual
SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)
Topik panas
Pembaca Skrin Demystifying: Borang & Amalan Terbaik Diakses
Mar 08, 2025 am 09:45 AM
Ini adalah jawatan ke -3 dalam siri kecil yang kami lakukan dalam kebolehcapaian bentuk. Jika anda terlepas jawatan kedua, lihat "Menguruskan Fokus Pengguna dengan: Fokus-Visible". Dalam
Buat borang hubungan JavaScript dengan rangka kerja pintar
Mar 07, 2025 am 11:33 AM
Tutorial ini menunjukkan mewujudkan bentuk JavaScript yang berpandangan profesional menggunakan rangka kerja pintar (nota: tidak lagi tersedia). Walaupun kerangka itu sendiri tidak tersedia, prinsip dan teknik tetap relevan untuk pembina bentuk lain.
Menambah bayang -bayang kotak ke blok dan elemen WordPress
Mar 09, 2025 pm 12:53 PM
CSS box-shadow dan garis besar sifat mendapat tema.json Sokongan dalam WordPress 6.1. Let ' s melihat beberapa contoh bagaimana ia berfungsi dalam tema sebenar, dan pilihan apa yang kita perlu gunakan gaya ini ke blok dan elemen WordPress.
Buat editor teks sebaris dengan atribut yang boleh dipertikaikan
Mar 02, 2025 am 09:03 AM
Membina editor teks sebaris tidak remeh. Proses ini bermula dengan membuat elemen sasaran yang boleh diedit, mengendalikan potensi pengecualian syntaxError di sepanjang jalan. Membuat editor anda Untuk membina editor ini, anda perlu mengubahsuai kandungan secara dinamik
Bekerja dengan Caching Graphql
Mar 19, 2025 am 09:36 AM
Sekiranya anda baru -baru ini mula bekerja dengan GraphQL, atau mengkaji semula kebaikan dan keburukannya, anda tidak akan ragu -ragu mendengar perkara seperti "Graphql tidak menyokong caching" atau
Menjadikan Peralihan Svelte Khas pertama anda
Mar 15, 2025 am 11:08 AM
API Peralihan Svelte menyediakan cara untuk menghidupkan komponen apabila mereka memasuki atau meninggalkan dokumen, termasuk peralihan svelte adat.
Membandingkan 5 Pembina Borang PHP Terbaik (dan 3 skrip percuma)
Mar 04, 2025 am 10:22 AM
Artikel ini meneroka skrip pembina bentuk PHP teratas yang terdapat di Envato Market, membandingkan ciri -ciri, fleksibiliti, dan reka bentuk mereka. Sebelum menyelam ke dalam pilihan tertentu, mari kita faham apa pembina bentuk PHP dan mengapa anda menggunakannya. Borang PHP
Muat naik fail dengan multer di node.js dan ekspres
Mar 02, 2025 am 09:15 AM
Tutorial ini membimbing anda melalui membina sistem muat naik fail menggunakan Node.js, Express, dan Multer. Kami akan merangkumi muat naik fail tunggal dan berganda, dan juga menunjukkan menyimpan imej dalam pangkalan data MongoDB untuk mendapatkan semula kemudian. Pertama, sediakan Projek anda
