如何将多个API调用响应传递给前端和循环

时间:2018-08-13 00:27:45

标签: javascript arrays node.js api promise

我是javascript新手,尝试在线查找答案,但被卡在这里。

尝试使用Google Places API的“承诺”功能获取多个地点的数据,然后仅提取所有地点的“评论”部分。 将结果呈现到前端后,我得到:

  

[对象对象],[对象对象],[对象对象],[对象对象],[对象对象],[对象对象],[对象对象],[对象对象],[对象对象],[对象对象],[对象对象],[对象对象],[对象对象],[对象对象],[对象对象]

如果我使用console.log(results),则可以在终端中看到结果,但是在前端只能得到多个[object Object]。

app.js文件:

var express = require("express");
var app = express();
var request = require("request");
var bodyParser = require("body-parser");

//APP CONFIG
app.set("view engine", "ejs");
app.use(express.static("public"));
app.use(bodyParser.urlencoded({extended: true}));


// fakes request
function request(url, cb) {
  setTimeout(() => cb(null, 200, `{"Search": "success for ${url}" }`), 200)
}


let locations = ['ChIJd5X4zalZwokR8HwFrpqhZTM', 'ChIJUQgmLP5YwokRaXhfzBfk0wY', 'ChIJ34UGSqNZwokR8PYj2UiNZ2k']

// promisesArray will hold all the promises created in map()
app.get("/resultspage", function(req, res){
  let promisesArray = locations.map(location => {
  // make a new promise for each element of cities
  return new Promise((resolve, reject) => {
    let url = 'https://maps.googleapis.com/maps/api/place/details/json?key=APIKEYHERE&placeid=' + location
    request(url, function(error, response, body) {
      if (error) {
        reject(error);
      }
      var data = JSON.parse(body)
      var results = data.result.reviews;
      // resolve once we have some data
      resolve(results);
    });
  })
})
Promise.all(promisesArray)
  .then(function(results) {
    console.log(results)
      res.render("resultspage", {data: results});
  })
  .catch(function(error) {
    console.log(error)

  })
})


app.listen(process.env.PORT, process.env.IP, function(){
    console.log("app has started!!");
});

resultspage.ejs文件

<h1>Results Page</h1>

<%= data %>

以下是指向Google地方信息网页的链接: https://developers.google.com/places/web-service/details

谢谢!

2 个答案:

答案 0 :(得分:0)

在线

<%= data %>

EJS期望两个括号之间有一个字符串。您传递给它的是一个对象数组,该对象被字符串化以生成您所看到的内容。相反,您可以尝试将其解压缩,直到将所需的字段放入一个巨大的字符串中为止:

<%= data.map(review => review.author_name).join(',') %>

(或者,自然地,您可以使我的map-and-join函数更加复杂,以添加HTML标签和样式。)

答案 1 :(得分:0)

您可以直接使用request-promise而不是将回调转换为Promise。

var rp = require('request-promise');

app.get("/resultspage", function (req, res) {
    Promise.all(locations.map(location => rp('https://maps.googleapis.com/maps/api/place/details/json?key=APIKEYHERE&placeid=' + location)))
        .then(function (results) {
            results = results.map(result => {
                var data = JSON.parse(body)
                return data.result.reviews;
            });
            console.log(results)
            res.render("resultspage", {
                data: JSON.stringify(results)
            });
        })
        .catch(function (error) {
            console.log(error)
        })
})