javascript - 从 promise 对象(服务器端)获取值到客户端 index.html

Question

我想知道如何将 promise 对象转换为字符串。我正在调用一个返回 XML 对象的 API，使用 axios 和转换进行模板化。我的应用程序使用 Express 作为应用程序框架。我在 promise 的 .then 中有一个 console.log，它在命令行的控制台中返回数据。

但是，当我想在我的 index.html 中处理这些数据时，我会在控制台中返回一个 promise 对象。我如何才能将 promise 对象中数据的“封面”部分放入我的 index.html 中？

服务器控制台日志记录:

浏览器的控制台登录:

项目文件:

./routes/index.js

router.get('/metadata', function(req,res,next){
    var info = metadata.getMetadataOnix(params);
    console.log('info:'+info);
    res.json({ test : info });
});

index.html 包含一个 ajax get 调用 document.ready

 $.get("/metadata", function(data){
      // call to metadata
});

metadata-onix.js - 我调用 api 的文件

const axios = require('axios');
const transform = require('camaro');

exports.getMetadataOnix = function (id) {
    const template = {
        uitgever: '/Product/PublishingDetail/Publisher/PublisherName/text()',
        cover: "./Product/CollateralDetail/SupportingResource[ResourceContentType=01]/ResourceVersion/ResourceLink/text()"
    }

    return axios({
        method: 'get',
        url: 'https://someapi/getMetadataOnix/'+id,
        transformResponse: [function (data) {
            "use strict";
            data = transform(data, template);
            return data;
        }],
    }).catch(function(err){
        // log errors
        console.log('error:'+err);
    }).then(function(resp){
        var cover = '';
        cover = resp.data.cover;
        console.log('Cover from book:'+JSON.stringify(resp.data.cover));
        return cover;
    });
}

Answer 1

这里有一些问题。与您的问题相关的主要问题是您错误地使用了 getMetadataOnix 的结果。它返回一个 promise ，因此您必须使用该 promise 。一种方法是通过 then:

router.get('/metadata', function(req,res,next){
    var info = metadata.getMetadataOnix('9789024576791').then(function(info) {
        console.log('info:'+info);
        res.json({ test : info });
    });
});

不要担心这意味着您的 get 回调会在您发送响应之前返回；这不是问题，Express 就是为此而设计的。

另外，关于错误处理的两个问题:

首先，您要将拒绝 转换为具有/undefined 的解决方案:

exports.getMetadataOnix = function (id) {
    // ...

    return axios({
        // ...
    }).catch(function(err){           // <===
        // log errors                 // <===
        console.log('error:'+err);    // <===
    }).then(function(resp){
        var cover = '';
        cover = resp.data.cover;
        console.log('Cover from book:'+JSON.stringify(resp.data.cover));
        return cover;
    });
}

请记住，then 和 catch 创建处理程序链，链中的每个步骤都会转换通过它的值。通过将 .catch 放在您拥有的位置，您可以使用从 catch 处理程序返回的任何值将拒绝转换为解决方案。由于您没有明确返回一个，因此它最终成为 undefined。

由于您的 then 处理程序不检查它，因此当您尝试在其中使用 resp.data.cover 时它会抛出错误，因为 resp 将是 undefined。有趣的是，这会将决议转换回拒绝(从未处理过的)。

相反，根本不要在那里处理错误。 promise 的规则之一是您或者将 promise 链返回给调用者，或者处理错误，但不能同时进行。 (您可能会将错误转换为另一种错误，但除非您确实可以解决问题，否则不会将其转换为解决方案。)

改为在您的 get 回调中处理它。所以:

exports.getMetadataOnix = function (id) {
    const template = {
        uitgever: '/Product/PublishingDetail/Publisher/PublisherName/text()',
        cover: "./Product/CollateralDetail/SupportingResource[ResourceContentType=01]/ResourceVersion/ResourceLink/text()"
    }

    return axios({
        method: 'get',
        url: 'https://someapi/getMetadataOnix/'+id,
        transformResponse: [function (data) {
            "use strict";
            data = transform(data, template);
            return data;
        }],
    // No .catch here
    }).then(function(resp){
        var cover = '';
        cover = resp.data.cover;
        console.log('Cover from book:'+JSON.stringify(resp.data.cover));
        return cover;
    });
}

和

router.get('/metadata', function(req,res,next){
    var info = metadata.getMetadataOnix(params)
        .then(function(info) {
            console.log('info:'+info);
            res.json({ test : info });
        })
        .catch(function(err) {
            // Log error, etc.
            // Use `res.send` or `res.json` or similar to send error reply
        });
});