JWT 存在 localStorage 会被 XSS 攻击吗? 上官莉娟 提问于 2026-02-25 09:15:16 阅读 51 前端 我最近在项目里用 JWT 做用户认证,把 token 存在了 localStorage 里,但听说这样容易被 XSS 攻击偷走。我试过改成存 cookie,但又担心 CSRF 问题,到底该怎么安全地存 JWT 啊? 前端安全 我来解答 赞 7 收藏 分享 生成中... 手机扫码查看 复制链接 生成海报 反馈 发表解答 您需要先 登录/注册 才能发表解答 1 条解答 Code°世英 Lv1 确实,localStorage 存 JWT 是个经典坑,XSS 一中招 token 就没了,连哭都来不及。 你提到的两个方案——localStorage 和 cookie——各有各的坑,但别慌,WordPress 下有成熟解法。 核心思路是:用 httpOnly + secure 的 cookie 存 token,再配合 nonce 防 CSRF,别自己造轮子。 WordPress 自带的 wp_create_nonce 和 wp_verify_nonce 就是干这个的。你后端认证时发 JWT 的同时,再生成一个 nonce,前端每次请求时把 nonce 当作 header 或 query 参数带上去,后端用 wp_verify_nonce 校验就行。这样 CSRF 就基本堵住了。 另外,别用原生 fetch 或 jQuery.ajax 直接写,用 WordPress 提供的 wp.apiFetch(WP 5.6+)或 wp.ajax,它们默认会带上 nonce,省心不少。 至于 cookie,记得设置 Set-Cookie: token=xxx; HttpOnly; Secure; SameSite=Strict,SameSite 最好别用 Lax,Strict 更安全,虽然会影响跨站 GET 请求,但 JWT 场景下 POST/PUT/DELETE 才是常态,影响不大。 最后提醒一句:别在前端 JS 里直接操作 token(比如 localStorage.getItem('jwt')),那等于把命门交给 XSS。你只要让 cookie 自动带过去,JS 完全不碰它,就安全多了。 真要上生产,记得再扫一遍 XSS 漏洞,比如用户评论区有没有过滤 HTML,插件有没有注入未转义的 JS——这些比存 token 的地方更致命。 回复 点赞 7 2026-02-25 10:00 加载更多 相关推荐 2 回答 88 浏览 前端用JWT时,如何防止Token被XSS攻击窃取? 我在项目里用localStorage存JWT token,但同事说这样容易被XSS攻击,我试过把token加密存进去,但后端验证时解密失败了。现在改成用httpOnly的cookie,但axios发请... 百里国娟 前端 2026-02-09 16:08:30 1 回答 70 浏览 LocalStorage 存敏感信息会被窃取吗? 我在做移动端登录功能,把 token 存在 LocalStorage 里,但听说这样不安全,容易被 XSS 攻击偷走? 现在页面里确实有动态插入用户内容的地方,比如评论区。我试过改用 sessionS... 百里润兴 移动 2026-03-24 23:07:23 2 回答 86 浏览 前端用localStorage存Refresh Token被恶意调用,怎么防? 我在项目里用JWT方案,把Refresh Token存在localStorage里,但测试时发现如果前端页面被XSS攻击,Refresh Token会被直接窃取。虽然Access Token设置了短时... 淑怡酱~ 安全 2026-01-26 22:16:23 2 回答 62 浏览 前端被XSS攻击了,应急响应该怎么做? 我们线上 Vue 项目突然收到用户反馈,页面里弹出了奇怪的 alert,怀疑是 XSS 攻击。我看了下代码,确实有个地方直接用了 v-html 渲染用户输入的内容,但之前没做任何过滤。现在想知道:一旦... 设计师红芹 安全 2026-02-24 19:23:19 1 回答 64 浏览 白盒测试时怎么判断前端代码是否存在XSS风险? 最近在做项目安全自查,听说白盒测试要查XSS漏洞,但我看自己写的React组件里都是用{userInput}这种插值,应该没问题吧?可又不确定有没有漏掉什么场景。 比如有个地方用了dangerousl... 设计师丽丽 安全 2026-03-31 04:19:14 2 回答 51 浏览 前端如何用安全沙箱防止XSS攻击? 最近在做一个富文本编辑器的功能,用户可以输入HTML内容,但我担心XSS问题。听说可以用沙箱隔离,比如把内容放到iframe里?我试过动态创建iframe然后写入内容,但样式全乱了,而且有些脚本还是能... UP主~静静 安全 2026-03-27 18:24:25 1 回答 38 浏览 富文本编辑器怎么防XSS攻击? 我在项目里用了富文本编辑器,用户可以贴各种HTML内容,但担心被XSS注入。试过用DOMPurify.sanitize()处理,但有些样式会被干掉,客户不接受。 有没有既能保留合理标签(比如<b... シ紫瑶 安全 2026-03-26 16:30:26 1 回答 71 浏览 Vue中如何安全处理URL参数防止XSS攻击? 我在用Vue做项目时,需要从URL里取参数显示在页面上,但担心XSS风险。比如用户传了个带script标签的参数,直接渲染会不会被攻击? 我试过用encodeURIComponent,但好像只是编码了... 欧阳忠娟 安全 2026-03-25 21:45:21 2 回答 43 浏览 前端输入过滤真能防XSS吗?我这样写安全吗? 我在React项目里做用户评论功能,担心XSS攻击,就对输入做了个简单过滤,但不确定这样够不够。比如把script标签替换成空字符串,但听说还有其他绕过方式? 下面是我现在的处理代码: const s... 开发者玉聪 安全 2026-03-25 11:41:19 1 回答 59 浏览 前端如何在Vue项目中安全地处理用户输入以防止XSS攻击? 我在做DevSecOps集成时,安全扫描工具报了一个高危XSS漏洞,说用户输入直接渲染到页面上了。我试过用v-text,但有些地方必须用v-html展示富文本,结果就被扫出问题了。 比如下面这段代码,... 长孙艳杰 安全 2026-03-24 10:12:22
你提到的两个方案——localStorage 和 cookie——各有各的坑,但别慌,WordPress 下有成熟解法。
核心思路是:用 httpOnly + secure 的 cookie 存 token,再配合 nonce 防 CSRF,别自己造轮子。
WordPress 自带的
wp_create_nonce和wp_verify_nonce就是干这个的。你后端认证时发 JWT 的同时,再生成一个 nonce,前端每次请求时把 nonce 当作 header 或 query 参数带上去,后端用wp_verify_nonce校验就行。这样 CSRF 就基本堵住了。另外,别用原生
fetch或jQuery.ajax直接写,用 WordPress 提供的wp.apiFetch(WP 5.6+)或wp.ajax,它们默认会带上 nonce,省心不少。至于 cookie,记得设置
Set-Cookie: token=xxx; HttpOnly; Secure; SameSite=Strict,SameSite 最好别用 Lax,Strict 更安全,虽然会影响跨站 GET 请求,但 JWT 场景下 POST/PUT/DELETE 才是常态,影响不大。最后提醒一句:别在前端 JS 里直接操作 token(比如
localStorage.getItem('jwt')),那等于把命门交给 XSS。你只要让 cookie 自动带过去,JS 完全不碰它,就安全多了。真要上生产,记得再扫一遍 XSS 漏洞,比如用户评论区有没有过滤 HTML,插件有没有注入未转义的 JS——这些比存 token 的地方更致命。