javascript – 由于预检而获取答案为空？

我有一个webapp react.js / redux / webpackt / es6 …和一个api与大猩猩的mux一起去.
当我用下面的函数打电话时,我的标题是空的,也是内容.

我在我的webapp中使用这个包来打电话

"isomorphic-fetch": "^2.2.1",

我的电话示例

export function Login(userData) {
  return dispatch => {
    fetch(API + '/login',{
      method: 'post',headers: {
        'Accept': 'application/json','Content-Type': 'application/json',},body: JSON.stringify({
        email: userData.email,password: userData.password,}),})
    .then(response => {
      console.log(response);
      console.log(response.statusText);
      console.log(response.status);
      console.log(response.headers);
      console.log(response.headers.get("Authorization"));
      console.log(response.json());
      return response.json()
      if (response.status >= 200 && response.status < 300) {
        console.log(response);
        dispatch(LoginSuccess(response));
      } else {
        const error = new Error(response.statusText);
        error.response = response;
        dispatch(LoginError(error));
        throw error;
      }
    }).then(function(json) {
      console.log('parsed json' + json)
    })
    .catch(error => { console.log('request Failed',error); });
  }

一开始我遇到了问题How to handle preflight CORS requests on a Go server我用过这个解决方案

我们可以在控制台内查看调用：

login   OPTIONS   200   fetch   auths.actions.js:38 352 B   1 ms    
login   POST      200   json    Other   567 B   82 ms

当我查看我的POST Header响应时,我有：

HTTP/1.1 200 OK
Access-Control-Allow-Headers: Accept,Content-Type,Content-Length,Accept-Encoding,X-CSRF-Token,Authorization
Access-Control-Allow-Methods: POST,GET,OPTIONS,PUT,PATCH,DELETE
Access-Control-Allow-Origin: http://localhost:3000
Authorization: Bearer eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJpYXQiOjE0NTQ3NTcxNjEsInVzZXJfaWQiOiI1NmI1YjZlOTFhZTMzYjAwMDFhYmE1MTQifQ.WGoTMxm6OuN24Olwr93J3pND9dFLCtG5MyiRbqLWeD244JtDzq0bGgQMixeZxyuxwGK3u8KhyWD7Rr6iZAGNpA
Content-Type: application/json
Date: Sat,06 Feb 2016 11:12:41 GMT
Content-Length: 2

所以响应处理我的预检信息而不是我的POST？因为response.headers和response.headers.get(“授权”)内部没有任何内容
有什么不对吗？

解决方法

我遇到了问题,我的标题已被发送,正确接收(chrome的网络选项卡正确显示我所有发送的标题),但我无法在js中访问它们(response.headers为空).如 Fetch get request returns empty headers中所述,这是因为服务器未设置Access-Control-Expose-Headers标头,导致所需的标头不会暴露给js.
所以解决方案是在服务器上添加这个头文件,现在可以在js中访问头文件：

Access-Control-Expose-Headers: <header-name>,<header-name>,...

标头采用以逗号分隔的标题名称列表,以显示给浏览器.

有关为何需要此标头的其他信息,请参阅Why is Access-Control-Expose-Headers needed?