javascript - 在 promise 回调中发送数组响应，但响应为空

Question

我正在从谷歌地图生成图像。这是一个 promise 返回方法，因为我只是循环结果并将结果存储到“then”回调内的新数组变量中，但响应在那里，但没有显示在浏览器中。

在我的谷歌地图生成图像功能之前，它不是 promise 返回函数，而是将响应发送到浏览器，但它是 promise 返回函数，因此响应在那里，但 Controller 方法没有向浏览器发送响应。

  static providerMapImageGenerator(req, res) {
    let providerArr = []
    ProvidersRepository.getProviderInfoForMapImage()
      .then(providers => {
        providers.forEach(provider => {
          // Generating image against each entr
          MapGenerator.getMapImage(
            provider.latitude,
            provider.longitude,
            provider.name,
            provider.providerId
          )
            .then(res => {
              // Saving record after each entry
              ProviderMap.create({
                providerId: provider.providerId,
                url: res.Location
              })
              // Adding new array for response
              providerArr.push({
                id: provider.providerId,
                url: res.Location,
                lat: provider.latitude,
                long: provider.longitude,
                name: provider.name
              })
            })
            .catch(err => console.log(err, "err in generating image"))
        })
        // Sending final response against all generated entries to user
        res.send(providerArr) // this is going blank to the browser
      })
      .catch(error => {
        // Sending error response if fails
        res.send(error)
      })
  }

我需要在浏览器中显示providerArr响应。

Answer 1

您的循环无需等待 promise 结果即可进行。您可以使用 async/await 和 for of 循环来执行您想要的操作，如下所示:

ProvidersRepository.getProviderInfoForMapImage()
  .then(async (providers) => {
    for(provider of providers){
      // Generating image against each entr
      let image = await MapGenerator.getMapImage(
        provider.latitude,
        provider.longitude,
        provider.name,
        provider.providerId
      );
      // Saving record after each entry
      await ProviderMap.create({
         providerId: provider.providerId,
         url: res.Location
      });
       // Adding new array for response
      providerArr.push({
          id: provider.providerId,
          url: res.Location,
          lat: provider.latitude,
          long: provider.longitude,
          name: provider.name
         });
     })
    }
    // Sending final response against all generated entries to user
    res.send(providerArr) // this is going blank to the browser
  })
  .catch(error => {
    // Sending error response if fails
    res.send(error)
  })

PS:未测试