- 通过搜索引擎搜索了下axios怎么获取响应头，总结下就是浏览器只能访问默认的响应头，如果需要获取自定义的响应头需要在响应头里设置
Access-Control-Expose-Headers。 - 刚开始时候我看的有点蒙，后来我发现了其实原理就是在响应头加一个
Access-Control-Expose-Headers字段，它的value值就是自定义的响应头字段。
return Response({"all_href":all_href},headers={"token":"token","a":"a","Access-Control-Expose-Headers":"token,a"})- value值使用逗号隔开，这里我设置了自定义变量token和a，然后在前端获取headers打印看看。
geturl() { axios.get('http://localhost:8000/api/geturl').then((response) => { console.log(response.headers) this.v_hrefs = response.data.all_href; }).catch(err => { console.log('操作失败' err); }) }
- 可以看到打印了token和a两个字段，现在我们把自定义设置里面的a去掉：
returnResponse({"all_href":all_href},headers={"token":"token","a":"a","Access-Control-Expose-Headers":"token"})
- 然后重新打印下：
- - 可以看到a字段没了，嘿嘿~
- 刚刚只是测试下返回响应头，现在可以再登录接口返回token了。
- 注意看获取的
token的key是小写的，前端会默认转换成小写，所以取值时候使用小写。 - 有登录就有退出，做一个退出按钮在右上角飘着~
<div style="position:relative">
<el-button style="position: fixed;right: 0%;" type="danger" size="small" @click="quit()">退出登录</el-button>
</div>- 调用函数quit，函数里面删除token和用户信息然后调转到登录页面，注意remove参数里面域生产以后要换成生产主机域名。
quit() { this.$cookies.remove("login-token",{domain:'localhost',path:'/'}); this.$cookies.remove("username",{domain:'localhost',path:'/'}); this.$router.push("/") },
- 我们还应该在页面加一下登录校验，如果没有登录
tokencookie值就直接跳转到登录页面。
mounted() { //这个属性就可以，在里面声明初始化时要调用的方法即可
// we can implement any method here like
this.geturl(), this.login_check()
}- 校验方法
login_check() { var v_token = this.$cookies.get("login-token"); console.log(v_token); if (v_token== null){ this.$router.push("/")
}else{ console.log('登录了')
}
},然后再登录页面页判断下是不是已经登录过了，如果已经登录过了直接跳转到首页。
代码语言：javascript复制 mounted() { //这个属性就可以，在里面声明初始化时要调用的方法即可
// we can implement any method here like
this.logined_check()
logined_check() {
var v_token = this.$cookies.get("login-token");
if (v_token!= null){
this.$router.push("/home")
}else{
console.log('已经登录了')}
},登录请求已经校验就基本完事了，下一节完善首页那个搜索功能。
周末拍的小姐姐，小姐姐真好看~
