vue在响应头response中获取自定义headers

日常开发，我们可能会为了安全问题，保证第三方无法通过伪造返回报文欺骗前端，需要在返回报文中添加自定义参数，用于验证身份，后端添加自定义参数，前端校验自定义参数通过后才会执行相应的操作。

系统为了安全会去掉自定义头，如果不做任何处理，前端无法通过javascript访问自定义头，所以需要在接口返回中添加这样的操作。

response['Cookie'] ='13231231231' #自定义头

添加后接口返回信息如以下截图：

控制台打印headers信息如以下截图：

要正确打印需要在接口返回中设置以下信息：

response['Access-Control-Expose-Headers'] = "Cookie" #Cookie为自定义头的key

设置完后，打印截图如下：

VUE前端获取代码如下：

this.$http.post("/xx/xxx", {
     tel: '12345678901',
     code: '123456'
  }).then(res => {
     if (res.data.returnCode == 0) {
         if (res.data.bean) {
            let cookie  = res.headers.cookie;
            console.log(cookie);
            //校验自定义headers，通过则进行下一步操作
         } else {
            this.$Message.error("失败");
         }
      } else {
         this.$Message.error(res.data.returnMessage);
      }
 }).catch(function(error) {
     console.log(error);
 });

按照上面的操作，就可以解决欺骗前端的安全问题。