如何同時從多個 api 獲取數據並將它們顯示在我的網頁上？

Question

我正在構建一個新聞/博客網站，它從外部 api 獲取數據並將其顯示到網頁上。到目前為止，我已經設法從一個 api 呈現數據，但我的網頁中還有一個運動部分，需要我獲取數據來自另一個這樣的 api，但我不知道如何做到這一點，而節點不會向我拋出錯誤。 下面是我的 NODE.JS 代碼-

//jshint esversion: 6

const express = require('express');
const https = require('https');
const bodyParser = require("body-parser");
const ejs = require("ejs");
const app = express();
const port = 3000;


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


app.get('/', (req, res) => {
const sporturl ="https://timesofindia.indiatimes.com/feeds/newsfeed/33187923.cms? 
feedtype=sjson";
const newsurl = "https://timesofindia.indiatimes.com/feeds/newsdefaultfeeds.cms? 
feedtype=sjson#";
https.get(newsurl, function(response){
    var data;
response.on("data", function(chunk) {
    if (!data) {
        data = chunk;
    } else {
        data += chunk;
    }
});

response.on("end", function() {
    const fulldata = JSON.parse(data);
            let mainHeader = fulldata.NewsItem[0].HeadLine;
            let mainheaderurl = fulldata.NewsItem[0].WebURL;
            let mainCaption = fulldata.NewsItem[0].Caption;
            let mainUrl = fulldata.NewsItem[0].Image.Photo;
            let featured = fulldata.NewsItem[1].HeadLine;
            let featuredlink = fulldata.NewsItem[1].WebURL;
            let featuredimg = fulldata.NewsItem[1].Image.Photo;


    res.render("index",{
                mainHeader: mainHeader,
                headerUrl: mainheaderurl,
                mainCaption: mainCaption,
                imgUrl: mainUrl,
                featured:featured,
                featuredlink:featuredlink,
                featuredimg:featuredimg,
            });
     });

     });
  
     });

     app.listen(port, () => {
     console.log(`server started on port 3000`);
     });
    // api key: ff827a803d4540f5814864d207fd23b5
    // const mainHeadingUrl = "https://newsapi.org/v2/everything?q=tesla&from=2021- 
    05-26&sortBy=publishedAt&apiKey=ff827a803d4540f5814864d207fd23b5";

Answer 1

我會使用Fetch API （對於 nodeJS，你可以使用node-fetch ）、 async/await和Promise.all來收集數據。

將一些 API 調用推送到數組中。 它們將作為承諾返回（數據將（或不會）返回的承諾）。 Promise.all一直等到所有這些承諾都解決了，然后將數據輸出為一個數組，然后您可以對其進行迭代。

 function mockApi(n) { return new Promise((res, rej) => { setTimeout(() => res(n), 2000); }); } // Here you would bundle up your fetch calls // eg: fetch(url) // I'm using mockApi as a convenience const fetchCalls = [mockApi(1), mockApi(2), mockApi(3)]; async function getData() { const data = await Promise.all(fetchCalls); console.log(data); } getData();

Answer 2

這是回答here。

nodejs - 如何承諾 http.request？ 拒絕被叫了兩次

然后您可以使用那里描述的方法並使用 Promise.all 並獲得所需的結果