Beberapa situs mengklaim bahwa mengizinkan pengguna menempelkan sandi akan mengurangi keamanan. Namun, penempelan sandi sebenarnya meningkatkan keamanan karena memungkinkan penggunaan pengelola sandi.
Pengelola sandi biasanya membuat sandi yang kuat untuk pengguna, menyimpannya dengan aman, lalu menempelkannya secara otomatis ke kolom sandi setiap kali pengguna perlu login. Pendekatan ini umumnya lebih aman daripada memaksa pengguna untuk mengetik sandi yang cukup singkat untuk diingat.
Dalam kasus umum, pengguna tidak boleh dicegah menempelkan teks ke elemen <input>.
Kegagalan audit Lighthouse ini
Lighthouse menandai kode yang mencegah pengguna menempelkan konten ke kolom input non-hanya baca:
Lighthouse mengumpulkan semua elemen <input> non-hanya baca, menempelkan beberapa teks ke setiap elemen, lalu memverifikasi bahwa peristiwa paste tidak dicegah oleh pengendali peristiwa kustom.
Anda juga dapat mencegah penempelan di luar pemroses peristiwa paste.
Lighthouse tidak mendeteksi skenario itu.
Cara mengaktifkan penempelan ke kolom sandi
Menemukan kode yang mencegah penempelan
Untuk menemukan dan memeriksa kode yang mencegah penempelan dengan cepat:
- Luaskan panel Event Listener Breakpoints.
- Luaskan daftar Clipboard.
- Centang kotak
paste. - Tempelkan beberapa teks ke kolom sandi di halaman Anda.
- DevTools akan dijeda di baris pertama kode
dalam pemroses peristiwa
pasteyang relevan.
Hapus kode yang mencegah penempelan
Sumber masalahnya sering kali merupakan panggilan ke preventDefault()
dalam pemroses peristiwa paste
yang terkait dengan elemen input sandi:
let input = document.querySelector('input');
input.addEventListener('paste', (e) => {
e.preventDefault(); // This is what prevents pasting.
});
Jika Anda hanya memproses peristiwa menempelkan peristiwa untuk men-preemptnya, hapus seluruh pemroses peristiwa.
Referensi
Kode sumber untuk audit Mencegah pengguna menempelkan konten ke kolom input