个人中心
文章发布
退出
作者热门文章
- objective-c - iOS 5 : Can you override UIAppearance customisations in specific classes?
- iphone - 如何将 CGFontRef 转换为 UIFont？
- ios - 以编程方式关闭标记的信息窗口 google maps iOS
- ios - Xcode 5 - 尝试验证存档时出现 "No application records were found"
25
4
我们的 Web 服务受到了一些攻击 Zalgo text我正在努力为 future 想出一个好的解决方案。我们的政策是接受所有用户输入并将其保存在永久存储中(我们为后端正确编码输入，所以这部分没问题)。在输出阶段，我们通过带有白名单的过滤器/解析器运行原始用户输入，以避免 XSS 攻击和其他困惑。最近一些用户发现了 Zalgo 的世界，他们就是喜欢用它给其他人带来一些麻烦。
在我看来，Zalgo 文本只是一段从预期容器中泄漏出来的 Unicode 文本。因此，我认为自动删除所有复杂的组合字符是过于激进的防御。 有没有人知道一个 CSS 技巧来强制 Zalgo 文本包含在给定的父元素中而没有一些讨厌的副作用？
例如，如果我有
<section class="userinput">
... user input here ...
</section>
如何确保用户输入不会泄漏到 section.userinput 的边界之外？我猜想 overflow: hidden 或 clip: rect(...) 可能是正确的答案，但是您知道这个用例的更好的答案吗？最好我仍然可以使用 section.userinput { max-height: 200vh; } 或类似的东西来避免用户创建人为的长评论。如果某些评论的长度超过 200vh，它应该单独为该评论提供一个滚动条。通常整个页面应该只有一个滚动条。
请注意，我只是试图解决视觉领域中的问题。我非常乐意接受任何有效的 UTF-8 序列作为用户输入，如果用户评论乱七八糟导致该用户评论看起来像废话，我也可以接受。我只是想避免那些废话到处都是。具体来说，我不是 trying to block the zalgo text或到 filter zalgo-like text before display .
最佳答案
经过测试an example case对于 Firefox 和 Chrome，我认为最好的选择是使用声明 overflow: auto。只有当可能的滚动条被认为比丢失用户内容更糟糕时，使用 overflow: hidden 才有意义。
overflow: auto 允许在内容不适合时自动回退到滚动条，并且它仍然强制剪裁到所选元素。
声明 clip: rect(0,auto,auto,0); 不好，因为它只适用于 position: absolute; 并且没有 overflow : 可见。
参见 an example without overflow: auto for an comparision .
以上示例作为片段内联在此处:
一个示例没有针对 Zalgo 文本的保护措施:
body
{
background: #ccc;
color: #000;
font-family: sans-serif;
padding: 4em 1em;
}
section.userinput
{
margin-top: 0.5em;
padding: 0.1em 0.25em;
background: #fff;
border: solid #ccc 0.1em;
border-radius: 0.5em;
font-size: 120%;
}
.v1 section.userinput
{
overflow: auto;
}
.v2 section.userinput
{
position: absolute;
clip: rect(0em,auto,auto,0em);
}<body class="">
<section class="userinput">
Some real content here.
</section>
<section class="userinput">
T̠̬̘̯̙̲̪̪͇̜̭̣̘̟̲͇̳̬͕̖̜̯̘͉͈͉͎̱͓̣̰̳̳͉̙̯̙̰͚͇͎͕̘̯̳̞̲̼̱̖̩͙͕̤͂̋͌ͤ̒ͬ̀͒͂͒ͩ̌͗̋̓ͭ́̀̿͒ͣͮ̓̋ͭ͊͒͐ͩ̆̓͂ͫ̐͂̇͛͑̓̚ͅẽ̗̙͚̮̭̮̬̠͈̻̦̭̭̳̹̯̹̦̔̌ͯ͂̎̈̊̍ͣ̿̈̈̿̄ͦͭ̍͑̽̎̅͛͗͐ͬ̂̊̽̌̎̋ͭ͆̈́̓ͦͦ̑͛ͯs̭̠͖̝͙̩̫̫̥̦͚̝̼̣̥̗ͣͦ͑́͐ͭ͊ͧ̽͐̈̔͛ͨ́̎̔ͤ͐͒̓̀̅̈́̊̋͋̀̿̎͒̉̽͂ͮͬt̾͒̂̽̐ͪ̆̾ͮ͌̽͛̌͒̔ͧ͗̿ͩ̄̿̿̌ͪͩ̊̏͑͌̀̋ͩ͆ͣ̑̏́̽̐͐̔ͪ̓̓ͭ͆ ̯̘͙̠̦̩̝͎̭̖̪̗̞̖̟̲͖̥͙͕̟̝̹͎̽o̼̮̭̞ͯͬ̀͐͗̿ͣ͛ͮͭ̎ͨ͒̌̾̐̉̍͗̎̈́̆ͪͦ̌ͧͦ̓ͨ̐ͯ͒͑͛ͯ̽ͅf̝̪̼̠͎͇̹̝̙̰̟̼͎̱͂ͩ̈́̌ͬ̒ͧ̽̅̉ͧ́͒̒͊ͦͭͭͭ͗́̽ͦ ͚̝̝̠̪͍̰̺̳̫̭͎͔̭̟͍͎͇͎͈͔̠̬͇̦͈̟̰̱̹̲̰̭̲̭̺̜͚̰̹̮̣̤̲̪̙̞͇̦͙͆ͪͨ̐ͨ̽̒͛ͩ̐ͤ͌̂́͒̌ͭͩͦ̎́̈ͬ̓̑̔͐̎͒̔̄ͥ̏ͥͯͧ͐ͪͧͥ̂ͬ̒̀̉̓ͭ̚ͅͅͅͅZ̘̥̲͍̠͎̱̺̘͈͍̟̤̠̮͖͉͕̙̩̲̣̠͎̥̣̜͚̜͕̻͔̰̞̫̭̹͕͙̝̠̮̣̰ͤͦ̍̓ͪͥ̒ͩ̋͆̍͋̽̅͗̈ͨ̂ͨ͋̔̔̓ͪͣ̅̇̏͒ͬ͐ͩ̇ͨ̋ͣ̌̔ͨ́ͪ̔̾̄ͤ̅͑̚ͅA̞̜̺̣͓̼̭̭͈̳̞͚̭̭͕̺͉̜̗̼̣̩̪͂ͯ̈́̍̍͛ͮ̂ͯ̽̎ͬͯ͆̋͌̍͐̌͗ͤ̒ͤ͊̐̈́ͧ̓̇ͬͦ̾ͭ̐̆̚ͅͅͅL̪͉̬̦̝̠̲͖̘̮̙̳͓͇͇̪̱͉̱͓̺͙͓̲̇́̍̽̇̎͊̍̐ͩ̔̋́ͬ̍ͮͫͮ͗̍͋ͭͯ̑̉̈́̄̾̂̀͆̅͑̽̃̚G̣̺̼͔̺̖̣̥̝̰͙̖͖̮̻̩͓̞͈̜̗̤̺̥̻̞͇̩͕̲̙̝̲̤̤̜̐͗͐ͦ̉͐͗ͩ̿ͩ̑ͫ̍͛̄ͦ̔̚O͇͎̬̰̦̜̻͔͇̖͇̞̪͉͉͔͕̥͇̬̮̰̠̟̤̰̹͖̗̺̙͍ͮͨ̿ͪͯ̈́ͫ̔̽̃̀ ̺͕̠̰̝͎̰̟̠̲̗͈̬̥͈͎̺̮̗͍̺͚̟̠̙̠̜̘̹͉̖̤͉̫̰̱̭̠̲̲̗͒ͥͯ̎͐ͨ̓̓ͮ͒ͧ̒̾́̍̍ͦͥ̈́͒͊̃̓̈̈́̀ͮ̂ͪ̓̄̏ͫ̄̓̓̿̓̔̋̎ͧͪͩͪ͋ͫt̘̥̳̺̳̟̯̜̱̯̬̣̣͔̬̟͈͖̗̹͉̫̯́̋͒͂̈́̎͐̇́ͫ̒͛ͥͦ̐̿͂͒͗̃ͮ͒ͪ̌͆̏ͯ̏ͯ̊ͣ̾̃͋ͩ̃̿͐e̹̠̻̟̪̪͎̭̭͎͎̮̹̬̮̪̓̑ͨ̐͐̈́̓ͤͦ͂̿̅͋ͭ̑̓ͬ͐͐ͤ͐ͪ̒ͥ̀̈́ͪ̇̆ͤ̏̏̄̾̌͒ͬ̊ͬ͛̄̄̌̍͋ͥͅͅx̪͇̞̫̰̠͓̣̻̯̞̭̙̝̣͉̱̘̤͇̦̘̙̥͚̫̩̲̘̻͈͉̱͙͇͙ͫ̐̌͛̓͛ͨ͒̂t̩̖̮̙̻ͬ͗͛̍̅̌ͧ͒ͫ̓ͮ̈͒̾ͮͣͮͨͪ͆ͥ̐̍ͮ̽̅̈́̿ͫ͐̍̉ͦͮ͆͗̔̎̿̇ͧ̋ͨͮ̐̓͑̽̑ͤ̊̚̚ͅ ̝͔̺̩͔͈̰͈̣̫̤͉͚͇̟̹̘͔͇̥̘̘̝͛͛̒ͭͣͮͥͦ̿̏ͥͦ̀͂̾͆ͯͧͮͤ͌̌́͗ͨ̎̒ͬ̈́ͧ̊ͨ̓͂̾̉͐ͦ̃̃̚ͅẖ̰̠̮͓̣̯̭̥̹̜̟͍͍͇̀ͧ̽͑̄͊̋̐͋ͨ̔ͭͬ́̀̐͌͗ͥ̓̇͗̂̊ͅe͇͙͕̺̖̰̟̠̩̘̪̳̻̳͉͔̺̳̲̦̘̞̬̬̝͓̬̣̟͕̘͓̬̍͗̋ͮ͑ͣ͗̓̓̎̈̃̾̊̃ͧ̊ͪ̃̀͋̋̄͑̈́̂́͒̔̎̎ͥ͛͌̃͒̈́ͤ͛ͬͫͪ̚r͉̮̼̙̩͖͍̗̣̘͚̭̩͙͙̻͓̦̱̣͉̮̲͇̥͉͚̲͕͖̩̦̫̪̬͔̟͔̦̻̼̼̫̫̯̣̮͈̺͓͖̬̂̾͛̉̆̍ͥ̈́̓̆ͫ͑̄̔̅̈̏̅̓ͨ͐̊ͮ̋̈́ͣͮ̋̓̾ͤ͊ͬ̀̑ͣ͊̇͌ͯ̚ͅḙ̲͍͙͕̯̘͓͔͔͈̹͈̗͎͕̬̖̟̖͚̳͎̖ͩ͊̃ͫ̔̓͒͗ͩ͋̂ͩͩͧ̍͛̿͒ͩͅ.̯̗͗̑̍̑͗ͫͦͦͪͪͧ́̾̓̌̉͑̊̌̿̓ͫ̆̑̽̽ͪͦͨ͌ͦͨ̓
</section>
<section class="userinput">
Some another real content here.
</section>
</body>示例带有防止出血 zalgo 文本的保障措施:
将 overflow: auto 应用于每个用户输入容器(唯一的区别是 body 元素中的 v1 类；您也可以尝试类 v2 以了解为什么它不适用于此目的):
body
{
background: #ccc;
color: #000;
font-family: sans-serif;
padding: 4em 1em;
}
section.userinput
{
margin-top: 0.5em;
padding: 0.1em 0.25em;
background: #fff;
border: solid #ccc 0.1em;
border-radius: 0.5em;
font-size: 120%;
}
.v1 section.userinput
{
overflow: auto;
}
.v2 section.userinput
{
position: absolute;
clip: rect(0em,auto,auto,0em);
}<body class="v1">
<section class="userinput">
Some real content here.
</section>
<section class="userinput">
T̠̬̘̯̙̲̪̪͇̜̭̣̘̟̲͇̳̬͕̖̜̯̘͉͈͉͎̱͓̣̰̳̳͉̙̯̙̰͚͇͎͕̘̯̳̞̲̼̱̖̩͙͕̤͂̋͌ͤ̒ͬ̀͒͂͒ͩ̌͗̋̓ͭ́̀̿͒ͣͮ̓̋ͭ͊͒͐ͩ̆̓͂ͫ̐͂̇͛͑̓̚ͅẽ̗̙͚̮̭̮̬̠͈̻̦̭̭̳̹̯̹̦̔̌ͯ͂̎̈̊̍ͣ̿̈̈̿̄ͦͭ̍͑̽̎̅͛͗͐ͬ̂̊̽̌̎̋ͭ͆̈́̓ͦͦ̑͛ͯs̭̠͖̝͙̩̫̫̥̦͚̝̼̣̥̗ͣͦ͑́͐ͭ͊ͧ̽͐̈̔͛ͨ́̎̔ͤ͐͒̓̀̅̈́̊̋͋̀̿̎͒̉̽͂ͮͬt̾͒̂̽̐ͪ̆̾ͮ͌̽͛̌͒̔ͧ͗̿ͩ̄̿̿̌ͪͩ̊̏͑͌̀̋ͩ͆ͣ̑̏́̽̐͐̔ͪ̓̓ͭ͆ ̯̘͙̠̦̩̝͎̭̖̪̗̞̖̟̲͖̥͙͕̟̝̹͎̽o̼̮̭̞ͯͬ̀͐͗̿ͣ͛ͮͭ̎ͨ͒̌̾̐̉̍͗̎̈́̆ͪͦ̌ͧͦ̓ͨ̐ͯ͒͑͛ͯ̽ͅf̝̪̼̠͎͇̹̝̙̰̟̼͎̱͂ͩ̈́̌ͬ̒ͧ̽̅̉ͧ́͒̒͊ͦͭͭͭ͗́̽ͦ ͚̝̝̠̪͍̰̺̳̫̭͎͔̭̟͍͎͇͎͈͔̠̬͇̦͈̟̰̱̹̲̰̭̲̭̺̜͚̰̹̮̣̤̲̪̙̞͇̦͙͆ͪͨ̐ͨ̽̒͛ͩ̐ͤ͌̂́͒̌ͭͩͦ̎́̈ͬ̓̑̔͐̎͒̔̄ͥ̏ͥͯͧ͐ͪͧͥ̂ͬ̒̀̉̓ͭ̚ͅͅͅͅZ̘̥̲͍̠͎̱̺̘͈͍̟̤̠̮͖͉͕̙̩̲̣̠͎̥̣̜͚̜͕̻͔̰̞̫̭̹͕͙̝̠̮̣̰ͤͦ̍̓ͪͥ̒ͩ̋͆̍͋̽̅͗̈ͨ̂ͨ͋̔̔̓ͪͣ̅̇̏͒ͬ͐ͩ̇ͨ̋ͣ̌̔ͨ́ͪ̔̾̄ͤ̅͑̚ͅA̞̜̺̣͓̼̭̭͈̳̞͚̭̭͕̺͉̜̗̼̣̩̪͂ͯ̈́̍̍͛ͮ̂ͯ̽̎ͬͯ͆̋͌̍͐̌͗ͤ̒ͤ͊̐̈́ͧ̓̇ͬͦ̾ͭ̐̆̚ͅͅͅL̪͉̬̦̝̠̲͖̘̮̙̳͓͇͇̪̱͉̱͓̺͙͓̲̇́̍̽̇̎͊̍̐ͩ̔̋́ͬ̍ͮͫͮ͗̍͋ͭͯ̑̉̈́̄̾̂̀͆̅͑̽̃̚G̣̺̼͔̺̖̣̥̝̰͙̖͖̮̻̩͓̞͈̜̗̤̺̥̻̞͇̩͕̲̙̝̲̤̤̜̐͗͐ͦ̉͐͗ͩ̿ͩ̑ͫ̍͛̄ͦ̔̚O͇͎̬̰̦̜̻͔͇̖͇̞̪͉͉͔͕̥͇̬̮̰̠̟̤̰̹͖̗̺̙͍ͮͨ̿ͪͯ̈́ͫ̔̽̃̀ ̺͕̠̰̝͎̰̟̠̲̗͈̬̥͈͎̺̮̗͍̺͚̟̠̙̠̜̘̹͉̖̤͉̫̰̱̭̠̲̲̗͒ͥͯ̎͐ͨ̓̓ͮ͒ͧ̒̾́̍̍ͦͥ̈́͒͊̃̓̈̈́̀ͮ̂ͪ̓̄̏ͫ̄̓̓̿̓̔̋̎ͧͪͩͪ͋ͫt̘̥̳̺̳̟̯̜̱̯̬̣̣͔̬̟͈͖̗̹͉̫̯́̋͒͂̈́̎͐̇́ͫ̒͛ͥͦ̐̿͂͒͗̃ͮ͒ͪ̌͆̏ͯ̏ͯ̊ͣ̾̃͋ͩ̃̿͐e̹̠̻̟̪̪͎̭̭͎͎̮̹̬̮̪̓̑ͨ̐͐̈́̓ͤͦ͂̿̅͋ͭ̑̓ͬ͐͐ͤ͐ͪ̒ͥ̀̈́ͪ̇̆ͤ̏̏̄̾̌͒ͬ̊ͬ͛̄̄̌̍͋ͥͅͅx̪͇̞̫̰̠͓̣̻̯̞̭̙̝̣͉̱̘̤͇̦̘̙̥͚̫̩̲̘̻͈͉̱͙͇͙ͫ̐̌͛̓͛ͨ͒̂t̩̖̮̙̻ͬ͗͛̍̅̌ͧ͒ͫ̓ͮ̈͒̾ͮͣͮͨͪ͆ͥ̐̍ͮ̽̅̈́̿ͫ͐̍̉ͦͮ͆͗̔̎̿̇ͧ̋ͨͮ̐̓͑̽̑ͤ̊̚̚ͅ ̝͔̺̩͔͈̰͈̣̫̤͉͚͇̟̹̘͔͇̥̘̘̝͛͛̒ͭͣͮͥͦ̿̏ͥͦ̀͂̾͆ͯͧͮͤ͌̌́͗ͨ̎̒ͬ̈́ͧ̊ͨ̓͂̾̉͐ͦ̃̃̚ͅẖ̰̠̮͓̣̯̭̥̹̜̟͍͍͇̀ͧ̽͑̄͊̋̐͋ͨ̔ͭͬ́̀̐͌͗ͥ̓̇͗̂̊ͅe͇͙͕̺̖̰̟̠̩̘̪̳̻̳͉͔̺̳̲̦̘̞̬̬̝͓̬̣̟͕̘͓̬̍͗̋ͮ͑ͣ͗̓̓̎̈̃̾̊̃ͧ̊ͪ̃̀͋̋̄͑̈́̂́͒̔̎̎ͥ͛͌̃͒̈́ͤ͛ͬͫͪ̚r͉̮̼̙̩͖͍̗̣̘͚̭̩͙͙̻͓̦̱̣͉̮̲͇̥͉͚̲͕͖̩̦̫̪̬͔̟͔̦̻̼̼̫̫̯̣̮͈̺͓͖̬̂̾͛̉̆̍ͥ̈́̓̆ͫ͑̄̔̅̈̏̅̓ͨ͐̊ͮ̋̈́ͣͮ̋̓̾ͤ͊ͬ̀̑ͣ͊̇͌ͯ̚ͅḙ̲͍͙͕̯̘͓͔͔͈̹͈̗͎͕̬̖̟̖͚̳͎̖ͩ͊̃ͫ̔̓͒͗ͩ͋̂ͩͩͧ̍͛̿͒ͩͅ.̯̗͗̑̍̑͗ͫͦͦͪͪͧ́̾̓̌̉͑̊̌̿̓ͫ̆̑̽̽ͪͦͨ͌ͦͨ̓
</section>
<section class="userinput">
Some another real content here.
</section>
</body>关于html - 如何在不完全删除 Zalgo 文本的情况下避免到处流血？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32329055/
25
4
0
我们已经有一个使用 AnyEvent 的库。它在内部使用 AnyEvent，并最终返回一个值(同步 - 不使用回调)。有什么方法可以将这个库与 Mojolicious 一起使用吗？ 它的作用如下: #
我想从 XSD 文件生成带有 JAXB 的 Java 类。 问题是，我总是得到一些像这样的类(删除了命名空间): public static class Action { @X
我有一个关于 html 输入标签或 primefaces p:input 的问题。为什么光标总是自动跳转到输入字段。我的页面高度很高，因此您需要向下滚动。输入字段位于页面末尾，光标自动跳转(加载)到页
我今天在考虑面向对象设计，我想知道是否应该避免 if 语句。我的想法是，在任何需要 if 语句的情况下，您都可以简单地创建两个实现相同方法的对象。这两个方法实现只是原始 if 语句的两个可能的分支。
String graphNameUsed = graphName.getName(); if (graphType.equals("All") || graphType.equals(
我有一张友谊 table CREATE TABLE IF NOT EXISTS `friendList` ( `id` int(10) NOT NULL, `id_friend` int(10
上下文 Debian 64。Core 2 二人组。 摆弄循环。我使用了同一循环的不同变体，但我希望尽可能避免条件分支。 但是，即使我认为它也很难被击败。 我考虑过 SSE 或位移位，但它仍然需要跳转(
我最近在 Java 中创建了一个方法来获取字符串的排列，但是当字符串太长时它会抛出这个错误:java.lang.OutOfMemoryError: Java heap space我确信该方法是有效的，
我正在使用 (C++) 库，其中需要使用流初始化对象。库提供的示例代码使用此代码: // Declare the input stream HfstInputStream *in = NULL; tr
我有一个 SQL 查询，我在 WHERE 子句中使用子查询。然后我需要再次使用相同的子查询将其与不同的列进行比较。 我假设没有办法在子查询之外访问“emp_education_list li”？ 我猜
我了解到在 GUI 线程上不允许进行网络操作。对我来说还可以。但是为什么在 Dialog 按钮点击回调上使用这段代码仍然会产生 NetworkOnMainThreadException ？ new T
有没有办法避免在函数重定向中使用 if 和硬编码字符串，想法是接收一个字符串并调用适当的函数，可能使用模板/元编程.. #include #include void account() {
我正在尝试避免客户端出现 TIME_WAIT。我连接然后设置 O_NONBLOCK 和 SO_REUSEADDR。我调用 read 直到它返回 0。当 read 返回 0 时，errno 也为 0。我
我正在开发 C++ Qt 应用程序。为了在应用程序或其连接的设备出现故障时帮助用户，程序导出所有内部设置并将它们存储在一个普通文件(目前为 csv)中。然后将此文件发送到公司(例如通过邮件)。 为避免
我有一组具有公共(public)父类(super class)的 POJO。这些存储在 superclass 类型的二维数组中。现在，我想从数组中获取一个对象并使用子类 的方法。这意味着我必须将它们转
在我的代码中，当 List 为 null 时，我通常使用这种方法来避免 for 语句中的 NullPointerException: if (myList != null && myList.size
我正在尝试避免客户端出现 TIME_WAIT。我连接然后设置 O_NONBLOCK 和 SO_REUSEADDR。我调用 read 直到它返回 0。当 read 返回 0 时，errno 也为 0。我
在不支持异常的语言和/或库中，许多/几乎所有函数都会返回一个值，指示其操作成功或失败 - 最著名的例子可能是 UN*X 系统调用，例如 open( ) 或 chdir()，或一些 libc 函数。 无
我尝试按值提取行。 col1 df$col1[col1 == "A"] [1] "A" NA 当然我只想要“A”。如何避免 R 选择 NA 值？顺便说一句，我认为这种行为非常危险，因为很多人都会陷入
我想将两个向量合并到一个数据集中，并将其与函数 mutate 集成为 5 个新列到现有数据集中。这是我的示例代码: vector1% rowwise()%>% mutate(vector2|>
我是一名优秀的程序员,十分优秀！