我目前正在使用ReactJS构建一个单页应用程序。
我读到不使用localStorage的原因之一是因为XSS漏洞。
既然React会转义所有用户输入,那么现在使用localStorage是否安全呢?
我目前正在使用ReactJS构建一个单页应用程序。
我读到不使用localStorage的原因之一是因为XSS漏洞。
既然React会转义所有用户输入,那么现在使用localStorage是否安全呢?
当前回答
只要加密,将令牌存储在localStorage中是安全的。下面是一个压缩的代码片段,展示了许多方法中的一种。
import SimpleCrypto from 'simple-crypto-js';
const saveToken = (token = '') => {
const encryptInit = new SimpleCrypto('PRIVATE_KEY_STORED_IN_ENV_FILE');
const encryptedToken = encryptInit.encrypt(token);
localStorage.setItem('token', encryptedToken);
}
然后,在使用令牌之前,使用PRIVATE_KEY_STORED_IN_ENV_FILE对其进行解密
其他回答
看待这个问题的一种方法是考虑风险或伤害的水平。
你是否正在创造一款没有用户的应用,即POC/MVP?你是一家需要快速进入市场并测试应用程序的初创公司吗?如果是,我可能只会实施最简单的解决方案,并继续专注于寻找适合市场的产品。使用localStorage,因为它通常更容易实现。
你是在开发一款拥有大量日活跃用户的应用的v2版本,还是一款人们/企业非常依赖的应用?被黑客攻击是否意味着几乎没有恢复空间?如果是这样,我会仔细研究一下您的依赖关系,并考虑将令牌信息存储在仅http的cookie中。
使用localStorage和cookie/session存储都有各自的优缺点。
正如第一个答案所述:如果您的应用程序有XSS漏洞,那么两者都不能保护您的用户。由于大多数现代应用程序都有十几个或更多不同的依赖项,因此越来越难以保证应用程序的某个依赖项不受XSS攻击。
如果您的应用程序确实存在XSS漏洞,并且黑客已经能够利用它,那么黑客将能够代表您的用户执行操作。黑客可以通过从localStorage检索令牌来执行GET/POST请求,或者如果令牌存储在http-only cookie中,则可以执行POST请求。
在本地存储中存储令牌的唯一缺点是黑客将能够读取您的令牌。
我知道这是一个老问题,但根据@mikejones1477所说,现代前端库和框架转义文本,为您提供对XSS的保护。cookie不是使用凭证的安全方法的原因是,当localStorage阻止CSRF时,cookie不能阻止CSRF(还要记住,cookie也可以通过JavaScript访问,所以XSS不是这里的大问题),这就是为什么的答案。
在本地存储中存储身份验证令牌并手动将其添加到每个请求中以防止CSRF的原因是关键字:手动。由于浏览器不会自动发送认证令牌,如果我访问邪恶。例如,它设法发送一个POST http://example.com/delete-my-account,它将无法发送我的authn令牌,因此该请求被忽略。
当然httpOnly是圣杯,但你不能从reactjs或任何js框架访问,你仍然有CSRF漏洞。我的建议是localstorage,或者如果你想使用cookie,确保像Django一样实现一些解决CSRF问题的解决方案。
关于CDN,确保你没有使用一些奇怪的CDN,例如谷歌或bootstrap提供的CDN,由社区维护,不包含恶意代码,如果你不确定,你可以自由审查。
TLDR;
两者都可以工作,但是使用httpOnly cookie要比使用localStorage安全得多,因为XSS引入的任何恶意javascript代码都可以读取localStorage。
Philippe De Ryck博士写了一篇有用的文章,深入分析了漏洞(尤其是XSS)的真正影响。
这篇文章让人大开眼界!
简而言之,开发人员最关心的应该是保护web应用程序不受XSS的影响,而不应该太担心使用哪种类型的存储区域。
菲利普医生建议采取以下3个步骤:
Don't worry too much about the storage area. Saving an access token in localStorage area will save the developer a massive amount of time for development of next phases of the application. Review your app for XSS vulnerabilities. Perform a through code review and learn how to avoid XSS within the scope of your templating framework. Build a defense-in-depth mechanism against XSS. Learn how you could further lock down your application. E.g. utilising Content Security Policy (CSP) and HTML5 sandboxing.
记住,一旦你被XSS攻击了,游戏就结束了!
基本上可以将JWT存储在localStorage中。
我认为这是一个好方法。 如果我们谈论的是XSS, XSS使用CDN,这也是一个潜在的风险,获得您客户的登录/通行证。将数据存储在本地至少可以防止CSRF攻击。
你需要了解这两点,然后选择你想要的。这两种攻击都不是你所需要注意的,只要记住:你的整个应用程序的安全性仅与你的应用程序的最不安全的点一样。
再次重申,存储是OK的,易受XSS, CSRF,…不是