收到“错误：发送后无法设置标头。”进行多个 API 调用时

Question

我正在重构一个需要进行多个 API 调用的 Express 项目。我目前有 9 个单独的函数来进行每个单独的 API 调用，然后在每个 API 调用完成后将其设置为 res.locals。

我创建了一个数组，其中包含我需要访问的所有 API URL，然后我有一个函数可以遍历该数组以进行所有 fetch 调用。但是，我在设置标头时遇到了问题，以便 JSON 数据通过，因为我收到以下消息：

Error: Can't set headers after they are sent.

根据我设置控制器的方式，我可以获取控制器标头和第一个 API 响应以在我的页面上呈现，或者我只获取控制器标头来呈现。鉴于我的情况，我无法找到解决方案，并且想知道是否有人建议纠正这个问题。我已经粘贴了我认为应该足以解决问题的代码，但是如果我可以提供其他任何内容，请告诉我。

API-Helper 文件（进行 API 调用的地方）：

function getData(req, res, next) {
    for (let i = 0; i < links.length; i ++) {
        fetch(links[i])
        .then(res => res.json())
        .then(fetchRes => {
            res.locals.i = fetchRes
            next()
        })        
        .catch(err => {
            res.json({err})
        })
    }
}

以下是从第一个 API 调用和标头中获取数据的控制器：

for (let i = 0; i < 10; i ++) {  
cryptoController.sendApiData = (req, res) => {          
    res.json({
        message: 'data returned for crypto',            
        i: res.locals.i
    })  
    }
}

下面是控制器只返回头部时：

for (let i = 0; i < 10; i ++) {  
cryptoController.sendApiData = (req, res) => {          
    res.json({
        message: 'data returned for crypto',            
        i: res.locals[i]
    })  
    }
}

更新以显示更多代码：

完整的控制器：

// import model
const Crypto = require('../models/Crypto')

// initiate controller object
const cryptoController = {}

// find latest cap coin entry
cryptoController.latest = (req, res, next) => {
    Crypto.findRecent()
    .then(crypto => {
        res.json({
            message: 'retrieved entry',
            data: { crypto }
        })
    }).catch(next)
}

// send api data
// for (let i = 0; i < 10; i ++) {  
cryptoController.sendApiData = (req, res) => { 
    console.log(res.locals)         
    res.json({
        message: 'data returned for crypto',            
        i: res.locals.i
    })  
    // }
}

// create new entry
cryptoController.create = (req, res) => {
    console.log(req.body, ' req.body from cryptoController#create')
    Crypto.create({
        // time made
        time_made: Date.now(),
        // crypto data
        usd: req.body.usd,
        us_high: req.body.us_high,
        us_low: req.body.us_low,
        eur: req.body.eur,
        eur_high: req.body.eur_high,
        eur_low: req.body.eur_low,
        trades: req.body.trades,
        one_hour: req.body.one_hour,
        one_day: req.body.one_day,
        seven_days: req.body.Seven_days,
        crypto_id: req.body.crypto_id
    })
}


module.exports = cryptoController

路线文件：

// import dependencies
const express = require('express')
const cryptoController = require('../controllers/crypto-controller')
const cryptoHelpers = require('../services/crypto-helpers')

// set router variable
const cryptoRouter = express.Router()

// set routes to fetch and store API data
cryptoRouter.post('/crypto', cryptoHelpers.getData, cryptoController.create)
cryptoRouter.get('/crypto', cryptoHelpers.getData, cryptoController.sendApiData)

module.exports = cryptoRouter;

引入路由的服务器文件：

const cryptoRouter = require('./routes/crypto-routes')
app.use('/', cryptoRouter)

模型文件没有被命中，因为此时没有任何东西被插入到数据库中。

Answer 1

好的，这里有一个问题：

function getData(req, res, next) {
    for (let i = 0; i < links.length; i ++) {
        fetch(links[i])
        .then(res => res.json())
        .then(fetchRes => {
            res.locals.i = fetchRes
            next()
        })        
        .catch(err => {
            res.json({err})
        })
    }
}

您在循环中调用next()。完成所有操作后，您只能调用一次next()。由于这些服务器端 fetch() 调用看起来可以并行完成，因此您可以使用 Promise.all() 查看它们何时全部完成。

那么，您在将数据放入res.locals 时也会遇到问题。您只是在循环中分配相同的 res.locals.i 变量，这并没有真正做任何特别有用的事情。

我认为您将不得不为数据使用一个数组，然后更改稍后在路由链中使用res.locals 的代码以访问该数组。

function getData(req, res, next) {
    let promises = links.map(function(link) {
        return fetch(link).then(res => res.json())
    });
    Promise.all(promises).then(results => {
        res.locals.data = results;    // res.locals.data is an array of link json
        next();
    }).catch(err => {
        res.status(500).json({err});
    });
}

然后，在您的 .get() 路由处理程序中，我不知道您要达到的结果类型的确切原因，但是要返回结果数组，您可以执行以下操作：

cryptoController.sendApiData = (req, res) => { 
    console.log(res.locals.data)         
    res.json({
        message: 'data returned for crypto',            
        data: res.locals.data
    }); 
}