Vue‑Crack（也叫 VueCrack）是 Chrome/Edge 的红队专用浏览器插件，专门用来"扒 Vue 网站的路由 + 绕过前端权限控制"，发现隐藏后台和未授权访问漏洞。
一、它是干什么的（一句话）
很多 Vue 网站把权限只写在前端路由守卫 里（beforeEach、路由 meta.auth），后端没校验；Vue‑Crack 一键把这些前端限制清掉，直接访问需要登录/管理员才能看的页面 ，并把所有路由（含隐藏后台）都列出来。
二、核心功能（4 个）
- 自动识别 Vue 站点
打开网站，插件自动判断是不是 Vue + VueRouter。 - 一键绕过路由守卫
自动清除全局beforeEach、beforeResolve，不再被"请先登录"弹窗/跳转挡住。 - 扒出全部路由（含隐藏）
从内存里提取完整路由表，包括菜单里不显示的：
/admin、/manage、/test、/config等。 - 自动改权限标记
把路由meta里auth: true、role: admin直接改掉，前端认为你有权限。
三、什么时候能用（漏洞场景）
- 网站是 Vue 单页应用（SPA）
- 权限只做在前端路由里，后端接口没校验
- 能直接访问
/admin等路径，不用登录
一句话：前端鉴权≈形同虚设，Vue‑Crack 就是把这层窗户纸捅破。
四、它和 BP（Burp Suite）的区别
- BP：抓包、改包、爆破账号密码（偏接口层）
- Vue‑Crack ：专门针对 Vue 前端路由/权限（偏页面访问层）
两者经常配合用：Vue‑Crack 找后台路径 → BP 爆破登录 → 进后台。
五、重要提醒（合法边界）
- 仅用于自己的系统安全测试/授权渗透
- 未经授权用在别人网站上是违法的（非法入侵计算机系统）
六、开发者怎么防（简单说）
- 后端必须做权限校验（接口层 + 数据层）
- 不要只靠前端路由守卫控制访问
- 敏感接口要校验 Token、角色、权限
Vue项目防路由绕过最小安全配置（前端+后端）
核心原则：前端路由只是"视觉控制菜单"，真正权限校验全部放在后端，前端任何限制都不可信
一、前端（Vue2 + VueRouter2/3，仅做页面展示拦截，不能作为安全防线）
前端校验只是提升用户体验，不能阻止攻击者直接调用接口
// router/index.js
import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
const router = new Router({
routes: [
{
path: '/admin',
name: 'Admin',
component: () => import('@/views/admin'),
meta: { requiresAuth: true, role: 'admin' } // 标记权限
},
{ path: '/login', component: () => import('@/views/login') }
]
})
// 全局路由守卫
router.beforeEach((to, from, next) => {
const token = localStorage.getItem('token')
const userRole = localStorage.getItem('role')
// 需要鉴权的页面
if (to.meta.requiresAuth) {
if (!token) {
next('/login')
} else if (to.meta.role && to.meta.role !== userRole) {
next('/403') // 角色不匹配，跳转无权限页
} else {
next()
}
} else {
next()
}
})
export default router注意：Vue-Crack可以直接修改内存里的
meta、跳过beforeEach，此守卫只能防普通用户，防不了插件。
二、后端（关键！真正的权限校验，必不可少）
接口统一拦截逻辑（伪代码，Java/Node/PHP都适用）
每一个敏感接口，都必须校验，不能省略
- 校验请求头携带的Token是否存在、是否过期、签名合法
- 解析Token拿到当前用户角色
- 判断该角色是否拥有当前接口的访问权限
- 无权限直接返回
403 Forbidden，不返回业务数据
Node.js极简示例（Express）
// 权限中间件，所有后台接口都要挂载
function authMiddleware(req, res, next) {
const token = req.headers.token
if (!token) return res.status(401).json({msg:"未登录"})
// 1. 校验token，解析用户信息
const user = verifyToken(token)
if(!user) return res.status(401).json({msg:"token无效"})
// 2. 校验接口权限
const allowApiList = getApiByRole(user.role)
if(!allowApiList.includes(req.path)){
return res.status(403).json({msg:"无权限访问"})
}
req.user = user
next()
}
// 敏感后台接口
router.get('/api/admin/list', authMiddleware, (req,res)=>{
res.json({data:"管理员数据"})
})三、额外加固建议
- 不要把后端全部路由/接口列表写在前端打包代码里，防止插件直接扒路径
- 菜单由后端动态返回，前端不要写死全部路由
- 敏感接口增加请求频率限制（防BP爆破）
- 权限粒度控制到接口级别，不要只控制页面路由
四、一句话安全总结
前端路由守卫只是UI层面的隐藏；后端接口鉴权才是安全底线。就算攻击者用Vue-Crack打开了管理页面，调用接口时依然会返回403，拿不到任何数据。