一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第1天，点击查看活动详情。
1.防止XSS攻击
Cross-Site Scripting（跨站脚本攻击）简称 XSS，是一种代码注入攻击。XSS 攻击通常指的是利用网页的漏洞，攻击者通过巧妙的方法注入 XSS 代码到网页，因为浏览器无法分辨哪些脚本是可信的，导致 XSS 脚本被执行。XSS 脚本通常能够窃取用户数据并发送到攻击者的网站，或者冒充用户，调用目标网站接口并执行攻击者指定的操作。
使用dangerouslySetInnerHTML
dangerouslySetInnerHTML 是 React 为浏览器 DOM 提供 innerHTML 的替换方案。通常来讲，使用代码直接设置 HTML 存在风险，因为很容易使用户暴露在 XSS 攻击下，因为当使用 dangerouslySetInnerHTML 时，React 将不会对输入进行任何处理并直接渲染到 HTML 中。
所以平时开发时最好避免使用 dangerouslySetInnerHTML，如果不得不使用的话，前端或服务端必须对输入进行相关验证，例如对特殊输入进行过滤、转义等处理。前端这边处理的话，推荐使用白名单过滤，通过白名单控制允许的 HTML 标签及各标签的属性。
通过用户提供的对象来创建 React 组件
用户提供的数据进行 JSON 转换后直接当做 div 的属性，当用户构造了类似dangerouslySetInnerHTML 的特殊字符串时，页面就会被注入恶意代码，所以要注意平时在开发中不要直接使用用户的输入作为属性。
使用用户输入的值来渲染 a 标签的 href 属性，或类似 img 标签的 src 属性等
const userWebsite = "javascript:alert('xss');";
<a href={userWebsite}></a>
2.数据安全
请求数据加密
待补充
a标签跳转
a标签打开新页面时需要添加 rel="noopener noreferrer"
否则，在新打开的页面（www.baidu.com）中可以通过 window.opener 获取到源页面的部分控制权，即使新打开的页面是跨域的也照样可以（例如 location 就不存在跨域问题）。
在 Chrome 49+，Opera 36+，打开添加了 rel=noopener 的链接， window.opener 会为null。在老的浏览器中，可以使用 rel=noreferrer 禁用HTTP头部的Referer属性。
另外，可以使用 window.open 打开页面，手动将 opener 设置为 null。
const otherWindow = window.open('http://www.baidu.com');
otherWindow.opener = null;
otherWindow.location = url;
