web安全（xss/csrf）简单攻击原理和防御方案（实战篇）

介绍：最近在学习node，就顺便写了web安全攻击的示例以及解决方案。参考了一些资料，自己理了一下思路，代码不是很完善，node也是在摸索阶段，请见谅。希望对那些对于安全不是很了解，后台知识不清楚的同学有所帮助。

项目代码如下：

app： 正常的网站
hack：模拟黑客攻击的网站
使用技术： node+express+react+mysql

项目介绍

1.代码目录

2. 建立数据库

node app/mysql.js 先执行这个文件创建表和数据

如图所示

一、XSS（Cross-Site Scripting） 跨站脚本攻击

原理：恶意攻击者往 Web 页面里插入恶意可执行网页脚本代码，当用户浏览该页之时，嵌入其中 Web 里面的脚本代码会被执行，从而可以达到攻击者盗取用户信息或其他侵犯用户安全隐私的目的。

1.这时候运行项目npm run start 打开home页面

这个时候home页面是用react模板写的，React DOM 会在渲染的时候把内容（字符串）进行转义，所以字符串形式的标签是不会作为 HTML 标签进行处理的，所以输入script是不能执行的

所以加了一个利用ejs模板加载的页面xss.html(无论是从url上输入script标签例如http://localhost:4000/xss?text=还是直接获取数据库存储的代码都会被执行)

2.开始利用document.cookie攻击,按照刚才的方式把改成进行攻击

打开http://localhost:4000/xss会看到请求了http://localhost:5000/xss.html的接口

在控制台可以看到5000端口的黑客网站已经打印出来了cookie，利用cookie我们完全可以在控制台设置cookie直接登录网站

二、CSRF 跨站点伪造

原理： 诱导用户打开黑客的网站，在黑客的网站中，利用用户登录状态发起跨站点请求。

1.在登录状态下，打开localhost：5000/csrf.html页面，在控制台上我们看到了setDataList的请求，这个就是提交内容的接口，在4000的home页面可以看到内容改变了

正常网站内容被更改

解决方案（生成token， 接口带上nonce和timesTamp）

三、点击劫持

原理：用户在登陆 A 网站的系统后，被攻击者诱惑打开第三方网站，而第三方网站通过 iframe 引入了 A 网站的页面内容，用户在第三方网站中点击某个按钮（被装饰的按钮），实际上是点击了 A 网站的按钮。

1. 打开http://localhost:5000/clickHijack.html点击按钮，实际上是点击了http://localhost:4000/home的关注按钮，因为iframe嵌入了4000的页面

解决方案，对iframe嵌入做限制

一般现代浏览器支持Content-Security-Policy，可以替代老浏览器的X-Frame-Options

CSDN大礼包：《黑客&网络安全入门&进阶学习资源包》免费分享🎁

😝朋友们如果有需要全套《黑客&网络安全入门&进阶学习资源包》，可以扫描下方二维码免费领取
​
​

1️⃣零基础入门

① 学习路线

对于从来没有接触过网络安全的同学，我们帮你准备了详细的学习成长路线图。可以说是最科学最系统的学习路线，大家跟着这个大的方向学习准没问题。

② 路线对应学习视频

同时每个成长路线对应的板块都有配套的视频提供：

因篇幅有限，仅展示部分资料

2️⃣视频配套资料&国内外网安书籍、文档

① 文档和书籍资料

② 黑客技术

因篇幅有限，仅展示部分资料

3️⃣网络安全源码合集+工具包

4️⃣网络安全面试题

上述所有资料 ⚡️ ，朋友们如果有需要全套 📦《网络安全入门+进阶学习资源包》，可以扫描下方二维码免费领取 🆓
​