fetch() call not returning any data

Question

I'm having a problem with my fetch() call not working correctly. I have a recursion method that calls itself within this function, but once it passes the if statement, the data itself is not being resolved to the .then() call below. I would like to keep the recursion method within this function. Because the system that this function is calling will change the data.result to a different result that is not null. I just don't know when that will happen, hence that is why I'm using the recursion method.

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))

This might be a duplicate of stackoverflow.com/questions/27691547/… but I'm not sure if that's right for async code. — Barmar
– Barmar, Commented Jan 31, 2020 at 22:43
Returning the recursive getResult alone wouldn't be enough because he's using the explicit Promise construction antipattern — CertainPerformance
– CertainPerformance, Commented Jan 31, 2020 at 22:43

Zohaib Ijaz · Accepted Answer · 2020-01-31 22:50:33Z

3

try using async...await and your code will be much simpler

var someToken = "actually token";

async function getResult(getToken) {
  const resp = await fetch(url, {
    headers: {
      "Authorization": something,
      "Jenkins-Crumb": getToken
    },
    redirect: 'follow',
  });
  const data = await resp.json();
  if (data.result == null) {
    console.log('retrieving data')
    return getResult(getToken)
  } else if (data.result == "SUCCESS") {
    console.log('success')
    return data;
  }
}

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

answered Jan 31, 2020 at 22:50

Zohaib Ijaz

23k7 gold badges43 silver badges63 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

dacD Over a year ago

This actually works for code. Thank you so much for your help.

CertainPerformance · Accepted Answer · 2020-02-02 05:23:36Z

You need to return the recursive call of getResult and avoid the explicit Promise construction antipattern (just return the Promises instead):

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))

Live demo:

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))

You should also consider - your if and else ifs at the end of the .then may not encompass all possibilities. What if data.result is neither null nor 'SUCCESS'? Given your current logic, the getResult call will result in data being undefined in the consumer. If there's a chance of that happening, you might want to throw an error or something in that case.

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'');

I tried using this method but it didn't return the data that I wanted in the function below. But thank you so much for the help. Maybe I didn't use your solution correctly.

Collectives™ on Stack Overflow

fetch() call not returning any data

2 Answers 2

1 Comment

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related