详解微信小程序图片地扯转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 相关文章推荐
jquery实现简单的拖拽效果实例兼容所有主流浏览器(优化篇)
Jun 28 Javascript
了不起的node.js读书笔记之例程分析
Dec 22 Javascript
JavaScript中的Promise使用详解
Jun 24 Javascript
优化RequireJS项目的相关技巧总结
Jul 01 Javascript
基于jQuery实现的美观星级评论打分组件代码
Oct 30 Javascript
@ResponseBody 和 @RequestBody 注解的区别
Mar 08 Javascript
Vue2.0 vue-source jsonp 跨域请求
Aug 04 Javascript
JS实现移动端整屏滑动的实例代码
Nov 10 Javascript
laydate日历控件使用方法详解
Nov 20 Javascript
基于vue实现网站前台的权限管理(前后端分离实践)
Jan 13 Javascript
layui 数据表格+分页+搜索+checkbox+缓存选中项数据的方法
Sep 21 Javascript
js实现盒子滚动动画效果
Aug 09 Javascript
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链接MySQL的常用扩展函数
2014/10/23 PHP
php gd等比例缩放压缩图片函数
2016/06/12 PHP
php实现简易计算器
2020/08/28 PHP
[原创]保存的js无法执行的解决办法
2007/02/25 Javascript
用showModalDialog弹出页面后,提交表单总是弹出一个新窗口
2009/07/18 Javascript
javascript 验证日期的函数
2010/03/18 Javascript
js仿黑客帝国字母掉落效果代码分享
2020/11/08 Javascript
极力推荐10个短小实用的JavaScript代码段
2016/08/03 Javascript
基于JS实现类似支付宝支付密码输入框
2016/09/02 Javascript
Bootstrap 模态框(Modal)带参数传值实例
2017/08/20 Javascript
webpack+react+antd脚手架优化的方法
2018/04/02 Javascript
vue动态添加路由addRoutes之不能将动态路由存入缓存的解决
2019/02/19 Javascript
VUE接入腾讯验证码功能(滑块验证)备忘
2019/05/07 Javascript
jquery 回调操作实例分析【回调成功与回调失败的情况】
2019/09/27 jQuery
vue 项目软键盘回车触发搜索事件
2020/09/09 Javascript
vue-calendar-component 封装多日期选择组件的实例代码
2020/12/04 Vue.js
python实战之实现excel读取、统计、写入的示例讲解
2018/05/02 Python
python操作xlsx文件的包openpyxl实例
2018/05/03 Python
详解Django CAS 解决方案
2019/10/30 Python
Pygame的程序开始示例代码
2020/05/07 Python
纯CSS打造(无图像无js)的非常流行的讲话(语音)气泡效果
2012/12/28 HTML / CSS
CSS3动画特效在活动页中的应用
2020/01/21 HTML / CSS
移动端Html5中百度地图的点击事件
2019/01/31 HTML / CSS
耐克美国官网:Nike.com
2016/08/01 全球购物
NYX Professional Makeup英国官网:美国平价专业彩妆品牌
2019/11/13 全球购物
德国亚洲食品网上商店:asiafoodland.de
2019/12/28 全球购物
化学实验员岗位职责
2013/12/28 职场文书
21岁生日感言
2014/02/27 职场文书
三年级班级文化建设方案
2014/05/04 职场文书
2014年党风廉政工作总结
2014/12/03 职场文书
任命书怎么写
2015/03/02 职场文书
女方离婚起诉书
2015/05/18 职场文书
小学感恩主题班会
2015/08/12 职场文书
大学生心理健康教育心得体会
2016/01/12 职场文书
Pandas||过滤缺失数据||pd.dropna()函数的用法说明
2021/05/14 Python
springboot拦截器无法注入redisTemplate的解决方法
2021/06/27 Java/Android