如何同时呼叫api？

Question

我有一个异步函数可以同时调用我的 API，但是 Promise.all() 在我大约 2 秒后解决（一个请求在大约 200 毫秒内解决）。这意味着我的请求一个接一个地解决，即使它们开始是异步的，也不会同时解决。

// don't run in client side of browser - CORS
    async asyncData () {
      axios.interceptors.request.use(config => {
        console.log('Start: ', new Date)
        return config
      })
      const promise1 = axios.get('https://jsonplaceholder.typicode.com/comments')
      const promise2 = axios.get('https://jsonplaceholder.typicode.com/posts')
      const promise3 = axios.get('https://jsonplaceholder.typicode.com/todos')
      const promise4 = axios.get('https://jsonplaceholder.typicode.com/users')
      const promise5 = axios.get('https://jsonplaceholder.typicode.com/photos')
      const promise6 = axios.get('https://jsonplaceholder.typicode.com/photos')
      const promise7 = axios.get('https://jsonplaceholder.typicode.com/photos')
      const promise8 = axios.get('https://jsonplaceholder.typicode.com/photos')
      const promise9 = axios.get('https://jsonplaceholder.typicode.com/photos')
      await Promise.all([
        promise1,
        promise2,
        promise3,
        promise4,
        promise5,
        promise6,
        promise7,
        promise8,
        promise9,
      ]).then(data => {
        console.log('End: ', new Date)
      })
    }

我很困惑，因为下面这段代码在 4000 毫秒内解析，这意味着它们同时开始并在最大超时结束后解析 - 4000。这次 Promises 没有在链中解析

    async asyncData () {
      function startTimer (time) {
        return new Promise(function (resolve) {
          setTimeout(function () {
            resolve()
          }, time)
        })
      }

      console.time('Timer')
      Promise.all([
        startTimer(1000),
        startTimer(4000),
        startTimer(2000),
      ]).then(function () {
        console.timeEnd('Timer')
      })
    }

P.S。抱歉英语不好¯\_(ツ)_/¯

Answer 1

你的代码没问题。问题是大量并发的网络请求，尤其是对同一端点发出的请求，通常比只发出一个请求需要更长的时间来解决 - 即使你并行发出所有这些请求.这是来自 Chrome devtools 请求的屏幕截图：

如您所见，所有请求都立即被触发，但后续请求需要更长的时间才能解决。这通常是由端点（此处为 jsonplaceholder）限制请求引起的。

如果您向 自己的 服务器发出请求，并且您的服务器和脚本源都有足够的带宽、连接性并且没有节流，那么并行请求至少会解析接近同一时间。

（浏览器可能会限制任何时候允许的连接总数，操作系统也是如此）

如何同时呼叫api？

How to make a simultaneous call to api?

javascript

es6-promise