Uni-app 微信小程序头像上传

uni-app 提供了很多图片处理的Api，比如 uni.chooseImage()方法，但基本都是本地、拍照上传，本地临时、持久存储，要想跟服务端交互，就需要使用上传Api uni.uploadFile()。但项目需求是想将图片转为base64格式后上传，经多方查找，找到了微信提供的Api方法 wx.getFileSystemManager()。

wx.getFileSystemManager

wx.FileSystemManager.readFile() 方法可以根据提供的本地文件路径来读取本地文件内容，这正好符合项目需求，查看 uni-app Api 文档，也有实现这个方法 uni.FileSystemManager.readFile() ，但不知是否已经支持。经体验版测试，功能效果跟微信Api一致。

/** 上传头像* 注：使用vscode编辑器时，会有报错提醒，可忽略*/public chooseImage(): any {if (this.state) {return false;}this.state = true;uni.chooseImage({count: 1,sizeType: 'compressed',success: (res: any) => {this.state = false;if (res.tempFiles[0].size >= 200000) {uni.showToast({ title: '请上传低于200K的图片', icon: 'none', duration: 2000 });return false;}uni.compressImage({src: res.tempFilePaths[0],quality: 0,success: (res) => {uni.getFileSystemManager().readFile({filePath: res.tempFilePath, // 选择图片返回的相对路径encoding: 'base64', // 编码格式success: async (res: any) => {this.userInfoData.headImg = 'data:image/png;base64,' + res.data;}});}});},fail: (err: Error) => (this.state = false)});}

Uni-app 微信小程序头像上传相关推荐

微信小程序头像上传(一)
记录一下自己实现微信小程序头像上传的过程. wxml部分( 用了vant组件库 ): <view class="info"><van-imageroundwidt ...
微信小程序头像上传+（C#）服务端接收
第一步:样式设置(WXSS) 说明:.imagesize给view使用,.avatar给image使用.作用是把图片显示为圆形. .imagesize{display:flex; justify-co ...
微信小程序头像上传(二---完结)
效果展示: (1) : "点击登录" (2) : 登录后,会显示默认的微信头像与昵称 (3) : 再次点击头像可以选择一张图片当头像,( 真实环境可以选择相册图片或拍摄一张 ...
小程序头像上传成功但是小程序码没更新
微信小程序头像上传了,但是小程序码没更新怎么处理? 如图: 小程序头像上传成功,但是小程序码没更新,是不是让你怀疑人生? 其实不用怀疑,退出登录,重新登录就行了重新登录后,就可以刷新出新的小程序码图 ...
微信小程序直接上传文件到阿里云OSS组件封装
微信小程序直接上传文件到OSS 1. 封装公共方法在根目录utils目录新建一个upload文件夹: // utils/upload/base64.jsvar base64EncodeChars = ...
微信小程序录音上传功能
微信小程序录音上传录音弹窗wxml代码:  <view class="cui-record" hidden="{{isHid ...
上传声音微信小程序_SpringBoot开发案例之微信小程序录音上传
前言书接上回的<SpringBoot开发案例之微信小程序文件上传>,正常的业务流程是,口语测评需要学生通过前端微信小程序录入一段音频,通过调用第三方音频处理服务商进行评分,然后服务端对原 ...
微信小程序上传接口php,微信小程序API 上传、下载
微信小程序API 上传.下载 wx.uploadFile(OBJECT) 将本地资源上传到开发者服务器.如页面通过 wx.chooseImage 等接口获取到一个本地资源的临时文件路径后,可通过此接口 ...
微信小程序图片上传九宫格拖拽组件
微信小程序图片上传&九宫格拖拽组件前言图片上传加九宫格拖拽是一个比较常用的组件,常用于发帖或者评论等内容上传模块,我这篇九宫格拖拽的思路是借鉴了一款优雅的小程序拖拽排序组件实现这篇文章实 ...

Uni-app 微信小程序头像上传

wx.getFileSystemManager

Uni-app 微信小程序头像上传相关推荐

最新文章

热门文章