Используя async / await, чтобы найти значение запроса cors?

Question

Я пытаюсь выполнить запрос CORS, а затем использовать async / await , чтобы получить из него значение (я использую jquery btw).

Функции createCORSRequest и executeCORSRequest отлично работают, я считаю, поэтому реализация не имеет большого значения.Функция getDailyGames использует await для получения обещания, созданного из executeCORSRequest, а затем возвращает это обещание.

Моя проблема в том, чтобы фактически использовать обещание в функции $(document) .ready (это в основномосновная функция в jquery).

В закомментированной строке метод .then используется для результата getDailyGames, чтобы распечатать результат функции (это прекрасно работает).

Однако я хочу сохранить значение этого обещания в переменной 'result' и что-то с ним сделать, но не могу получить его из обещания.

Как правильно вернуть это обещание, чтобы я мог сохранить разрешенное значение в переменной и что-то с ним делать?

Или еще один способ задать вопрос: почему переменная 'result'в getDailyGames получить обещание?Не следует ли использовать await с обещанием дать вам разрешенное значение напрямую?

$(document).ready(function() {    
  //getDailyGames(20190313).then(result => console.log(result));
  let result = getDailyGames(20190313);
  //DO STUFF WITH RESULT    
});

async function getDailyGames(date){    
  const url = 'https://api.jjjacobson.com/dailygames?season=2018-2019- 
  regular&date=' + date;
  let result = await executeCORSRequest(url);
  return result;    
}

function executeCORSRequest(url){
  return new Promise(function(resolve, reject) {
    const xhr = createCORSRequest('GET', url);
      if (!xhr) {
        throw new Error('CORS not supported');
      }
      xhr.onload = function() {
        resolve(xhr.responseText);
      };  

      xhr.onerror = function() {
        console.log('There was an error!');
        reject('ERROR');
      };    
      xhr.send();
    });
}

function createCORSRequest(method, url) {
  let xhr = new XMLHttpRequest();
  if ("withCredentials" in xhr) {    
    // Check if the XMLHttpRequest object has a "withCredentials" property.
    // "withCredentials" only exists on XMLHTTPRequest2 objects.
    xhr.open(method, url, true);    
  } 
  else if (typeof XDomainRequest != "undefined") {    
    // Otherwise, check if XDomainRequest.
    // XDomainRequest only exists in IE, and is IE's way of making CORS requests.
    xhr = new XDomainRequest();
    xhr.open(method, url);    
  } 
  else {    
    // Otherwise, CORS is not supported by the browser.
    xhr = null;    
  }
  return xhr;
}

Answer 1

Вам следует изменить функцию document.ready на:

$(document).ready(function() {

  let result;
  getDailyGames(20190313).then(res => {
    result = res;
    //DO STUFF WITH RESULT

  });
});

Await работает только тогда, когда сама функция асинхронна.Вы также можете сделать это

$(document).ready(async function() {

  let result = await getDailyGames(20190313);
  //DO STUFF WITH RESULT

});

Answer 2

Async / await - только синтаксический сахар, направленный на устранение ада обратного вызова. Следует помнить, что где-то вниз по асинхронной цепочке вам придется иметь дело с обещанием. По этой причине вы можете использовать await только внутри функции async, и, к сожалению, корень скрипта не является функцией async.

В вашем случае, если вы хотите сериализовать вызов getDailyGames, сделайте document.ready асинхронной функцией, как указано @ varun.