防止客户端的 XSS（纯 Javascript）
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/28111289/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Prevent XSS on client-side (Pure Javascript)
提问by andrealmeida
i got a simple project but is giving me headaches because Client-Side programming is not my thing. Basically i got a login page and the client wants that i prevent XSS attacks not allowing users not submit malicious code on username/password fields. I would do it on server side easily, but they do not want give to us access.
我有一个简单的项目，但让我头疼，因为客户端编程不是我的事。基本上我有一个登录页面，客户端希望我防止 XSS 攻击，不允许用户在用户名/密码字段上提交恶意代码。我会在服务器端轻松完成，但他们不想让我们访问。
Any chance to someone give me hints how can i do this? Even tough i know the basics of javascript/HTML, my experience ir nearly null.
有人给我提示我该怎么做的任何机会？即使我知道 javascript/HTML 的基础知识，我的经验也几乎为零。
I know that are several questions about this topic, but sincerely, i got lost with all information
我知道有几个关于这个主题的问题，但真诚地，我迷失了所有信息
Best Regards
最好的祝福
回答by Quentin
You prevent XSS on the client in the same way that you prevent it on the server. (Note this only protects against input that is directly processed on the client, and not against code that gets submitted to the server and then passed back to a client).
您在客户端上阻止 XSS 的方式与在服务器上阻止它的方式相同。（请注意，这只能防止在客户端直接处理的输入，而不是针对提交到服务器然后传回客户端的代码）。
- Make sure you know what data format any given variable holds
- Treat any user input including data from forms, data from URLs, etc) as plain text
- Encode it appropriately for where ever you put it, using native methods for handling the data where possible
- 确保您知道任何给定变量保存的数据格式
- 将任何用户输入（包括来自表单的数据、来自 URL 的数据等）视为纯文本
- 根据您放置的位置对其进行适当编码，尽可能使用本机方法处理数据
For example, if you wanted to display the fragment id in a div you would:
例如，如果您想在 div 中显示片段 ID，您可以：
div.appendChild(document.createTextNode(location.hash));
Do notjust allow raw input to be parsed as HTML:
不要只允许将原始输入解析为 HTML：
// DANGER
div.innerHTML = location.hash;
This, of course, only protects the page from data submitted to the client side code.
当然，这只会保护页面免受提交给客户端代码的数据的影响。
There is no way to use client side code to prevent malicious data from being submitted to the server side code.The client has total control over the client side code, so it can be bypassed very easily.
没有办法使用客户端代码来防止恶意数据提交到服务器端代码。客户端可以完全控制客户端代码，因此可以很容易地绕过它。
If you read input from outside the server and then output it to a webpage then you must have server side protection from XSS.
如果您从服务器外部读取输入，然后将其输出到网页，那么您必须对 XSS 进行服务器端保护。
回答by meskobalazs
Actually you simply cannotmake any reliable XSS prevention on the client side. The attacker simply disables JavaScript, and all your complicated code is non-existent. Any client-side validation is only for the convenience of the users, nothing more.
实际上，您根本无法在客户端进行任何可靠的 XSS 预防。攻击者只需禁用 JavaScript，您的所有复杂代码都不存在。任何客户端验证只是为了方便用户，仅此而已。
Update: The above I wrote, is true about second order(a.k.a. stored) XSS. First orderXSS attacks (when the attacker creates a forged URL) can be mitigated using JavaScript.
更新：上面我写的，关于二阶（又名存储）XSS是正确的。可以使用 JavaScript 缓解一阶XSS 攻击（当攻击者创建伪造的 URL 时）。
