uniapp获取头像文件(二进制文件显示图片)

news2024/9/21 2:42:22

一、描述

        由于在获取头像文件过程中,传递参数之后,请求成功了,但是后端给我返回了一串二进制数据流,傻傻的我,以为是乱码,跑去问后端大哥,人家跟我说这不是二进制吗,突然就觉得自己傻傻的。

如图,这个请求到的:当时是以json格式请求的:

二、解决

        好吧,看来问题出现到我身上,我就到处搜,乱试,然后发现下面这个方法可行,分享一下吧:

        首先,我把他封装成一个工具,方法调用,不然每次都在页面上写一堆,因为请求头像的地方挺多。

// 获取头像
import store from "../../store/index.js"

export function Getimg(code, id, callback) {
	uni.request({
		url: `https:。。。。。。。。。。。。。。。/${code}/${id}`,   //挂上你的请求地址
		method: 'GET',
		// arraybuffer
		responseType: 'arraybuffer',
		header: {
			"Authorization": `Bearer ${store.state.access_token}`
		},
		success: res => {
			let base64 = 'data:image/jpeg;base64,' + uni.arrayBufferToBase64(res.data)
			// console.log("base64",base64);
			callback(null, base64,res.data);   //当转成base64文件之后,使用callback传一个回调回去,第一个参数是错误信息,这个这里就随便了,base64这个值就是能正常显示的,res.data我是把返回的对象拿出去做判断,具体根据需不需要再传吧,反正就是正常的传值。传什么自己根据业务需要传。
		},
		fail: (err) => {
			callback(err, null); // 传递错误  
		}
	});
}

调用:

// 获取头像
			async getAvatar(code, id) {
				await Getimg(code, id, (err, base64,data) => {
					if(data.byteLength == 63) {
						this.imageurl = defalutImg
					} else {
						console.log("base",base64);
						this.imageurl = base64
					}
				});
			},
<image :src="imageurl" mode="" class="avatar"></image>

就是这样嘛!代码写的还是有些问题,还有这个方法只是其一,等发现好一点的办法再更新!

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

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

相关文章

引领端侧多模态新时代:MiniCPM-V 2.6重磅登场

前沿科技速递&#x1f680; 在人工智能领域&#xff0c;每一次技术的进步都伴随着参数规模的提升和计算力的突破。然而&#xff0c;面壁智能公司最新推出的MiniCPM-V 2.6端侧多模态模型&#xff0c;却以相对“小巧”的8B参数量级&#xff0c;打破了传统思维&#xff0c;实现了端…

初学者入门的可视化超级色彩公式

色彩不仅是视觉元素&#xff0c;也是数据表达的重要工具。在临床数据的可视化过程中&#xff0c;合理的色彩搭配能帮助观众迅速理解数据背后的意义。例如&#xff0c;高危状态的患者可能用红色表示&#xff0c;而健康状态用绿色表示。不同色彩之间的对比度和相对位置将决定数据…

蓝牙耳机怎么连接手机?苹果用户关注这3个方法

在这个无线连接日益普及的时代&#xff0c;蓝牙耳机已成为我们日常生活中不可或缺的伴侣。然而&#xff0c;对于初次使用或遇到连接问题的用户来说&#xff0c;如何解决蓝牙耳机怎么连接手机的问题可能会有些许困惑。本文将为您详细介绍3种简单易行的方法&#xff0c;帮助您轻松…

Transformer动画讲解-多模态

Transformer模型是一种基于自注意力机制的神经网络架构&#xff0c;广泛应用于自然语言处理任务&#xff0c;如机器翻译、文本摘要等。 Transformer模型在多模态数据处理中扮演着重要角色&#xff0c;其能够高效、准确地处理包含不同类型数据&#xff08;如图像、文本、音频等&…

Polars简明基础教程十一:可视化(一)

到本次讲座结束时&#xff0c;你将能够&#xff1a; 使用Polars的内部plot方法从Polars创建图表使用外部绘图库从Polars创建图表了解这些库如何支持Polars 通常&#xff0c;需要可视化库的最新版本来实现最大程度的兼容性 import polars as plimport hvplot as hv import ma…

陈丽华珍藏梁永和书画作品,展现中华艺术之美

近两年来&#xff0c;富华国际集团董事局主席、中国紫檀博物馆馆长陈丽华女士收藏了多件由人民艺术家、著名画家梁永和先生亲笔创作的书画作品&#xff0c;其中包括《松鹤延年》、《香荷》、《江山多娇》和《硕果累累》等佳作。此外&#xff0c;梁永和先生还特地为陈丽华女士创…

【喜报】祝贺青创智通签约广州进德生物科技SunFMEA项目

SunFMEA SunFMEA是由北京青创智通科技有限公司自主研发的一款基于AIAG-VDA-FMEA标准的失效模式和影响分析软件&#xff0c;软件满足新版七步法分析流程&#xff0c;兼具DFMEA和PFMEA&#xff0c;以结构树的方式直观、完整、快速地指导用户完成FMEA分析的整个流程&#xff0c;能…

前端纯数组转树形结构

问题描述 前端需要处理后端返回的数据&#xff0c;展示如下。 解决方式 因为使用ProTable组件&#xff0c;那么数据只要携带children字段&#xff0c;就可以如上图展示。 方式一&#xff1a;后端返回数据的时候&#xff0c;直接封装好&#xff0c;如下&#xff1a; const…

electron+vue搭建命令

electronvue搭建 要使用Electron和Vue来搭建一个桌面应用程序&#xff0c;你可以遵循以下步骤&#xff1a; 1.创建一个Vue项目&#xff1a; vue create my-electron-app2.进入项目目录&#xff1a; cd my-electron-app3.添加Electron&#xff1a; vue add electron-builde…

指针初阶1(学习编程的第二十四天)

1.指针是什么&#xff1f; 编号可以抽象为地址&#xff0c;地址就可以抽象为指针 2.指针和指针类型 指针类型的意义&#xff1a;1.指针类型决定了 指针解引用的权限有多大 int有4个字节 double有8个 char只有1个 2.指针类型决定了&#xff0c;指针走一步&#xff0c;能走多…

自回归分布滞后模型 (ARDL)及 Stata 具体操作步骤

目录 一、引言 二、文献综述 三、理论原理 四、实证模型 五、程序代码及解释 六、代码运行结果 一、引言 自回归分布滞后模型&#xff08;Autoregressive Distributed Lag Model&#xff0c;简称 ARDL&#xff09;在时间序列分析中具有重要的地位&#xff0c;它能够同时捕…

八种排序算法的复杂度(C语言)

归并排序(递归与非递归实现,C语言)-CSDN博客 快速排序(三种方法,非递归快排,C语言)-CSDN博客 堆排序(C语言)-CSDN博客 选择排序(C语言)以及选择排序优化-CSDN博客 冒泡排序(C语言)-CSDN博客 直接插入排序(C语言)-CSDN博客 希尔排序( 缩小增量排序 )(C语言)-CSDN博客 计数…

【文件IO】文件内容操作

读文件、写文件&#xff0c;都是操作系统提供了 API&#xff0c;在 Java 中也进行了封装&#xff0c;叫“文件流”/“IO流” Stream 流&#xff0c;形象比喻&#xff0c;水流/气流 水流的特点&#xff1a;我要通过水龙头&#xff0c;接 1000ml 水 直接一口气&#xff0c;把 100…

µC/OS-III

第一章 μCOS 简介 1.1 初识 μCOS 实际上&#xff0c;一个 CPU 核心在某一时刻只能运行一个任务&#xff0c;由于切换处理任务的速度非常快&#xff0c;因此给人造成了一种同一时刻有多个任务同时运行的错觉。 操作系统的分类方式可以由任务调度器的工作方式决定&am…

RCE漏洞基础初了解

目录 一、简介 二、php的命令执行函数 2.1 exec 2.2 passthru 2.3 shell_exec 2.4 popen 三、代码执行 3.1 php的回调后门 3.1.1 回调后门的老祖宗 3.1.2 数组造成单参数回调后门 3.1.3 绕过安全狗 ​编辑 四、来看看php中webshell奇淫技巧 4.1eval长度限制突破方法…

problem with running OpenAI Cookbook‘s chatbot

题意&#xff1a;运行 OpenAI Cookbook 的聊天机器人时遇到问题 问题背景&#xff1a; Im having trouble running the chatbot app in the OpenAI Cookbook repository. 我在运行 OpenAI Cookbook 仓库中的聊天机器人应用程序时遇到了问题。 What I tried 我尝试的内…

240810-Gradio通过HTML组件打开本地文件+防止网页跳转到about:blank

A. 最终效果 B. 可通过鼠标点击打开文件&#xff0c;但会跳转到about:blank import gradio as gr import subprocessdef open_pptx():pptx_path /Users/liuguokai/Downloads/240528-工业大模型1.pptxtry:subprocess.Popen([open, pptx_path])return "PPTX file opened s…

七、3 AD单通道(代码)

1、步骤 &#xff08;1&#xff09;开启GPIO和ADC的时钟、配置ADCCLK的分频器 &#xff08;2&#xff09;配置GPIO &#xff08;3&#xff09;配置多路开关&#xff08;把左边的通道接入到右边的规则组中&#xff09; &#xff08;4&#xff09;配置ADC转换器 &#xff08;…

HarmonyOs编写一个案例实现一个照片选择(阶段进阶 四种需求 逐一完善)

需求1. .实现照片选择 并将选择好的照片展示出来 import { GoodItem } from ../06/modules;Entry Component struct PhotoPage {State message: string 实现一个相册;State List: GoodItem[] [{goods_name: dsfjlsjkfsf,goods_price: 100,goods_img: https://img1.baidu.com…

Springboot3 配置sql打印到控制台

一、pom.xml <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-log4j2</artifactId><version>3.1.2</version></dependency> 二、application.yml com.lingyang.system # log4j2配…