0

我不明白如何使用 axios 从 url 数组中获取数据。但我可以用fetch. 以下代码完美运行：

const url = 'https://vimeo.com/api/oembed.json?url='

async index(videoUrls = []) {
  try {
    const response = await Promise.all(
      //        videoUrls.map(videoUrl => axios.$get(`${url}${encodeURIComponent(videoUrl)}`))
      videoUrls.map(videoUrl => fetch(`${url}${encodeURIComponent(videoUrl)}`))
    )
    const results = await Promise.all(response.map(r => r.json()));
    return results;
  } catch (e) {
    console.error(e)
  }
}

当我拨打类似的电话时index(["https://vimeo.com/216850224", "https://vimeo.com/642263700"])，我的控制台会显示一个数组，其中包含 vimeo 必须给我的所有视频元详细信息。太棒了。

但是当我注释掉使用fetch和使用的那一行时axios，我得到了一个CORS错误。

从axios中的一堆url中获取数据的惯用方法是什么？

编辑

我也试过这个，但这个.all()功能似乎不存在

async index(videoUrls = []) {
  try {
    const response = await axios.all(videoUrls.map(videoUrl => `${url}${encodeURIComponent(videoUrl)}`));
    return response;
  } catch (e) {
    console.error(e)
  }
}
4

2 回答 2

0

Axios 版本会略有不同，因为它会自动解码并将响应正文嵌入到response.data属性中（不需要res.json()）

const baseUrl = "https://vimeo.com/api/oembed.json"

const index = async (videoUrls = []) => {
  // create an array of responses and wait for them to resolve
  const responses = await Promise.all(
    videoUrls.map(url => axios.get(baseUrl, { params: { url } })
  )

  // extract the `data` properties and return them as an array
  return responses.map(({ data }) => data)
}

何时提取response.data完全取决于您。它也可能看起来像这样

const index = (videoUrls = []) => Promise.all(
  videoUrls.map(async (url) => (
    await axios.get(baseUrl, { params: { url } })
  ).data)
)

仅供参考，您的fetch()版本也可能更干净一些......

const baseUrl = "https://vimeo.com/api/oembed.json"

const index = (videoUrls = []) => Promise.all(
  videoUrls.map(async (url) => {
    const params = new URLSearchParams({ url })
    const res = await fetch(`${baseUrl}?${params}`)
    if (!res.ok) { // check for bad response
      throw new Error(`${res.status}: ${await res.text()}`)
    }
    return res.json()
  })
)
于 2021-11-11T04:28:32.940 回答
0

您可以像下面这样轻松地做到这一点：

(async function getAll() {

  const axiosrequest1 = axios.get('https://jsonplaceholder.typicode.com/posts');
  const axiosrequest2 = axios.get('https://jsonplaceholder.typicode.com/posts');
  const axiosrequest3 = axios.get('https://jsonplaceholder.typicode.com/posts');

  const [res1, res2, res3] = await Promise.all([axiosrequest1, axiosrequest2, axiosrequest3]);
  console.log('request1', res1.data);
  console.log('request2', res2.data);
  console.log('request3', res3.data);
})();
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

于 2021-11-11T04:18:43.817 回答