Реагировать на получение статуса вызова без содержимого

Question

Я попробовал этот кусок кода:

fetch("http://localhost:5000/api/signin", {
  method: "post",
  headers: {
    "Content-Type": "application/json",
    Authorization: "this-can-be-anything"
  },
  body: JSON.stringify({
    email: this.state.email,
    password: this.state.password
  })
})
  .then(response => {
    console.log(response);
    response.json();
  })
  .then(data => {
    console.log(data);
  });

Это попытка увидеть, все ли хорошо, если я попытаюсь почтальону позвонить http://localhost:5000/api/signin все работает, и здесь тоже, ноЯ ничего не получаю обратно.Я получаю на вкладке «Сеть» вызов, который дает мне нужные данные, а другой - из линии, которую я называю выборкой, со статусом 204.

Нет содержимого, почему?

Answer 1

Вы не возвращаете обещание, возвращенное response.json(), поэтому ваша цепочка обещаний разорвана, и undefined передается в качестве аргумента последней функции.

Добавьте ключевое слово return, и оно будет работать как положено.

fetch("http://localhost:5000/api/signin", {
  method: "post",
  headers: {
    "Content-Type": "application/json",
    Authorization: "this-can-be-anything"
  },
  body: JSON.stringify({
    email: this.state.email,
    password: this.state.password
  })
})
  .then(response => {
    return response.json();
  })
  .then(data => {
    console.log(data);
  });

Answer 2

Похоже, вам нужно вернуть Promise, возвращаемое .json()

Это можно немного убрать, используя современную функцию ES7 async/await, избегая вездесущего ада обратного вызова

const loginUser = async () => {

  const response = await fetch("http://localhost:5000/api/signin", {
    method: "post",
    headers: {
      "Content-Type": "application/json",
      Authorization: "this-can-be-anything"
    },
    body: JSON.stringify({
      email: this.state.email,
      password: this.state.password
    })
  })

  const data = await response.json();

  console.log('[data]', data);

  return data;
}

Answer 3

Эта проблема возникает из-за того, что вы ничего не возвращаете с

.then(response => {
  console.log(response);
  response.json();
})

Если вы добавляете фигурные скобки в функцию стрелки; тогда вам нужно добавить явный возврат. Так что измените его на:

.then(() => response.json())

или

.then(() => {
  return response.json();
})

И это должно работать.