Kullanıcıların giriş alanlarına yapıştırma yapmasını engeller

Bazı web siteleri, kullanıcıların şifre yapıştırmasına izin vermenin güvenliği azalttığını iddia eder. Ancak, şifre yapıştırma işlemi aslında güvenliği iyileştirir şifre yöneticilerinin kullanımına olanak tanıdığından.

Şifre yöneticileri genellikle kullanıcılar için güçlü şifreler oluşturur, bunları güvenli bir şekilde saklar ve kullanıcıların giriş yapması gerektiğinde otomatik olarak şifre alanlarına yapıştırır. Bu yaklaşım, genelde Kullanıcıları yeterince kısa şifreler girmeye zorlamaktan daha güvenlidir hatırlarsınız.

Genel olarak, kullanıcıların <input> öğelerine yapıştırması engellenmemelidir.

Bu Lighthouse denetiminin neden başarısız olduğu

Lighthouse, kullanıcıların salt okunur olmayan giriş alanlarına yapıştırmasını engelleyen kodu işaretler:

Lighthouse, salt okunur olmayan tüm <input> öğelerini toplar. her öğeye bir metin yapıştırır, ve ardından paste etkinliğinin bir özel etkinlik işleyici tarafından engellenmediğini doğrular.

Ayrıca, paste etkinlik işleyicisinin dışına yapıştırılması önlenebilir. Lighthouse bu senaryoyu algılamaz.

Şifre alanlarına yapıştırmayı etkinleştirme

Yapıştırmayı engelleyen kodu bulma

Yapıştırmayı engelleyen kodu hızlı bir şekilde bulmak ve incelemek için:

1. Etkinlik İşleyici Ayrılma Noktaları bölmesini genişletin.
2. Yapıştırma panosu listesini genişletin.
3. paste onay kutusunu işaretleyin.
4. Sayfanızdaki bir şifre alanına metin yapıştırın.
5. DevTools, ilgili paste etkinlik dinleyicisinin ilk kod satırında duraklatılmalıdır.

Yapıştırmayı engelleyen kodu kaldırın

Sorunun kaynağı genellikle, şifre giriş öğesiyle ilişkili paste etkinlik dinleyicisinde preventDefault() çağrısıdır:

let input = document.querySelector('input');

input.addEventListener('paste', (e) => {
  e.preventDefault(); // This is what prevents pasting.
});

Yalnızca önceden ayırmak için yapıştırma etkinliklerini dinliyorsanız etkinlik işleyiciyi tamamen kaldırabilirsiniz.

Kaynaklar

Kullanıcıların giriş alanlarına yapıştırmasını engeller denetimi için kaynak kod