知识点
1、JS前端验证 -文件上传
2、JS-Ajax传递-登录-状态
3、JS-Ajax传递-购物-参数
1、文件上传-类型-过滤
设计：通过JavaScript进行文件后缀筛选验证
2、状态回显-登录-状态码
设计：通过Ajax传递数据进行用户登录验证
3、参数修改-购物-参数修改
设计：通过Ajax传递数据进行购物验证
设计1：商品价格以前端设置价格为准，数据接收价格后运算
设计2：商品价格以数据库对应价格为准，数据接收价格后运算
设计3：商品价格以数据库对应价格为准，数据只接受数量后运算
设计4：商品价格以数据库对应价格为准，数据只接受数量后做过滤运算
案例
文件上传代码实现
<form class="upload" method="post" enctype="multipart/form-data" action="">
<input class="uploadfile" type="file" name="upload" onchange="checkFileExt(this.value)"/><br />
<input class="sub" type="submit" name="submit" value="开始上传" />
</form>
<script src="../js/jquety-1.12.4.min.js"></script>
<script>//js代码可以在前端直接看到
function checkFileExt(filename)
{
var flag = false;//状态
var arr = ["jpg","png","gif"];
//取出上传文件的扩展名
var index = filename.lastIndexOf(".");
var ext = filename.substr(index+1);
//比较
for(var i=0;i<arr.length;i++)
{
if(ext == arr[i])
flag = true; //一旦找到合适的，立即退出循环
alert("上传的文件符号要求！");
break;
}
}
if(!flag)
{
alert("上传的文件不符合要求请重新选择！");
location.reload(true);
}
}
</script>
<?php
//对文件上传的后缀名进行验证，符合要求的才能上传
//这个功能的视线可以由PHP或JS去实现
//两种去验证的区别：PHP 验证的代码看不到 只能黑盒测试 后端 服务端
//JS 验证的代码是可以看到的 白盒测试 ❤ 前端 浏览器
header("Content-Type:text/html;chatset=utf-8");
之前litctf2023做过一道题，就是要禁用前端js代码的弹窗功能，才可以成功实型ping的操作，这说明当验证代码为js时，我们可以通过屏蔽掉它来实现绕过的效果。
判断验证代码是否是js代码：①直接查看源代码，有js代码就说明是的 ②看返回时间，如果用js的代码，响应时间是很快的
Ajax
$X=$_POST[x];
echo $x;
Ajax用js来实现交互，之前可能是用php实现数据的交互，所以Ajax也是js的一部分
html文件里面是不能插入php代码的
js和php分别实现表单提交
<script src="js/jquery-1.12.4.min.js"></script>
<script>
$('button').click(function()){
$.ajax({
type:'post',
url:'ajax.php',
dataType:'json',
data:{
myUname:$('.user').val(),
myUpass:$('.pass').val()
},
success:function(res){
console.log(res)
}
})
}
<?php
$usr=$_POST['user'];
$pass=$_POST['pass'];
?>
<?php
include("/config/conn.php");
$sql="select * from sy_guestbook";
$result=mysql_query($sql,$conn);
while($row=mysql_fetch_array($result)){
echo '<br><br><hr>';
echo $row['id'];
echo $row['imgsrc'];
echo "<img src='$imgsrc\' width=\'270\' height='' alt=''/><br>";
echo "价格: $price<br>";
echo "数量:" <input type='text' class='number'>";
echo "<button>购买</button>"
}
?>
修改价格前端展示的价格，你改个包还是会改变的，但是后端数据库的价格是死的，修改不掉的所以还是没法绕过。
前端验证绕过：只要改个包，把原先验证通过状态码发过去就可以绕过了
当返回的是code&json的字符样式时，就要考虑存不存在前端验证代码的漏洞。当然现在基本上没有单单的前端验证了，你改不了数据库的数据还是没什么卵用
vue node.js框架，可以直接用js来写一个网站，而且界面美观效果好，这类网站就要通过js代码去分析漏洞，代码也都是开放给我们的，直接一整个白盒测试。而如果是php代码的话，只有前端的html代码是可以看到的，但是后端的php代码就不知道了。