「这是我参与11月更文挑战的第 1 天，活动详情查看：2021最后一次更文挑战」。
前言
随着互联网的高速发展，信息安全问题已经成为企业最为关注的焦点之一，而前端又是引发企业安全问题的高危据点。在移动互联网时代，前端人员除了传统的 XSS、CSRF 等安全问题之外，又时常遭遇网络劫持、非法调用 Hybrid API 等新型安全问题。当然，浏览器自身也在不断在进化和发展，不断引入 CSP、Same-Site Cookies 等新技术来增强安全性，但是仍存在很多潜在的威胁，这需要前端技术人员不断进行“查漏补缺”。
我公司针对各种安全问题进行了一次测试，暴露出了一些问题，在这里发布出来，并提供解决方案，码字不易，喜欢或者有帮助的话，麻烦给我点个赞。
问题点
1. 基于DOM的XSS
应用程序的客户端代码从 javascript： document.location、request.url、document.URL、document.referrer 或其他任何攻击者可以修改的浏览器对象获取数据，如果未验证数据是否存在恶意代码 的情况下，就将其动态更新到页面的DOM节点,应用程序将易于受到基于DOM的XSS攻击 。 例如：下面的JavaScript代码片段可从URL中读取msg信息，并将其显示给用户。
javascript： var url=document.URL; document.write(url.substring(url.indexOf("msg=")+4,url.length);
该段脚本解析URL，读取msg参数的值，并将其写入页面。如果攻击者设计一个恶意的 URL，并以JavaScript代码作为msg参数，那么Web浏览器就会像显示HTTP响应那样执行 该代码，应用程序将受到基于DOM的XSS攻击。
基于DOM的XSS是将用户可控的JavaScript数据输出到HTML页面中而产生的漏洞，为了 避免基于DOM的XSS攻击，避免将用户控制的数据直接输出到DOM或脚本中执行。如果 不能避免，则应进行严格的过滤。
2. 密码管理:
- null 密码、明文传输
null密码会削弱系统的安全性。
例如： javascript： var password = null;
解决建议：
程序中不应采用null密码，程序所需密码应从配置文件中获取加密的密码值。 另外，前端输入密码应加入密码校验
- 明文传输
前端对于用户输入的密码应进行加密处理，不能直接暴露明文。
3. JavaScript劫持：易受攻击的框架
使用JavaScript传送敏感数据的应用程序可能会存在JavaScript劫持的漏洞，该漏洞允许未 经授权的攻击者从一个易受攻击的应用程序中读取机密数据。 JavaScript劫持可以简单的理解为模拟授权的用户，窃取用户在服务器上的信息。Web浏 览器使用同源策略(Same Origin Policy)，以保护用户免受恶意网站的攻击。同源策略规定 ：如果要使用JavaScript来访问某个网页的内容的话，则JavaScript和网页必须都来源于相同 的域。若不采取同源策略，恶意网站便可以使用受害者的客户端凭证来运行 JavaScript，从其他网站加载的敏感信息，并对这些信息进行处理，然后将其返回给攻击 者。 使用JSON传输数据的JavaScript应用更容易受到JavaScript劫持攻击。由于JSON使用 JavaScript语法的子集表示对象、数组、简单值，JSON本身可以被当做JavaScript执行，且 使用eval()函数对JSON数据结构求值早被认为是存在风险的，其可能执行恶意代码。 应该注意的是，某些过时的第三方Javascript框架也可能存在上述的问题，使用它们将导致 Javascript劫持。
解决建议：
不使用过时的有风险的Javascript框架。
4. 不安全的随机数
JavaScript的Math.random()实现PRNG（伪随机数序列发生器），该PRNG是可移植和可 重复的，因此如果两个 Math.random()使用相同的种子，会生成相同的数值序列。 例如：下面的代码使用 javascript： Math.random() 创建的Token很容易被猜到。 javascript： function getToken (){ var token = Math.random(); return token; }
解决建议：
JavaScript在安全性要求较高的环境中生成随机数，常规的建议是使用 Mozilla API 中的 window.crypto.getRandomValues()函数，但这种方法受限于浏览器的兼容性，只在较新的 版本（Chrome>=11.0, Firefox>=21, Edge, IE>=11, Safari>=3.1）可以使用。如果考虑到旧版 本浏览器，则应在javascript之外处理PRNG功能。
例如：缺陷描述中的例子可以改写为。
javascript： function getToken (){ var array = new Uint32Array(1); window.crypto.getRandomValues(array); var token = array[0]; return token; }
5. 代码质量：遗留的调试代码
应用程序中的测试代码会建立一些意想不到的入口，这些入口可能会被攻击者作为 “后门”进行利。有的测试代码本身并不会带来危害，但它表明了程序未进行严格的清 理，攻击者很可能会查找到另外一些可利用的测试代码。
例如： javascript: console.log(message);
应用程序在发布之前应删除测试代码。在此我使用插件，webpack 打包时自动将所有的 log 删除
结语
都看到这里啦，点个小手三连一下。
作者：chenuvi
