详解微信小程序图片地扯转base64解决方案


Posted in Javascript onAugust 18, 2019

你还在找在小程序成如何将图片转base64存储起来并显示嘛,在这里呢,来瞧瞧。

使用方法

js文件

let $this = this;
request({
   url:'https://www.dounine.com/hello.jpg',
   method:'GET',
   responseType: 'arraybuffer',
   success:function(res){
    let base64 = wx.arrayBufferToBase64(res);
    $this.data.userImageBase64 = 'data:image/jpg;base64,' + base64;;
   }
});

wxml文件

<image src='{{userImageBase64}}' style='width:90rpx;height:90rpx;' />

PS:小程序本地图片转base64最简单方法

  • wx.chooseImage:得到图片地址
  • wx.getFileSystemManager:创建文件管理类
  • readFileSync:读取本地文件,直接得到base64
wx.chooseImage({
   success: function(res) {
    console.log(wx.getFileSystemManager().readFileSync(res.tempFilePaths[0], "base64"))
   },
  })

附官方api:
https://developers.weixin.qq.com/miniprogram/dev/api/file/wx.getFileSystemManager.html?search-key=getFileSystemManager

 以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
网站上面有这种切换效果
Jun 26 Javascript
JS执行删除前的判断代码
Feb 18 Javascript
jQuery验证插件validation使用指南
Apr 21 Javascript
JavaScript中数据结构与算法(四):串(BF)
Jun 19 Javascript
利用HTML5的画布Canvas实现刮刮卡效果
Sep 06 Javascript
使用jQuery处理AJAX请求的基础学习教程
May 10 Javascript
javascript 用函数实现继承详解
May 28 Javascript
javascript url几种编码方式详解
Jun 06 Javascript
AngularJS辅助库browserTrigger用法示例
Nov 03 Javascript
通过实例了解js函数中参数的传递
Jun 15 Javascript
angula中使用iframe点击后不执行变更检测的问题
May 10 Javascript
vue @ ~ 相对路径 路径别名设置方式
Jun 05 Vue.js
wx-charts 微信小程序图表插件的具体使用
Aug 18 #Javascript
微信小程序canvas绘制圆角base64图片的实现
Aug 18 #Javascript
Node.js从字符串生成文件流的实现方法
Aug 18 #Javascript
微信公众号生成新浪短网址的实现(快速生成)
Aug 18 #Javascript
js 实现 list转换成tree的方法示例(数组到树)
Aug 18 #Javascript
详解ES6 Promise的生命周期和创建
Aug 18 #Javascript
vue-cli3配置与跨域处理方法
Aug 17 #Javascript
You might like
php 验证码实例代码
2010/06/01 PHP
PHP实现根据浏览器跳转不同语言页面代码
2013/08/02 PHP
php快速查找数据库中恶意代码的方法
2015/04/01 PHP
浅谈PHP错误类型及屏蔽方法
2017/05/27 PHP
PHP中使用mpdf 导出PDF文件的实现方法
2018/10/22 PHP
浅谈Javascript嵌套函数及闭包
2010/11/09 Javascript
js中单引号与双引号冲突问题解决方法
2013/10/04 Javascript
nodejs实现的一个简单聊天室功能分享
2014/12/06 NodeJs
初步了解javascript面向对象
2015/11/09 Javascript
JavaScript对Json的增删改属性详解
2016/06/02 Javascript
AngularJS基础 ng-src 指令简单示例
2016/08/03 Javascript
Web前端框架bootstrap实战【第一次接触使用】
2016/12/28 Javascript
VUE axios上传图片到七牛的实例代码
2017/07/28 Javascript
使用html+js+css 实现页面轮播图效果(实例讲解)
2017/09/21 Javascript
echarts整合多个类似option的方法实例
2018/07/10 Javascript
vue登录页面cookie的使用及页面跳转代码
2019/07/10 Javascript
js+HTML5 canvas 实现简单的加载条(进度条)功能示例
2019/07/16 Javascript
vue循环中点击选中再点击取消(单选)的实现
2020/09/10 Javascript
[01:03:37]Secret vs VGJ.S Supermajor小组赛C组 BO3 第二场 6.3
2018/06/04 DOTA
使用Python开发windows GUI程序入门实例
2014/10/23 Python
pandas 空的dataframe 插入列名的示例
2018/10/30 Python
Python 处理图片像素点的实例
2019/01/08 Python
python 获取毫秒数,计算调用时长的方法
2019/02/20 Python
VPS CENTOS 上配置python,mysql,nginx,uwsgi,django的方法详解
2019/07/01 Python
django执行数据库查询之后实现返回的结果集转json
2020/03/31 Python
Pytorch损失函数nn.NLLLoss2d()用法说明
2020/07/07 Python
numpy实现RNN原理实现
2021/03/02 Python
英国最受信任的在线眼镜商之一:Fashion Eyewear
2019/10/31 全球购物
广播电视新闻学专业应届生求职信
2013/10/08 职场文书
丑小鸭教学反思
2014/02/03 职场文书
人力管理专业毕业生求职信
2014/02/27 职场文书
2014年五四青年节演讲稿范文
2014/04/22 职场文书
医学检验专业自荐信
2014/09/18 职场文书
反四风个人对照检查材料思想汇报
2014/09/25 职场文书
2014年村委会工作总结
2014/11/24 职场文书
演讲开头怎么书写?
2019/08/06 职场文书