Postman 可视化 - 如何在简单的 HTML img 标签中呈现图像 URL答案

【问题标题】：Postman visualization - How to render image URL in simple HTML img tagPostman 可视化 - 如何在简单的 HTML img 标签中呈现图像 URL
【发布时间】：2020-08-05 10:49:14
【问题描述】：

在 Postman 桌面中，我正在尝试渲染 Bing 图像搜索返回的图像。（查询本身有效。）

我收到了来自 Bing API 查询的以下响应，在桌面 Postman 中格式化为 JSON：

{
    "_type": "Images",
    "instrumentation": {
        "_type": "ResponseInstrumentation"
    },
    "readLink": "https://arama.cognitiveservices.azure.com/api/v7/images/search?q=jfk",
    "webSearchUrl": "https://www.bing.com/images/search?q=jfk&FORM=OIIARP",
    "queryContext": {
        "originalQuery": "jfk",
        "alterationDisplayQuery": "jfk",
        "alterationOverrideQuery": "+jfk",
        "alterationMethod": "AM_JustChangeIt",
        "alterationType": "CombinedAlterations"
    },
    "totalEstimatedMatches": 910,
    "nextOffset": 1,
    "currentOffset": 0,
    "value": [
        {
            "webSearchUrl": "https://www.bing.com/images/search?view=detailv2&FORM=OIIRPO&q=jfk&id=23716A341D61409DE7D5D19724937DD5340BBB06&simid=608036166471451494",
            "name": "Reactions to the assassination of John F. Kennedy - Wikipedia",
            "thumbnailUrl": "https://tse1.mm.bing.net/th?id=OIP.9dNMVRmk1a3edFYrwzcFeQHaIi&pid=Api",
            "isFamilyFriendly": true,
            "contentUrl": "https://upload.wikimedia.org/wikipedia/commons/7/70/Jfk2.jpg",
        }
    ]
}

在 Tests 选项卡中，我有以下脚本：

var template = `<img src="{{res.value[0].contentUrl}}">`;
pm.visualizer.set(template, {
    res: pm.response.json()
});

这会导致 Visualizer 面板中显示以下错误：

第 1 行解析错误：

我已经使用 w3schools TryIt 在线小提琴单独测试了参考 res.value[0].contentUrl，我知道它可以正常工作并正确生成有问题的 URL。

我在这里做错了什么，如果是你，你会如何调试它？谢谢。

【问题讨论】：

标签： postman handlebars.js

【解决方案1】：

这样的东西应该会为你显示图像：

let template = `
<img src="{{res.value.0.contentUrl}}">
`

pm.visualizer.set(template, { 
    res: pm.response.json()
})

我在这里模拟了响应，但它会以相同的方式工作。

把手处理循环/访问数组对象的方式不同，所以[0] 在这里不起作用。

你也可以用它来做同样的事情：

let template = `
{{#each res.value}}
<img src="{{contentUrl}}">
{{/each}}
`

【讨论】：

非常感谢。但是value.0 语法是什么？这对我来说是新的。为什么value[0] 不起作用？
这是车把制造商的问题......?
好吧，我明白了，这是 Handlebars 的特质。不能感谢你。问候。
我想我很久以前也遇到过同样的问题，并四处寻找这个答案：D stackoverflow.com/a/8044689/6028443
是的，当我在搜索中添加“车把”时，我也独立地找到了这个答案。另外，我刚刚读到这本书：Building Isomorphic JavaScript Apps (Srimpel) [2016]，沃尔玛在其网站上不再使用 Handlebars。 books.google.com.tr/…