Apifox可视化数据响应预览pdf

预览base64的PDF文件

1. 后端返回的数据格式如下：

{
    "code": "SUCCESS",
    "message": null,
    "datas": [
        [
			"base64PDF"
        ]
    ]
}

2. 在Apifox中设置响应数据可视化

其实就是在Apifox中设置后置操作，添加自定义脚本
通过pm.response.json()获取后端响应的Json数据

具体脚本如下：

// 获取接口返回的JSON数据
const jsonData = pm.response.json();

try {
    // 1. 确认字段名是否为后端实际返回的字段
    const base64Data = jsonData.datas[0][0]; // 注意层级结构是否匹配

    // 调试：验证数据存在性
    if (!base64Data || typeof base64Data !== 'string') {
        throw new Error("Base64数据不存在或格式错误");
    }

    // 2. 清理Base64字符串（Java生成的Base64通常无换行，但保险起见）
    const cleanBase64 = base64Data.replace(/\s/g, '');

    // 3. 构造Data URL（直接内联Base64）
    const dataUrl = `data:application/pdf;base64,${cleanBase64}`;

    // 4. 构建预览HTML
    const iframeHtml = `
        <iframe 
            src="${dataUrl}" 
            width="100%" 
            height="600px" 
            frameborder="0"
            style="border: 1px solid #ddd;"
        ></iframe>
    `;

    // 设置可视化输出
    pm.visualizer.set(iframeHtml);

    // 调试：输出关键信息
    console.log("Base64特征校验:", cleanBase64.substring(0, 10));
    console.log("Data URL长度:", dataUrl.length);

} catch (error) {
    pm.visualizer.set(`
        <div style="color:red; padding: 20px;">
            PDF预览失败: ${error.message}
            <div style="color:grey; font-size: 12px;">请检查控制台日志</div>
        </div>
    `);
    console.error("详细错误:", error);
}