Express.js извлечение информации из внешнего API и рендеринг на сайт

Question

Express.js извлечение информации из внешнего API и рендеринг на сайт

1

Я как бы зациклился на том, как справиться с этим решением. Структуры, с которыми я сейчас работаю, - это node.js и express.js с мопсом для просмотра/рендеринга html. То, что я пытаюсь сделать, представляет собой одну страницу и использует значения из отдельных запросов HTTP-получения с разных сайтов. Я хочу, чтобы express/node запрашивал внешний api и отображал представление, которое я буду получать с помощью ajax-вызова с javascript на стороне клиента. Я выяснил, что вызов ajax с использованием jquery с клиентской стороны. Моя проблема заключается в том, как обрабатывать несколько внешних вызовов API и помещать результаты в объект для рендеринга в моем мопс-представлении. Я не уверен, что лучше всего выполнить это правильно. Создать модель? Кроме того, как мне обрабатывать асинхронные HTTP-запросы? Использовать обещания? Я новичок в узле и javascript, поэтому я пытаюсь понять, какие лучшие соглашения использовать. Я надеюсь это имеет смысл.

Спасибо!!!!

apiInfoModel.js

var apiCallInfo = {
    apiInfo1: APIDATA
    apiInfo2: APIDATA2
    apiInfo3: APIDATA3
}

Должен ли я иметь функцию, которую я вызываю, которая вернет APIDATA?

apiCalls.js

function getApiInfo1() {
    return http.get
}

function getApiInfo2() {
    return http.get
}

function getApiInfo3() {
    return http.get
}

apiInfoController.js

var apiInfo = require('./apiInfoModel')
var apiCalls = require('./apiCalls')
exports.apiInfo = function(req,res,next){
    apiInfo.apiInfo1 = apiCalls.getApiInfo1
    apiInfo.apiInfo2 = apiCalls.getApiInfo2
    apiInfo.apiInfo3 = apiCalls.getApiInfo3
    res.render('apiInfo',{apiInfo: apiInfo})
}

fabricatedmind 27 июль 2017, в 16:29

Источник

0

Возможно, вам придется поместить вызов для apiInfo2 в качестве обратного вызова getApiInfo1 и так далее.
MNF 27 июль 2017, в 13:45

Теги:

javascript

node.js

express

1 ответ

Ещё вопросы

Возможно, вам придется поместить вызов для apiInfo2 в качестве обратного вызова getApiInfo1 и так далее.

shotor · Accepted Answer · 2017-07-27T12-03-00.000Z

Чтобы добавить комментарий к комментарию @Mauricio Noris Freire

apiCalls.js - добавление параметров callback

function getApiInfo1(cb) {
    return cb(http.get)
}

function getApiInfo2(cb) {
    return cb(http.get)
}

function getApiInfo3(cb) {
    return cb(http.get)
}

apiInfoController.js - установить ответные вызовы для доступа ко всем результатам

var apiInfo = require('./apiInfoModel')
var apiCalls = require('./apiCalls')
exports.apiInfo = function(req,res,next){

    apiCalls.getApiInfo1(function(info1Result) {
        apiCalls.getApiInfo2(function(info2Result) {
            apiCalls.getApiInfo3(function(info3Result) {
                // now you have all 3 results
                apiInfoResult = {
                    apiInfo1: info1Result,
                    apiInfo2: info2Result,
                    apiInfo3: info3Result
                }
                res.render('apiInfo', { apiInfo: apiInfoResult })
            });
        });
    });
}

Эта вложенная структура называется pyramid of doom потому что она продолжает расти с каждым асинхронным действием, которое вам нужно сделать. Его можно улучшить, используя библиотеку утилиты, такую как async https://www.npmjs.com/package/async:

    async.parallel( [
        apiCalls.getApiInfo1,
        apiCalls.getApiInfo2,
        apiCalls.getApiInfo3
    ], function(error, apiInfoResult) {
        apiInfoResult = {
            apiInfo1: info1Result,
            apiInfo2: info2Result,
            apiInfo3: info3Result
        }
        res.render('apiInfo', { apiInfo: apiInfoResult })
    });

Но в настоящее время рекомендуется использовать Promises. Это новый API представленный в JavaScript для обработки подобных ситуаций. Он доступен в последних версиях NodeJS. Это устраняет необходимость callbacks:

apiCalls.js - возвращает обещания вместо использования callbacks (это делает библиотека fetch)

require('whatwg-fetch')

function getApiInfo1() {
    return fetch()
}

function getApiInfo2() {
    return fetch()
}

function getApiInfo3() {
    return fetch()
}

apiInfoController.js - Используйте Promise.all.

    const [
        apiInfo1, 
        apiInfo2, 
        apiInfo3
    ] = Promise.all([apiCalls.getApiInfo1, apiCalls.getApiInfo2, apiCalls.getApiInfo3]);

    apiInfoResult = { apiInfo1, apiInfo2, apiInfo3 }
    res.render('apiInfo', { apiInfo: apiInfoResult })

Спасибо @ Morgh! Что касается того, как я создаю объекты, я всегда не уверен, делаю ли я это обычным способом, а не хакерствуем вместе. Я предполагаю, что подвергаю сомнению мой "образец"
Тогда вы можете проверить эту серию книг с открытым исходным кодом: github.com/getify/You-Dont-Know-JS . Они используют чистые правила кодирования, из которых вы должны научиться. Также в «асинхронной» книге есть больше информации обо всем, что я упомянул.