在Apifox中，使用后置脚本显示响应结果reponse中的base64图片

最新推荐文章于 2024-05-22 11:34:06 发布

菜鸟分享录

最新推荐文章于 2024-05-22 11:34:06 发布

阅读量1.5k

点赞数 1

分类专栏： stable diffusion webui apifox 文章标签： javascript 前端 json

本文链接：https://blog.csdn.net/qq_40600379/article/details/131142002

版权

stable diffusion webui 同时被 2 个专栏收录

4 篇文章 0 订阅

订阅专栏

apifox

1 篇文章 0 订阅

订阅专栏

背景

在使用Apifox去请求有图片的接口时，我想要请求成功的同时，可以显示出来图片，这个时候就开始百度找官方文档。最终发现可以使用后置脚本显示reponse中的图片。

方案

如下图所示，接口请求成功后，返回的json结构为：

{
	"images":[],
	"parameters":{},
	"info":""
}

在这里插入图片描述

1.添加后置脚本

此时，我想要请求成功后，可以看到images中的图片，那我该如何操作呢？
答案是使用【自定义后置脚本】。在apxfox工具中找到【后置操作】->【添加后置操作】->【自定义脚本】。
在这里插入图片描述

2.添加读取代码

将下述代码粘贴到工具中，以下已对参数做详细介绍，如下：


//pm是apifox的内置对象，通过这个对象，可以获取到请求结果（response）
//通过.json()函数，获取到响应体中返回的json数据
let res = pm.response.json()

//定义一个模板，这个模板存的是
const template = `<html><img src="{{imgTemplate}}" /></html>`;

//构建img标签能识别的base64 url，注：如果接口返回的base64 url没有【data:image/png;base64,】则需要拼接进去，否则出不来图片。
//因接口返回的是一个数组，这里打印打一张图片
let img= "data:image/png;base64,"+ res.images[0];
//console.log(img) //打印

// 设置 visualizer 数据。
//template：模板，上面const定义的template。
// {imgTemplate: img}，imgTemplate对应的是template中src的值；img指的是上述定义的img base64 url
pm.visualizer.set(template, {
    imgTemplate: img
})

在这里插入图片描述

3.运行效果

成功请求接口后，点击【Visualize】，可以看到成功显示图片
在这里插入图片描述

菜鸟分享录

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
在Apifox中，使用后置脚本显示响应结果reponse中的base64图片

在使用Apifox去请求有图片的接口时，我想要请求成功的同时，可以显示出来图片，这个时候就开始百度找官方文档。最终发现可以使用后置脚本显示reponse中的图片。答案是使用【自定义后置脚本】。在apxfox工具中找到【后置操作】->【添加后置操作】->【自定义脚本】。此时，我想要请求成功后，可以看到images中的图片，那我该如何操作呢？成功请求接口后，点击【Visualize】，可以看到成功显示图片。
复制链接

扫一扫