如何正確取得 fetch 的狀態？

Question

我在我的 api 中執行提取，它返回 201 狀態，但是當我嘗試在變數中接收它時，狀態變得很奇怪。

useEffect(() => {
async function Verify (test) {
 await fetch("/api/test", {
  method: "POST", 
  headers: {
   'Content-Type': 'application/json',
  },
  body: JSON.stringify({test: test}),
 }).then((response) => {
  res = response.status; 
  console.log(res); //thats print '201'
  return res;
 });
}
const status = Verify(test);
console.log(status); //thats print 'Promise { <state>: "fulfilled", <value>: 201 }'

}

Answer 1

如果您希望status等於Verify的結果，您需要await它。

const status = await Verify(test);

此外，我建議重構您的程式碼以在各處使用 await 來簡化流程。嘗試這樣的事情：

async function Verify (test) {
  const res = await fetch('/api/test', {
    method: 'POST', 
    headers: {
     'Content-Type': 'application/json',
    },
    body: JSON.stringify( { test } ),
  });
  
  if (!res.ok) {
    throw new Error('Not-ok response from server');
  }

  return res;
}