繁体   English   中英

获取响应中未显示标题

[英]Headers not showing in fetch response

我可以在 Chrome DevTools 中看到标题“x-auth-token”。 在此处输入图片说明

但是,标题没有出现在我的提取响应中。 请协助,以便我可以使用标题数据。

我使用 NodeJS 作为后端 API,使用 ReactJS 作为前端。 这些是我的文件。

NodeJS 中间件 - cors.js

module.exports = function enableCorsSupport(app) {
  app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Methods", "POST, GET, PUT, DELETE");
    res.header("Access-Control-Allow-Headers", "Content-Type, x-auth-token");
    res.header("Access-Control-Expose-Headers", "x-auth-token");
    next();
  })
}

NodeJS 路由 - users.js

router.post('/login', async (req, res) => {

  // NOTE: code left out so post would be smaller

  const token = user.generateAuthToken();
  res.header('x-auth-token', token).send(_.pick(user, ['_id', 'firstName', 'email', 'isAdmin']));
})

ReactJS - 我的获取请求

fetch('http://localhost:4000/api/users/login', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      email: this.props.email,
      password: this.props.password
    })
  })
  .then(res => {
    console.log('res.headers', res.headers)
    return res.json()
  })
  .then(data => {
    console.log(data);
  })
  .catch((err) => {
    console.log(err)
  })
}

这是在我的成功获取请求中的 console.log 的 Chrome 控制台中。 标头响应中的标头为空。 请指教。 仅供参考,这是用户测试数据。 在此处输入图片说明

Header对象不为空。 它只是不是一个常规对象,因此它的内容没有作为其实例的属性。 因此,您不会在 console.log 视图中看到标题/值。

要获取特定标头的值,您需要使用get()方法

var token = response.headers.get('x-auth-token');
console.log(token);

您也可以使用 for ... of

for(const header of response.headers){
   console.log(header);
}

演示

 fetch('https://cors-anywhere.herokuapp.com') .then(res=>{ for(const header of res.headers){ console.log(`Name: ${header[0]}, Value:${header[1]}`); } });

使用 Node.js 我找到了这个解决方案,使用了ExposureHeaders

 const cors = require('cors'); const express = require('express'); // .......... var app = express(); app.use(cors({ exposedHeaders: ['x-auth-token'], }));

对于阅读,没关系:

 x_auth_token = res.headers.get('x-auth-token');

公开x-auth-token标头的另一种方法是

  res
    .header("x-auth-token", token)
    .header("access-control-expose-headers", "x-auth-token")
    .json(data);

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM