处理两个嵌套的 fetch 并将两个 JSON 响应组合成一个 JSON 以进行循环

Question

所以现在，我有一个 JSON fetch 来获取我的本地 API。

function lookupData(input, funct = "auto") {
  fetch("/lookup/" + input + "/" + funct, {
    method: "GET",
    headers: {
      "Content-Type": "application/json",
      Accept: "application/json",
    },
  })
    .then((res) => res.json())
    .then((data) => {
      if (funct == "sources") {
        console.log(data.sources);
      } else {
        console.log(data.result);
      }
    });
}

假设功能==“来源”

data.sources 数组看起来像这样：

{
    "123RF",
    "500px",
    "Adobe",
    "AntiPublic",
    "Apollo",
    "Bitly",
    "Dave",
    "Disqus",
    "Dropbox",
    "ExploitIn",
    "ShareThis",
    "Straffic",
    "Ticketfly",
    "Tumblr",
    "VerificationsIO"
}

对于 data.sources 中的每个项目，我希望它对属于 HaveIBeenPwned 的 EXTERNAL API 进行另一个提取： https ://haveibeenpwned.com/api/v3/breach/[ITEM ]

因此，对于第一个，它将是https://haveibeenpwned.com/api/v3/breach/123RF

这将返回一个如下所示的数组：

{
    Name: "123RF",
    Title: "123RF",
    Domain: "123rf.com",
    BreachDate: "2020-03-22",
    AddedDate: "2020-11-15T00:59:50Z",
    ModifiedDate: "2020-11-15T01:07:10Z",
    PwnCount: 8661578,
    Description: "In March 2020, the stock photo site 123RF suffered a data breach which impacted over 8 million subscribers and was subsequently sold online. The breach included email, IP and physical addresses, names, phone numbers and passwords stored as MD5 hashes. The data was provided to HIBP by dehashed.com.",
    LogoPath: "https://haveibeenpwned.com/Content/Images/PwnedLogos/123RF.png",
    DataClasses: [
        "Email addresses",
        "IP addresses",
        "Names",
        "Passwords",
        "Phone numbers",
        "Physical addresses",
        "Usernames"
    ],
    IsVerified: true,
    IsFabricated: false,
    IsSensitive: false,
    IsRetired: false,
    IsSpamList: false
}

我想创建一个新的 json 数组，该数组包含站点名称（来自我的第一个本地 API 提取）和来自第二个 API 提取的“标题、描述和徽标路径”。 所以我可以遍历这个新的、重组的对象并以这种方式处理数据。

Answer 1

我没有使用真实的数据返回进行测试，但是您的第二次调用应该如下所示：

function displayResults(data) {

    const resultsArray = [];

    for(let i = 0; i < data.length - 1; i++) {
        let apiURL = "https://haveibeenpwned.com/api/v3/breach/" + data[i]; // requests to the correct url for each data.source
        let datum = callSecondAPI(apiURL);
        let tempObj = { 
            "Title": datum[1],
            "Description": datum[7],
            "LogoPath": datum[8]
        }
        resultsArray.push(tempObj);
    }

    console.log(resultsArray); // or `return` it instead of `console.log`, or however you want to display the results

}

function callSecondAPI(url) {
    const response = fetch(url);
    return response.json(); // parses JSON response into native JavaScript objects
    
}

displayResults(data.sources) // pass in the first array to the next function

它将传入来自第一个 API 请求的数据； 创建一个结果数组以将您指定的数据添加到其中； 遍历提供的数据，调用第二个 API，并将您想要的 3 个字段推送到 resultsArray； 然后将新的 resultsArray 数据返回给您。