在 Web 应用中实现令牌失效(Token Expiration)通常涉及到两个方面:客户端的令牌使用和服务器端的令牌验证
<html>
<meta http-equiv="content-type" content="text/html;charset=UTF-8"/>
<title>javascript设置自定义的标头获取数据</title>
<body>
<?php
//生成令牌,这里是直接写在这里做测试,你也可以单独写成函数或类,要用时再调用
session_start();
if(empty($_SESSION['csrf_token']))
{
$_SESSION['csrf_token']=bin2hex(random_bytes(32));
}
?>
//发送header头的按钮
<button id="sendRequest">发送标头</button>
<script type="text/javascript">
document.getElementById("sendRequest").addEventListener("click",function(){
let xhr=new XMLHttpRequest();
//获取到session中的令牌信息,这一句在只php为后缀的页面中才能有效,不能用html为后缀
let csrfToken = <?php echo json_encode($_SESSION['csrf_token']); ?>;
console.log(csrfToken);
//后端处理令牌信息和比对
xhr.open('get',"headerapi.php");
//设置标头,把令牌信息设置到标头中,然后发送到后端,对比也是在后端
xhr.setRequestHeader('X-Custom-Header',csrfToken);
xhr.responseType="json";
//加载xhr,监控数据和标头是否被发送
xhr.onload=function(){
if(xhr.status>=200 && xhr.status<300)
{
console.log('Request Data:',xhr.response);
//获取标头信息,这里获取标头只是演式令牌和标头令牌是否一致
let customresponseHeader=xhr.getResponseHeader("X-Custom-Response-Header");
let Ref=xhr.getAllResponseHeaders();
if(csrfToken===customresponseHeader)
{
console.log('当前的标头:',customresponseHeader);
}
}else
{
console.error('获取失败:',xhr.status);
}
};
xhr.onerror=function(){
console.log('连接时失败');
};
xhr.send();
})
</script>
</body>
</html>
//这里是后端的PHP处理标头信息及你要返回的数据
//验证标头信息是否为空,这里的标头信息就是从xhr.setRequestHeader()传过来的令牌
if(!empty($_SERVER['HTTP_X_CUSTOM_HEADER']))
{
$customHeader=$_SERVER['HTTP_X_CUSTOM_HEADER'];
//这里可以进行比较session中的令牌是否和标头里面的$customHeader令牌一致
//这个header()设置只是为了让前端的演式比较设置
header('X-Custom-Response-Header: '.$customHeader);
}
echo json_encode(['message'=>'这是当前返回的内容']);
本站资源均来自互联网,仅供研究学习,禁止违法使用和商用,产生法律纠纷本站概不负责!如果侵犯了您的权益请与我们联系!
转载请注明出处: 免费源码网-免费的源码资源网站 » 简单的后端生成令牌,前端获取,然后ajax设置header标头,后端进行对比
发表评论 取消回复