新学期开个新坑，碎嘴子wp写的有点聒噪
题解
点击靶场链接进入靶场，见到上述页面。
点击立刻转账、充值、查看账单都显示功能开发中，点击”检查我的钱“会出现弹窗
现在确定我们的目标是把钱数修改到题目要求的范围，然后点击”检查我的钱“让他检测到钱数满足要求，给我们flag。
根据题目描述，这是前端修改HTML的靶场，我们点击F12打开浏览器开发者工具，切换到【Elements 元素】面板，该面板展示当前网页的 HTML DOM 源码。
我们可以点击开发者工具左上角方框箭头图标，鼠标点击页面上钱数的20，可以自动定位到对应 HTML代码行，或者Ctrl+F直接查找也行，总之找到了对应的源代码位置，然后修改就行，详细步骤如下
修改钱数就行，上下两个都要改
改完之后得到flag。
关键js代码如下
document.getElementById('check-money-btn').addEventListener('click', function() {
var amountText = document.querySelector('.amount').innerText;
var moneyValue = amountText.replace(/[^\\d.-]/g, '');
fetch('/check?money=' + moneyValue)
.then(function(response) {
return response.json();
})
.then(function(data) {
alert(data.message);
})
.catch(function(error) {
console.error('Error:', error);
});
});
应用
在网上经常刷到的“修改你的粉丝数到一亿”的视频其实也是这个原理，可以改了截图去开个玩笑，当然刷新一下就恢复了。
而很多开发者把「校验、判断、权限、业务逻辑」放在前端执行，这就非常危险，例子就是这道题，他把对金额的检验放到了前端执行，导致我们可以进行修改。试想如果我建的购物网站也有这个漏洞，就可能会在判断你是否有能力获得这个商品的时候出错，导致财产的损失。
防范
了解一个漏洞不仅要了解它工作的方式，还要了解它的防范。可以想想红队和蓝队（不知道啥意思搜网安”黑话“扫盲之类的文章）。
前端不可信，我们引入后端数据库。现在的真实业务流程是：
1.页面展示余额：从后端接口拉取真实余额，渲染到页面（只是展示）
2.校验余额：再次向后端发请求，后端查数据库做判断，完全不看前端页面上显示什么，改了前端也没有用
之前做过设计一个购物网站的作业，很容易出现这样的漏洞，也是被打穿力（悲）。
