试图从包含API地址的数组字符串中获取数据。

Question

我想从包含API的数组中获取数据，问题是数组中api的数量有时与其他数组不同。

{
"name": "CR90 corvette", 
"model": "CR90 corvette", 
"manufacturer": "Corellian Engineering Corporation", 
"cost_in_credits": "3500000", 
"length": "150", 
"max_atmosphering_speed": "950", 
"crew": "30-165", 
"passengers": "600", 
"cargo_capacity": "3000000", 
"consumables": "1 year", 
"hyperdrive_rating": "2.0", 
"MGLT": "60", 
"starship_class": "corvette", 
"pilots": [], 
"films": [
    "http://swapi.dev/api/films/1/", 
    "http://swapi.dev/api/films/3/", 
    "http://swapi.dev/api/films/6/"
], 
"created": "2014-12-10T14:20:33.369000Z", 
"edited": "2014-12-20T21:23:49.867000Z", 
"url": "http://swapi.dev/api/starships/2/"} 

在上面的json代码中，字段是我所指的数组，例如，在这个数据中，胶片有3个API地址形式的数据，而在另一个数据中，它们有2个API地址数据等等。

我的问题是如何像那样调用数组中的API，以及如何同时调用内部的所有API地址？

谢谢你有时间读这篇文章，可敬的。

Answer 1

您可以使用async await &然后使用fetch进行api调用。

​

let data = {
  "name": "CR90 corvette",
  "model": "CR90 corvette",
  "manufacturer": "Corellian Engineering Corporation",
  "cost_in_credits": "3500000",
  "length": "150",
  "max_atmosphering_speed": "950",
  "crew": "30-165",
  "passengers": "600",
  "cargo_capacity": "3000000",
  "consumables": "1 year",
  "hyperdrive_rating": "2.0",
  "MGLT": "60",
  "starship_class": "corvette",
  "pilots": [],
  "films": [
    "https://swapi.dev/api/films/1/",
    "https://swapi.dev/api/films/3/",
    "https://swapi.dev/api/films/6/"
  ],
  "created": "2014-12-10T14:20:33.369000Z",
  "edited": "2014-12-20T21:23:49.867000Z",
  "url": "http://swapi.dev/api/starships/2/"
};

async function fncGetResult(arr) {
  let val = [];
  for (let i = 0; i < arr.length; i++) {
    const res = await fetch(arr[i]).then(d => d.json()).then(d =>d);
    val.push(res)
  };
  return val;
}

fncGetResult(data.films).then((result) => {
  console.log(result)
})

​

Answer 2

有很多方法可以做到这一点。下面的代码快速地连续发送对电影数据的请求，然后使用Promise.all在继续之前等待它们全部返回。请注意，如果一个请求抛出异常，Promise.all将快速失败。如果你想慢慢来，可以使用Promise#allSettled。

const data = { films: [ 'http://example.com/1', 'http://example.com/2', 'http://example.com/3' ]}
const { films: urls } = data
const promises = []

for(let url of urls)
  promises.push(fetch(url))

Promise.all(promises)
  .then((filmDetails) => {
    for(let details of filmDetails)
      console.log(filmDetails)
  })

Answer 3

您可以从包map中使用函数异步。

异步是一个实用模块，它为使用异步JavaScript提供了直接、强大的功能.虽然最初设计用于Node.js，并且可以通过npm异步进行安装，但它也可以直接在浏览器中使用。

第一个参数是您的数组，您可以从对象中解构它；第二个参数是调用您的api或任何其他异步函数(这里使用的是axios包，但是您可以使用节点本地包http调用axios)，第三个参数是一个回调函数，它可以为您提供成功操作的检查。

import async from 'async'
import axios from 'axios'

const obj = {
    name: "CR90 corvette", 
    films: [    
        "http://swapi.dev/api/films/1/",  
        "http://swapi.dev/api/films/3/", 
        "http://swapi.dev/api/films/6/"
    ]
}

const { films } = obj

const responses = async.map(
    films, 
    (url, callback) => {
        try {
            axios.get(url)
            callback(null, 'OK')
        } catch (error) {
            callback(error)
        }
    }, (error, result) => {
        if (error) {
            console.log(error)
        }
        console.log(result)
    }
)