前端安全：如何防止前端安全：如何防止CSRF攻击？攻击？
背景
随着互联网的高速发展，信息安全问题已经成为企业最为关注的焦点之一，而前端又是引发企业安全问题的高危据点。在移动
互联网时代，前端人员除了传统的 XSS、CSRF 等安全问题之外，又时常遭遇网络劫持、非法调用 Hybrid API 等新型安全问
题。当然，浏览器自身也在不断在进化和发展，不断引入 CSP、Same-Site Cookies 等新技术来增强安全性，但是仍存在很
多潜在的威胁，这需要前端技术人员不断进行“查漏补缺”。
前端安全
近几年，美团业务高速发展，前端随之面临很多安全挑战，因此积累了大量的实践经验。我们梳理了常见的前端安全问题以及
对应的解决方案，将会做成一个系列，希望可以帮助前端同学在日常开发中不断预防和修复安全漏洞。
今天我们讲解一下 CSRF，其实相比XSS，CSRF的名气似乎并不是那么大，很多人都认为“CSRF不具备那么大的破坏性”。
真的是这样吗？接下来，我们还是有请小明同学再次“闪亮”登场。
CSRF攻击
CSRF漏洞的发生
相比XSS，CSRF的名气似乎并不是那么大，很多人都认为CSRF“不那么有破坏性”。真的是这样吗？
接下来有请小明出场~~
小明的悲惨遭遇
这一天，小明同学百无聊赖地刷着Gmail邮件。大部分都是没营养的通知、验证码、聊天记录之类。但有一封邮件引起了小明
的注意：
甩卖比特币，一个只要998！！
聪明的小明当然知道这种肯定是骗子，但还是抱着好奇的态度点了进去（请勿模仿）。果然，这只是一个什么都没有的空白页
面，小明失望的关闭了页面。一切似乎什么都没有发生…
在这平静的外表之下，黑客的攻击已然得手。小明的Gmail中，被偷偷设置了一个过滤规则，这个规则使得所有的邮件都会被
自动转发到haker@hackermail.com。小明还在继续刷着邮件，殊不知他的邮件正在一封封地，如脱缰的野马一般地，持续不
断地向着黑客的邮箱转发而去。
不久之后的一天，小明发现自己的域名已经被转让了。懵懂的小明以为是域名到期自己忘了续费，直到有一天，对方开出了
$650 的赎回价码，小明才开始觉得不太对劲。
小明仔细查了下域名的转让，对方是拥有自己的验证码的，而域名的验证码只存在于自己的邮箱里面。小明回想起那天奇怪的
链接，打开后重新查看了“空白页”的源码：
这个页面只要打开，就会向Gmail发送一个post请求。请求中，执行了“Create Filter”命令，将所有的邮件，转发
到“hacker@hakermail.com”。
小明由于刚刚就登陆了Gmail，所以这个请求发送时，携带着小明的登录凭证（Cookie），Gmail的后台接收到请求，验证了
确实有小明的登录凭证，于是成功给小明配置了过滤器。
黑客可以查看小明的所有邮件，包括邮件里的域名验证码等隐私信息。拿到验证码之后，黑客就可以要求域名服务商把域名重
置给自己。
小明很快打开Gmail，找到了那条过滤器，将其删除。然而，已经泄露的邮件，已经被转让的域名，再也无法挽回了…
以上就是小明的悲惨遭遇。而“点开一个黑客的链接，所有邮件都被窃取”这种事情并不是杜撰的，此事件原型是2007年Gmail
的CSRF漏洞：
当然，目前此漏洞已被Gmail修复，请使用Gmail的同学不要慌张。
什么是CSRF
CSRF（Cross-site request forgery）跨站请求伪造：攻击者诱导受害者进入第三方网站，在第三方网站中，向被攻击网站发
送跨站请求。利用受害者在被攻击网站已经获取的注册凭证，绕过后台的用户验证，达到冒充用户对被攻击的网站执行某项操
作的目的。
一个典型的CSRF攻击有着如下的流程：
剩余8页未读，继续阅读
资源评论
小小二-yan2023-07-24作者不仅深入浅出地介绍了CSRF攻击的原理，还推荐了一些常用的防护措施，对于初学者非常友好。
一曲歌长安2023-07-24这篇文章给出了一些实用的代码示例，用来演示如何正确地实施CSRF攻击防护措施，对于有一定编程基础的开发者来说非常实用。
lowsapkj2023-07-24这篇文章对于前端安全的重要性进行了深入的解释，提醒了开发者要时刻警惕潜在的攻击威胁。
WaiyuetFung2023-07-24这篇文件通俗易懂，介绍了如何防止CSRF攻击的方法，对前端安全确实起了很大的帮助。
丽龙2023-07-24作者在阐述CSRF攻击时，很好地把握了重点，给出了实用的解决方案，对前端开发者来说十分实用。
