【API接口工具】postman-可视化响应

原创已于 2025-08-22 14:53:34 修改 · 1.6k 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#postman #postman设置超时时间 #postman 设置超时时间 #postman超时时间 #postman 超时时间 #postman设置请求超时时间 #postman scratch

于 2022-05-30 23:21:43 首次发布

Postman 专栏收录该内容

23 篇文章

订阅专栏

本文介绍了如何使用Postman的Visualizer功能来可视化API请求的响应数据。通过编写Handlebars模板代码，可以将JSON响应转换为HTML表格，方便查看和理解。此外，还提到了SmartApi，一个国内开发者开发的API调试工具，作为Postman的替代品，具有基本的API调试和管理功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Postman Visualizer提供了一种可编程的方式来直观地表示您的请求响应。添加到请求测试的可视化代码将呈现在响应正文的“可视化”选项卡中，以及“漂亮”、“原始”和“预览”选项。

可视化响应数据

{
    "code": 10000,
    "msg": "success",
    "data": {
        "token": "7b2f7d76b95a4dc2271ed7ace60da0d1"
    }
}

要可视化您的响应数据，请将代码添加到请求的Pre-request或Tests 脚本。该pm.visualizer.set()方法会将您的可视化工具代码应用于数据，并在请求运行时将其呈现在“可视化”选项卡中。

添加可视化代码

该pm.visualizer.set()方法接受Handlebars模板字符串作为其第一个参数。第二个参数是要使用模板显示的数据。继续阅读以了解如何构建 Handlebars 模板并将数据传递给它。

呈现 HTML

要查看基本的可视化工具，请在 Postman 中打开以下请求：

示例端点使用具有以下 JSON 响应正文结构token进行响应：

{
    "code": 10000,
    "msg": "success",
    "data": {
        "token": "7b2f7d76b95a4dc2271ed7ace60da0d1"
    }
}

可视化工具代码创建一个 Handlebars 模板，此脚本在请求Tests中运行：

var template = `
    <table bgcolor="#FFFFFF">
        <tr>
            <th>token</th>
            
        </tr>

            <tr>
                <td>{{response.data.token}}</td>
            </tr>
    </table>
`;

// Set visualizer
pm.visualizer.set(template, {
    // Pass the response body parsed as JSON as `data`
    response: pm.response.json()
});

该template变量是之前创建的模板字符串。传递的第二个参数是一个定义为response属性的对象——这是模板在{{response.data.token}}循环中期望的变量。分配给该response属性的值是解析为对象的请求的响应 JSON 数据。

查看可视化

在这里插入图片描述

可视化工具 API

您可以从Postman API访问可视化工具。该pm.visualizer.set()方法接受三个参数：

layout（必需）：第一个参数是Handlebars HTML 模板字符串。
data（可选）：第二个参数是可以绑定到模板的数据。可以在模板中访问该对象的属性。
options（可选）：第三个参数options是Handlebars.compile(). 您可以使用它来控制 Handlebars 如何编译模板。
Postman 使用您传递的信息pm.visualizer.set()在可视化工具的沙箱中呈现 HTML 页面。您将在Visualize选项卡中看到这个呈现的 HTML 页面。该layout字符串被插入到呈现页面的中，包括模板包含的任何 JavaScript、CSS 和 HTML。