Question

我正在使用JS进行镀铬。 chrome.history.search函数是一个异步回调。由于它是异步的，因此我计划使用promise使其同步。我希望代码使用chrome.history.search将值分配给url，然后将其推送到全局数组lastEpisodeLink。还有另一个函数findLastEpisodeLink，它对多个标题调用findLastEpisode_helper。

我需要的输出顺序是：
开始，内，成功，
开始，内，成功，...

但是我得到的是：
开始，开始，内部，成功，内部，成功

在函数运行后我检查了lastEpisodeLink数组时，它说应该是空的。我该如何解决？

是的，我已经遵循答案How do I return the response from an asynchronous call?，但仍然无法解决。如果您可以帮助我修复此代码，将非常有帮助。谢谢

function findLastEpisodeLink_helper(title) {

  console.log("start");
  var url;

  function onSuccess () {
    console.log('Success!');
    lastEpisodeLink.push(url);
  }

  var promise = new Promise(function(resolve, reject) {
    
    chrome.history.search(
     {
      'text': title,
      'maxResults': 1,
      'startTime': 0
     },

    function(historyItems) {

      console.log("inside");
      url = historyItems[0]["url"];
      resolve();

    });
  });
  promise.then(onSuccess);
}

调用它的函数

function findLastEpisodeLinks() {

  for(title in stringArray) { //psudo code

    findLastEpisodeLink_helper(title);
  }
}

调用它的函数如下，它本身是一个异步回调，所有调用都由它完成。

chrome.history.search(
   {
  'text': '',
  'maxResults': 10000,
  'startTime': 0
   },

   function(historyItems) {

      var allHistoryText = [];
      var allHistoryUrl = [];

      for(var i=0; i<historyItems.length; i++) {
        allHistoryText.push(historyItems[i]["title"]);
        allHistoryUrl.push(historyItems[i]["url"]);
      }

      // some functions

      findLastEpisodeLinks();

      displayAll(finalAllSeries);
});

Answer 1

这就是我要做的，


const lastEpisodeLink = [];

function findLastEpisodeLink_helper(title) {
  return new Promise(function(resolve) {
    chrome.history.search({
      'text': title,
      'maxResults': 1,
      'startTime': 0
     },function(historyItems) {
      var url = historyItems[0]["url"];
      lastEpisodeLink.push(url);
      resolve();
    });
  });
}


async function findLastEpisodeLinks() {
  for(var title in stringArray) { 
    await findLastEpisodeLink_helper(title);
  }
}

Answer 2

我认为您的主要问题是如何在for循环中保持异步函数调用的顺序。为此，您只需要await findLastEpisodeLink_helper，以便循环等待，直到其诺言得以解决。

async function findLastEpisodeLink_helper(title) {
  console.log('start');
  var url;

  function onSuccess() {
    console.log('Success!');
    lastEpisodeLink.push(url);
  }

  await new Promise(function (resolve, reject) {
    chrome.history.search(
      {
        text: title,
        maxResults: 1,
        startTime: 0,
      },

      function (historyItems) {
        console.log('inside');
        url = historyItems[0]['url'];
        resolve();
      },
    );
  });

  onSuccess();
}

async function findLastEpisodeLinks() {
  for (title in stringArray) {
    //psudo code
    await findLastEpisodeLink_helper(title);
  }
}

Answer 3

使用现代的async + await语法和Promise.all：

function search(title) {
  return new Promise(resolve => {
    chrome.history.search({
      'text': title,
      'maxResults': 1,
      'startTime': 0,
    }, results => resolve(results[0].url));
  });
}

async function findLastEpisodeLinks(titles) {
  const results = await Promise.all(titles.map(search));
  console.log(results);
}

用法：findLastEpisodeLinks(['text a', 'text b', 'text c'])

使用了诺言后，异步功能也不会等待

3 个答案: