时间戳

首页 > 解决方案 > fetch() 调用不返回任何数据

javascript - fetch() 调用不返回任何数据

问题描述

我的 fetch() 调用无法正常工作时遇到问题。我有一个在这个函数中调用自身的递归方法，但是一旦它通过 if 语句，数据本身就不会被解析为下面的 .then() 调用。我想在这个函数中保留递归方法。因为此函数正在调用的系统会将 data.result 更改为不为空的不同结果。我只是不知道什么时候会发生，因此这就是我使用递归方法的原因。

var someToken = "actually token";

function getResult(getToken) {
  return new Promise((resolve, reject) => {
    fetch(url, {
      headers: {
        "Authorization": something,
        "Jenkins-Crumb": getToken
      },
      redirect: 'follow',

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

    }).then(data => {

      if (data.result == null) {
        console.log('retrieving data')
        getResult(getToken)
      } else if (data.result == "SUCCESS") {
        console.log('success')
        resolve(data)
      }

    }).catch(err => {
      reject(err)
    })
  })
}

getResult(someToken).then(data => {
  console.log(data)
}).catch(err => console.log(err))

标签： javascriptajaxvue.jsfetchfetch-api

解决方案

您需要返回递归调用getResult 并避免显式 Promise 构造反模式（只是Promisereturn代替）：

function getResult(getToken) {
  return fetch(url, {
    headers: {
      "Authorization": something,
      "Jenkins-Crumb": getToken
    },
    redirect: 'follow',
  })
    .then(response => response.json())
    .then(data => {
      if (data.result == null) {
        console.log('retrieving data');
        return getResult(getToken); // <-----------------------------
      } else if (data.result == "SUCCESS") {
        console.log('success');
        return data; // <-------------------------------------------
      }
      // What if data.result is neither null nor SUCCESS?  <--------
    });
}

getResult(someToken).then(data => {
  console.log(data);
}).catch(err => console.log(err))

现场演示：

const getUrl = () => Math.random() < 0.25 ? 'data:,{"result":"SUCCESS"}' : 'data:,{}';

function getResult(getToken) {
  return fetch(getUrl(), {
    headers: {
      "Authorization": 'something',
      "Jenkins-Crumb": getToken
    },
    redirect: 'follow',
  })
    .then(response => response.json())
    .then(data => {
      if (data.result == null) {
        console.log('retrieving data');
        return getResult(getToken); // <-----------------------------
      } else if (data.result == "SUCCESS") {
        console.log('success');
        return data; // <-------------------------------------------
      }
      // What if data.result is neither null nor SUCCESS?  <--------
    });
}

getResult('someToken').then(data => {
  console.log(data);
}).catch(err => console.log(err))

您还应该考虑 - 您的ifandelse if末尾的 s.then可能不包含所有可能性。如果data.result既不是null也不是'SUCCESS'呢？鉴于您当前的逻辑，getResult调用将导致在data消费者undefined中。如果有可能发生这种情况，您可能希望在这种情况下抛出错误或其他东西。

if (data.result == null) {
  console.log('retrieving data')
  return getResult(getToken) // <-----------------------
} else if (data.result == "SUCCESS") {
  console.log('success')
  return data; // <-----------------------
}
throw new Error('data.result is neither null nor 'SUCCESS'');

推荐阅读