2015-09-01 8 views
10

Web servisimiz bazı Zalgo text ile çarptı ve geleceğe iyi bir çözüm bulmaya çalışıyorum. Politikamız, tüm kullanıcı girişlerini kabul etmek ve onu kalıcı depolama biriminde saklamaktır (bu bölümün tamamının olması için arka tarafımızdaki girdiyi doğru şekilde kodlarız). Çıkış aşamasında, XSS saldırılarını ve diğer kargaşaları önlemek için orijinal kullanıcı girdisini bir beyaz liste ile filtre/çözümleyici üzerinden çalıştırıyoruz. Son zamanlarda bazı kullanıcılar Zalgo dünyasını bulmuşlar ve diğer insanlara bununla bazı sorunlara neden olmayı çok seviyorlar.Nasıl Zalgo metin tamamen ortadan kaldırmaksızın her yerde kanama önlemek için?

Zalgo metni, göründüğü kapsayıcıdan sızan bir Unicode metni parçasıdır. Sonuç olarak, tüm karmaşık birleştirme karakterlerini otomatik olarak kaldırmanın çok büyük bir savunma olduğunu düşünüyorum. Zalgo metnini belirli bir ana öğenin içinde bazı kötü yan etkiler olmadan yer almaya zorlamak için bir CSS hilesi var mı? Ben

<section class="userinput"> 
... user input here ... 
</section> 

varsa nasıl kullanıcı girişi section.userinput sınırları dışında kaçak yapmaz emin olabilirsiniz Örneğin

? Sanırım overflow: hidden veya clip: rect(...) doğru cevap olabilir, ama bu kullanım için daha iyi bir şey biliyor musunuz? Tercihen, kullanıcıların yapay olarak uzun yorumlar oluşturmasını önlemek için section.userinput { max-height: 200vh; } veya benzeri bir şey kullanabilirim. Bazı yorumlar 200vh'dan daha uzunsa, yalnızca bu yorum için bir kaydırma çubuğu olmalıdır. Normalde, tüm sayfa için yalnızca bir kaydırma çubuğu olmalıdır.

Yalnızca görsel etki alanındaki sorunla uğraşmaya çalıştığımı unutmayın. Kullanıcı girdisi olarak herhangi bir geçerli UTF-8 dizisini kabul etmekten büyük bir memnuniyet duyuyorum ve bu kullanıcı yorumunda berbat bir kullanıcı yorumuyla sonuçlanırsa sorun yok. Sadece bu yerdeki taşkınlıktan kaçınmaya çalışıyorum. Özellikle, trying to block the zalgo text veya filter zalgo-like text before display değilim.

cevap

4

Firefox ve Chrome ile an example case'u test ettikten sonra, en iyi seçeneğin overflow: auto bildirimini kullanmak olduğunu söyleyebilirim. overflow: hidden kullanımı, yalnızca olası kaydırma çubuklarının kullanıcı içeriğini kaybetmekten daha kötü olduğu düşünülürse mantıklı olacaktır.

overflow: auto, içerik uymazsa kaydırma çubuğuna otomatik olarak geri düşmeyi sağlar ve yine de kırpmayı seçilen öğeye zorlamaya zorlar.

Beyanname clip: rect(0,auto,auto,0); iyi değil çünkü yalnızca position: absolute; ve overflow: visible olmadan çalışır.

Bkz. an example without overflow: auto for an comparision.

İlgili konular