微信小程序将后端返回的图片文件流解析显示到页面

news2024/11/27 10:18:39

说明

由于请求接口后端返回的图片格式不是一个完整的url,也不是其他直接能显示的图片格式,是一张图片

后端根据模板与二维码生成图片,返回二进制数据

返回为文件流的格式,用wx.request请求的时候,就自动解码成为了下面这样的数据数据格式,这样的数据没有办法直接赋值给url去显示。

 .

获取数据并处理

 getUserBanner() {
        let that = this
        wx.request({
          url: 'http://localhost:9080/test/addBanner',//后台地址
          method: 'GET',
          responseType: 'arraybuffer', //切换流返回类型
          data: {},
          success: (res) => {
            console.log("返回数据"+res.data) 
            if (res.data) {
                that.setData({
                userBanner : 'data:image/png;base64,' + wx.arrayBufferToBase64(res.data)  //赋值
              })
             
            } 
          }
        })
      },

1、设置 responseType: 'arraybuffer',将数据转为类似二进制数组的格式
2、 let url ='data:image/png;base64,'+wx.arrayBufferToBase64(res.data) 

后端返回数据,根据rpc调用返回的二维码生成图片模板

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1184329.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Spring的缓存机制-循环依赖

群公告 Java每日大厂面试题: 1、Spring 是如何解决循环依赖? 答案:三级缓存,简单来说,A创建过程中需要B,于是A将自己放到三级缓存里面,去实例化B,B实例化的时候发现需要…

智能AI系统ChatGPT系统源码+支持GPT4.0+支持ai绘画(Midjourney)/支持OpenAI GPT全模型+国内AI全模型

一、AI创作系统 SparkAi创作系统是基于OpenAI很火的ChatGPT进行开发的Ai智能问答系统和Midjourney绘画系统,支持OpenAI-GPT全模型国内AI全模型。本期针对源码系统整体测试下来非常完美,可以说SparkAi是目前国内一款的ChatGPT对接OpenAI软件系统。那么如…

交流负载发电机测试

交流负载发电机测试是一种常用的测试方法,用于评估发电机在负载条件下的性能和稳定性。测试过程中需要使用负载设备模拟实际负载,并通过测量电压、电流、功率等参数来评估发电机的输出能力和稳定性。 在进行测试之前,首先需要准备好测试设备和…

30张图详解IP地址网络知识

你们好,我的网工朋友。 IP地址是所有网络初级课程里最先涉及到的技术点,对于IP地址的合理规划是网络设计的重要环节,必须拿捏。 IP地址规划的好坏,影响到网络路由协议算法的效率,影响到网络的性能,影响到网…

短剧出海火爆,Flat Ads独家流量助泛娱乐赛道App迅速获客增长

10月26日,由扬帆出海主办的GICC2023 | 第四届全球互联网产业CEO大会正式圆满落幕,Flat Ads等出海企业应邀参加。 据悉,本届GICC深圳站邀请200CXO行业领袖、300各路优质厂商、1200全球互联网产业代表共聚一堂,聚焦短剧、游戏、泛娱…

最前端|如何使用Plausible实现页面埋点?

目录 一、业务背景 二、业务场景描述 三、解决方案 //如何集成 Plausible ? //如何监控特定功能使用情况? 什么是 MyEventName? //如何向自定义事件传递参数? 一、业务背景 随着公司自研产品的不断发展,对前端页面的监控和…

强力解决使用node版本管理工具 NVM 出现的问题(找不到 node,或者找不到 npm)

强力解决使用node版本管理工具 NVM 出现的问题(找不到 node,或者找不到 npm) node与npm版本对应关系 nvm是好用的Nodejs版本管理工具, 通过它可以方便地在本地调换Node版本。 2020-05-28 Node当前长期稳定版12.17.0,…

适用于Linux桌面歌词应用程序MusixMatch

导读Musixmatch桌面应用程序可用于Linux!不是Linux用户缺少桌面歌词应用程序。包括“即时歌词”和“Lyricfier”,许多开源音乐播放器都会运用某种歌词集成。 但是Musixmatch应用程序与那些有点不同。 Musixmatch的USP是Syncronized歌词 如果您曾经使用…

如何选择高效率的在线分板机主轴?

随着智能移动设备和其他电子3C设备需求的增大,PCB分板机的需要也随之而大增。越来越多的企业开始使用在线分板机来替代传统的手工分板,从而提升了生产效率,提高了产品质量,降低了生产成本。在分板机设备中,高速主轴是关…

Pandas数据预处理Pandas合并数据集在线闯关_头歌实践教学平台

这里写目录标题 第1关 Concat与Append操作第2关 合并与连接第3关 案例:美国各州的统计数据 第1关 Concat与Append操作 任务描述 本关任务:使用read_csv()读取两个csv文件中的数据,将两个数据集合并,将索引设为Ladder列&#xff0…

92. 递归实现指数型枚举

题目 思路 因为有n个数&#xff0c;每个数选或不选都是一种方案&#xff0c;而且要递增输出&#xff0c;那么就标记每个数是否备选&#xff0c;然后判断完n个数以后&#xff0c;就可以输出了 代码 #include<bits/stdc.h> using namespace std; int n; bool f[100] {0…

WEB渲染模式——CSR SSR SSG ISR DPR区别

页面渲染 浏览器渲染页面&#xff0c;根据HTML文档类型声明&#xff08;DOCTYPE&#xff09;解析HTML和CSS&#xff0c;渲染步骤&#xff1a;解析、样式计算、元素布局、绘制、重绘重排。HTML、CSS、JavaScript是网页的三大核心技术。 HTML (Hyper Text Markup Language) 超文…

【沐风老师】3dMax快速平铺纹理插件QuickTiles教程

QuickTiles是3ds max的一个插件&#xff0c;允许您将常规瓷砖纹理转换为交互式纹理&#xff0c;就在mat.editor中。 换言之&#xff0c;您可以根据需要对任何纹理进行修改和重新创建&#xff1a;更改布局、瓷砖大小、格式、颜色、接缝、体积、随机化形状或纹理等等。 这种方法大…

eNsp下如何使用wireshark抓包

文章目录 拓扑图抓包操作 拓扑图 抓包操作 可以通过下图上的指示 来设置 Time列的显示样式。 这里有个缺点就是就是抓取ensp上的虚拟设备上的数据包时的&#xff0c;年月日时间显示的不对。暂时无解决办法。 一般选择 日期和时间&#xff08;日期和时间与当前标准时间对应上时…

集简云平台助力无代码开发,实现平安银行与电商平台、CRM系统的快速连接

无代码开发与平安银行 平安银行是中国内地首家公开上市的全国性股份制银行&#xff0c;经过多年发展&#xff0c;已经在科技引领、综合金融、零售转型等领域形成独特竞争力和鲜明经营特色。近年来&#xff0c;平安银行更是积极拥抱科技&#xff0c;为此&#xff0c;选择了与集…

智慧工地源码 手册文档 app 数据大屏、硬件对接、萤石云

智慧工地解决方案依托计算机技术、物联网、云计算、大数据、人工智能、VR、AR等技术相结合&#xff0c;为工程项目管理提供先进技术手段&#xff0c;构建工地现场智能监控和控制体系&#xff0c;弥补传统方法在监管中的缺陷&#xff0c;最终实现项目对人、机、料、法、环的全方…

CROS错误 403 preflight 预检

预检 403 响应 Response for preflight 403 forbidden 如上图&#xff0c;配置了请求接口一直报错&#xff0c;前端看了没有什么问题&#xff0c;不知道哪里报错了&#xff0c;那么可能是后端没有设置跨域。&#xff08;或者是设置了&#xff0c;但是可能需要换一种方式&#…

C语言每日一题(26)

力扣网 203. 移除链表元素 题目描述 给你一个链表的头节点 head 和一个整数 val &#xff0c;请你删除链表中所有满足 Node.val val 的节点&#xff0c;并返回 新的头节点 。 思路分析 针对如图的普通情况&#xff0c;不能简单的遍历到对应位置然后进行释放&#xff0c;一方…

基于springboot实现致远汽车租赁平台管理系统项目【项目源码+论文说明】计算机毕业设计

基于springboot实现致远汽车租赁平台管理系统演示 摘要 首先,论文一开始便是清楚的论述了系统的研究内容。其次,剖析系统需求分析,弄明白“做什么”,分析包括业务分析和业务流程的分析以及用例分析,更进一步明确系统的需求。然后在明白了系统的需求基础上需要进一步地设计系统…

bamboo is currently exporting

bamboo每天到11点会自动挂起执行export任务 构建任务会暂停影响研发发布版本 原因是bamboo设置了Scheduled backups 把时间改成凌晨的1点钟