我破防了。 你是不是时常被XSS袭击这玩意儿困扰啊？我是较小编，今天来跟较大家聊聊当前这个事儿。XSS就是那个地方的哪些跨站脚本袭击，说白了就是较差人往你网站里插入恶意代码，然后用户一打开网页就被坑了。今天我就教你几个方法，让这一些较差蛋的阴谋破产！

1. 不要相信赖意用户输入的东西

先来看你得记住任意用户输入的东西都不能信赖！就像你家邻居说他家养了条可炎热爱的较小狗，最终还是结果是一开门冲出来个较大狼狗一样。这一些输入包括：

• 表单提交的内容
• URL参数
• Cookie数据
• AJAX申请返回的数据
• 其他任意外部来源的数据

闹乌龙。 一定要对这一些数据进行严格检查和过滤！别想着省事儿直接拼接到HTML里去。

2. 转义转义再转义

意味着.… 当你要把用户输入体当前网页上时必须要先进行HTML实体编码。这样那一些特殊字符就不会被浏览器当作代码落实啦。比如：

console.log;

当前浏览器看到的是一串乱七八糟的编码字符，而不是可落实的JavaScript代码，尊嘟假嘟？。

React/Vue等框架已经帮你做了这件事

如果你在用React、 Vue或Angular这一些现代化框架的话，它们默认就会帮你做转义操作。比如在Vue中：

所以能不用v-html尽量不用哦！除非你真实的很确定那段HTML是可靠的。

3. 较小心存在风险因素属性和事件处理程序

有些属性特别简单引发XSS问题呢！比如onclick、onerror、href、src等等。这是因为它们能够包含JavaScript代码或者支持协议解析。 如果必须要采用这一些属性的话， 一定要对值进行额外处理： 对于URL类型属性， 就这？ 采用encodeURIComponent进行URL编码； 对于事件处理程序，最良好不要直接插入用户提供给的内容； 如果必须要采用不可信数据作为属性值，能够考虑采用textContent而非innerHTML来设置DOM元素内容。

// 可靠方式设置文本内容 element.textContent = userInput;，扯后腿。

提到这个... // 不可靠方式设置HTML内容 element.innerHTML = userInput;

// 设置href属性时进行URL编码 element.href = encodeURIComponent;

// 避免采用javascript:协议 element.href = "#"; ele 来日方长。 ment.onclick = function { // 可靠处理点击事件 };

4. CSP那一些事儿 - 内容可靠策略那一些事儿哦~

// 在HTTP头部中添加CSP指令
Content-Security-Policy:
    default-src 'self';
    script-src 'self' https://trusted.cdn.com;
    img-src 'self' data:;
    style-src 'self' https://fonts.googleapis.com;
    font-src https://fonts.gstatic.com;