微信小程序获取后台返回的二进制图片

这篇具有很好参考价值的文章主要介绍了微信小程序获取后台返回的二进制图片。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

获取后台返回的二进制图片需要先使用wx.request方法发起网络请求获取图片数据,然后将返回的数据用wx.arrayBufferToBase64方法进行转换,最后将转换后的数据绑定到图片的src属性即可。

参考代码如下

wx.request({
  url: 'https://example.com/image.jpg',
  responseType: 'arraybuffer',
  success(res) {
    const base64 = wx.arrayBufferToBase64(res.data);
    const imageUrl = 'data:image/jpeg;base64,' + base64;
    // 将imageUrl绑定到图片的src属性
  }
})

其中,url为后台返回的图片地址,responseType为返回的数据类型为二进制数组。在success回调函数中,使用wx.arrayBufferToBase64方法将二进制数组转换成base64编码的字符串,然后拼接成data URL格式的图片地址,最后将其绑定到图片的src属性即可。文章来源地址https://www.toymoban.com/news/detail-693666.html

到了这里,关于微信小程序获取后台返回的二进制图片的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 后端返回二进制流,前端处理二进制文件流,实现预览图片以及PDF

    1、首先预览PDF需要 后端 将响应头 Content-Type 设置为PDF类型 application/pdf ,不能预览,会直接下载 2、 前端 定义接口:并设置相应类型 responseType 为 blob 请求数据:通过 window.URL.createObjectURL(res) 转成本地预览地址, 在通过 window.open() 方法打开转成本地预览地址即可预览PDF,如下

    2024年02月15日
    浏览(54)
  • Vue 读取后台二进制文件流转为图片显示

    Vue 读取后台二进制文件流转为图片显示 后台返回格式 axios写法 重点 responseType: ‘blob’ , 使用的是res中的data blob 本文章参考 https://huaweicloud.csdn.net/63a56170b878a545459459f2.html

    2024年04月11日
    浏览(41)
  • vue 后端返回二进制流-前端通过blob对象下载文件-图片

    前言 在实际开发中我们经常会遇见下载文件的场景,比如下载合同,下载文件 下载文件有2种方式,一种是后端返回二进制流,前端通过blob对象接受根据不同类型下载 还有一种把地址直接在浏览器新窗口打开浏览器打开pdf可以预览和下载,其他文件直接下载 但不管是那种方

    2024年02月05日
    浏览(75)
  • HTML5 WebSocket介绍与基本使用(解析服务端返回的二进制数据)

    WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。 WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行

    2024年02月15日
    浏览(39)
  • 【JavaScript】后端返回的二进制流音频数据或本地音频资源,前端如何播放?

    如果我们要使用本地的音频资源,在 vue3 中那么我们需要对资源的地址做一下处理 后端返回二进制流音频数据,怎么让其可播放 前端播放二进制语音流

    2024年02月03日
    浏览(60)
  • 写一个函数返回参数二进制中 1 的个数(c语言三种实现方法)

    (本文旨在自己做题时的总结,我会给出不同的解法,后面如果碰到新的题目还会加入其中,等于是我自己的题库。 方法一: 方法二: 这里说一个方法,任何一个进制数%它的进制位都可以得到它的最低位,任何一个进制数 / 它的进制位都可以将最低位丢弃。比如: 这样我

    2024年02月13日
    浏览(46)
  • OpenGL ES 3.0 着色器程序二进制化

    之前有位读者提问:C++ 如何将 OpenGL ES 的着色器程序二进制(保存),然后在其他地方加载使用?现在写篇文章介绍下。 将着色器程序二进制化(Shader Program Binary)有哪些好处? 快速加载和解析 :使用二进制形式的着色器程序可以更快地加载和解析,因为不需要进行编译和

    2024年02月07日
    浏览(39)
  • uniapp小程序中处理blob二进制流数据

    小程序中是不支持blob格式数据的,new Blob()会报错Blob未定义 处理方法是转成base64格式: 首先,请求中要带上responseType: \\\"arraybuffer\\\",保证返回的数据格式是arraybuffer 使用uni.arrayBufferToBase64() 转化成base64格式,后续根据业务处理数据即可。 在这个代码中,数据是一张png格式的二维

    2024年02月04日
    浏览(45)
  • MATLAB练习题:编写程序将十进制正整数转换为对应的二进制字符向量

     讲解视频:可以在bilibili搜索“MATLAB教程新手入门篇——数学建模清风主讲”。 MATLAB教程新手入门篇(数学建模清风主讲,适合零基础同学观看)_哔哩哔哩_bilibili  编写程序将十进制正整数转换为对应的二进制字符向量。例如6对应的二进制字符向量为\\\'110\\\', 38对应的二进制字

    2024年02月02日
    浏览(49)
  • 【0到1的设计之路】从C语言到二进制程序

    C程序如何从源代码生成指令序列(二进制可执行文件) 预处理 - 编译 - 汇编 - 链接 - 执行 方法: 阅读工具的日志(查看是否支持verbose, log等选项) 通过man gcc并搜索-I选项可得知头文件搜索的顺序 好的编程习惯 - 总是用括号包围参数 好的编程习惯 - 一个参数尽量不要展开多次 上述

    2024年01月23日
    浏览(40)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包