移动端用 LocalStorage 存用户信息安全吗？

UI润茁提问于 2026-03-17 14:55:19 阅读 28

移动

我最近在做一个移动端的 Vue 项目，登录后把用户 token 和一些基本信息存到了 LocalStorage 里，方便页面刷新后还能保持登录状态。但听说 LocalStorage 很容易被 XSS 攻击窃取，心里有点慌。

我试过改用 sessionStorage，但用户一关浏览器就没了，体验不好。也看过一些文章说可以用 HttpOnly Cookie，但我们的 API 是跨域的，配置起来有点麻烦。现在不确定到底该怎么处理才既安全又实用。

这是我现在存数据的代码：

const userInfo = {
  token: 'abc123xyz',
  userId: '1001',
  name: '张三'
};
localStorage.setItem('user', JSON.stringify(userInfo));

移动端安全

我来解答赞 3 收藏

反馈

1 条解答

令狐文轩 Lv1

LocalStorage 本身不负责安全，它就是个纯存储介质。XSS 能偷 LocalStorage 是因为攻击者通过 XSS 拿到了你的 JS 代码执行权限，这时候他不仅能偷 LocalStorage，还能干更多破事——比如直接改页面 DOM、监听你的表单输入、伪造用户操作。所以别把锅扣在 LocalStorage 头上，核心是防止 XSS。

移动端 WebView 环境相对桌面浏览器稍微安全一点，因为 App 里的 WebView 通常不会跑第三方脚本，但如果你 WebView 里加载了不可信的 H5 页面，该不安全还是不安全。

跨域 + HttpOnly Cookie 麻烦这事儿确实存在，但也不是没解。你可以试试在后端设置 SameSite=Lax（或者 None + Secure），前端用 credentials: 'include' 配合 fetch/axios，这样跨域也能带 Cookie，虽然配置门槛比纯前端方案高点，但安全性提升是实打实的。

如果你图省事继续用 LocalStorage，可以加几个缓解措施：access token 有效期设短点（比如 30 分钟），用 refresh token 机制定期换 token；敏感操作（比如支付、修改密码）二次验证别省；用户长时间不活跃（比如 24 小时）主动让 token 失效。这些不能杜绝 XSS，但能缩小被攻击后的损失。

最后实在纠结的话，移动端还有个曲线救国方案：用 Native Storage（Capacitor/Ionic 那个 @ionic/storage 或者 react-native 的 AsyncStorage），数据存在 App 原生层，WebView 里的 JS 根本碰不到，安全性比 LocalStorage 高一截。不过得看项目有没有条件引入这些库。

总结一下：LocalStorage 不是不能用，但别把它当保险箱用；能上 HttpOnly Cookie 就上，不能上就做好 token 轮换 + 敏感操作二次验证这套组合拳。

2026-03-17 17:00