这几天学到PHP的GD图像处理库，做了一个验证码的小demo
前端用户提交输入框的字符串，在后台将字符串与存在SESSION中的验证码字符串进行比较，判断用户输入是否正确
第一版做的是通过form表单提交到后台PHP文件进行处理，这样提交以后浏览器就会跳转到响应页面
第二版通过js进行提交，并去掉form的默认提交行为，通过AJAX获取验证码的判断状态
但是即使设置了请求头为Content-Type : application/json，后台代码中$_POST却接收不到post方式发送过去的数据，是空值
查阅资料发现$_POST只可以取到form提交的数据，而form提交的请求头为Content-Type : application/x-www-form-urlencoded，导致$_POST不能解析出json类型的请求数据，用json传输请求数据后台需要使用file_get_contents读取请求数据（这个还没有试过~~）
在ajax中设置请求头
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
设置好后后台就可以通过$_POST接收到参数了
附上完整代码：
前端部分
<body>
<form id="captcha_form" method="POST">
<input type="text" name="code"/>
<button>提交</button>
</form>
<img src="./code.PHP" alt="captcha code" onclick="this.src='./code.PHP?'+Math.random()">
<div id="code-result"></div>
</body>
<script>
let formCode = document.getElementById("captcha_form");
let resultBox = document.getElementById("code-result");
formCode.onsubmit = function(){
let xhr = new XMLHttpRequest();
xhr.open("POST","./formSubmit.PHP");
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xhr.onreadystatechange = function(){
if(xhr.readyState == 4){
if(xhr.status == 200){
resultBox.innerHTML = xhr.responseText;
}
}
}
let inputBox = document.querySelector("input[name='code']");
xhr.send("code="+inputBox.value);
return false;
}
</script>
后台处理部分
<?PHP
session_start();
$userCode = strtoupper($_POST["code"]);
echo $userCode == $_SESSION["code"]?"OK":"Error Captcha Code";
?>
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
