stop and execute a promise javacript

Question

How do I execute a HTTP request synchronously and store the result in a local object with Javascript?

Given the following javascript module:

var Promise = require("promise");                                                                                                                                                                       

function myReq(url) {
  return new Promise((resolve, reject) => {
    const xhr = new XMLHttpRequest();
    xhr.open("GET", url);
    xhr.responseType = 'json';
    xhr.onload = () => {
      if (xhr.status >= 400){
        console.log("got rejected");
        reject({status: xhr.status, statusText: xhr.statusText});
      } else {
        console.log("resolved");
        resolve({data: xhr.response});
      }
    };
    xhr.onerror = () => {
      console.log("Error was called");
      reject({status: xhr.status, statusText: xhr.statusText});
    };
    xhr.send();
  });
}

export default myReq;

I want the json object from this request stored in a local variable in another script. However, when I try this code it runs it async.

1. import myReq from '../../lib/myReq';
2. const urlTest = "localhost://3000:/somepath";
3. const test = myReq(urlTest).then((a) => {console.log(a); return a;}).catch((b) => console.log(b));
4. console.log(test.data);

I want it to stop at line 3, execute the code, store the javascript object in test, and the resume execution of the rest of the code. Right now test is a Promise and test.data is undefined.

3. const test = await myReq(urlTest).then((a) => {console.log(a); return a;}).catch((b) => console.log(b)); This doesn't compile. — Alexander R Johansen, May 13 '22 at 20:23
Just do `let result = await myReq(someUrl);` and then put a `try/catch` around it to catch errors. — jfriend00, May 13 '22 at 20:24
What about the use of .then and .catch? Also, the function doesn't return anything as it operates with resolve and reject? — Alexander R Johansen, May 13 '22 at 20:29

score 1 · Accepted Answer · answered May 16 '22 at 08:07

myReq returns a Promise, NOT just the data! That is why you need to use then & catch blocks, or alternatively use await.

// myReq function returns a Promise, NOT a value! (Not returning 5!)
function myReq(url) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(5);
    }, 5000);
  });
}

// Option 1
myReq('someurl').then((data) => {
  console.log('data (option 1)', data); // You can use the data here, inside the 'then' block
}).catch((error) => {
  console.log('error', error);
});

// Option 2
const run = async () => {
  try {
    const data = await myReq('someurl'); // await must be called from an 'async' function
    console.log('data (option 2)', data); // You can use the data here, inside the 'try' block
  } catch (error) {
    console.log('error', error);
  }
};
run();

score 0 · Answer 2 · answered May 25 '22 at 03:12

If you want to convert this to a synchronous process you can directly use the async/await to handle the process rather than directly moving to next step. Like you can do something like:

try {
const result = await myReq(url);
} catch (e) {
 // Handle error generated in the process
}

remember you can only async/await in pair means that only inside an async function you can use await keyword. For more details you can visit this article

Hope this helps. Have a good day.

stop and execute a promise javacript

2 Answers2