uniapp微信小程序保存base64格式图片的方法
uniapp保存base64格式图片的方法首先第一要先获取用户的权限
saveAlbum(){//获取权限保存相册
uni.getSetting({//获取用户的当前设置
success:(res)=> {
// console.log("获取权限",res);
if(res.authSetting['scope.writePhotosAlbum']){//验证用户是否授权可以访问相册
this.saveImageToPhotosAlbum();
}else{
uni.authorize({//如果没有授权,向用户发起请求
scope: 'scope.writePhotosAlbum',
success:()=> {
this.saveImageToPhotosAlbum();
},
fail:()=>{
uni.showToast({
title:"请打开保存相册权限,再点击保存相册分享",
icon:"none",
duration:3000
});
setTimeout(()=>{
uni.openSetting({//调起客户端小程序设置界面,让用户开启访问相册
success:(res2)=> {
// console.log(res2.authSetting)
}
});
},3000);
}
})
}
}
})
},
第二步是保存的代码
代码里面都有清晰的注释可以看
${this.$u.guid(8)}这里我用的是uview的一个自动生成随机八位数唯一字段的js 也可以替换成你需要生成的文件名称 也可以是固定的名称
只不过保存第二次的时候图片名称不会变化
saveImageToPhotosAlbum(){
let base64=this.maskData.replace(/^data:image\/\w+;BASE64,/, "");//去掉data:image/png;base64,
let filePath=wx.env.USER_DATA_PATH + `/hym_pay${this.$u.guid(8)}_qrcode.png`;
uni.getFileSystemManager().writeFile({
filePath:filePath , //创建一个临时文件名
data: base64, //写入的文本或二进制数据
encoding: 'base64', //写入当前文件的字符编码
success: res => {
uni.saveImageToPhotosAlbum({
filePath: filePath,
success: function(res2) {
uni.showToast({
title: '保存成功,请从相册选择再分享',
icon:"none",
duration:5000
})
},
fail: function(err) {
// console.log(err.errMsg);
}
})
},
fail: err => {
//console.log(err)
}
})
},
uniapp微信小程序保存base64格式图片的方法的更多相关文章
- 微信小程序开发——base64位图片显示问题
前言: 目前小程序项目需要后端借口提供验证码图片,后端是以base64位返回的,按照H5的做法,前边拼上 data:image/png;base64, 应该就可以了,关键代码如下: H5: <i ...
- 微信小程序:本地资源图片无法通过 WXSS 获取,可以使用网络图片或者 base64或者使用image标签
微信小程序:本地资源图片无法通过 WXSS 获取,可以使用网络图片或者 base64或者使用image标签 一.问题 报错信息: VM696:2 pages/user/user.wxss 中的本地资源 ...
- 微信小程序--canvas画布实现图片的编辑
技术:微信小程序 概述 上传图片,编辑图片大小,添加文字,改变文字颜色等 详细 代码下载:http://www.demodashi.com/demo/14789.html 概述 微信小程序--ca ...
- 微信小程序-显示外链图片 bug
微信小程序-显示外链图片 bug 显示外链图片 bug 403 bug 禁止外链,未授权 https://httpstatuses.com/403 image component 图片.支持 JPG. ...
- 微信小程序自动去除input空格的方法
当用户输入账号或者密码的时候,可能会有输入空格的情况,但是实际需要是不能够有空格的,所以我们要做一个去除空格,并且适应所有input的name参数的方法,下面请看源码: wxml: <input ...
- 微信小程序之base64图片如何预览与一键保存到本地相册?
需求:由于后台服务器各方面的限制,现在服务器返回的图片是base64格式的,小程序端需要支持预览图片和多个图片一键下载功能 一.如何预览base64位图片? WXML页面:item.src的值是bas ...
- 【重点突破】—— UniApp微信小程序开发教程学习Three
一.实战 HBuilderX:在微信小程序中运行页面,需要设置->安全 开启微信小程序服务端口,HBuilder工具->设置->配置程序路径 网络请求.模板语法.打开页面.页面传参 ...
- 【重点突破】—— UniApp 微信小程序开发官网学习One
一.初步认识 uni-app官网:https://uniapp.dcloud.io/component/README HBuilderX官方IDE下载地址: http://www.dcloud.io/ ...
- 微信小程序开发之多图片上传+服务端接收
前言: 业务需求,这次需要做一个小程序同时选中三张图片一起上传到服务端,后端使用的.NET WEBAPI接收数据保存. 使用技术: 在这章中将会使用到微信小程序wx.uploadFile(Object ...
随机推荐
- 解决H5设置了line-height但并没有居中的问题
遇到的问题 明明设置了line-height = height,但在H5页面里文字并没有居中. 原因 因为line-height是两条基线之间的距离,当元素高度和font-size差距较大时,会出现不 ...
- IPtables 之“四表五链”
目录 架构图 IP tables 简介 包过滤防火墙 Iptables如何过滤 "四表" "五链" Iptables流程 架构图 公司架构模式(酒店迎宾比喻) ...
- JAVA微信公众号网页开发——将接收的消息转发到微信自带的客服系统
如果公众号处于开发模式,普通微信用户向公众号发消息时,微信服务器会先将消息POST到开发者填写的url上,无法直接推送给微信自带的客服功能.如果需要把用户推送的普通消息推送到客服功能中,就需要进行代码 ...
- Rainbond通过插件整合ELK/EFK,实现日志收集
前言 ELK 是三个开源项目的首字母缩写:Elasticsearch.Logstash 和 Kibana.但后来出现的 FileBeat 可以完全替代 Logstash的数据收集功能,也比较轻量级.本 ...
- Amazing!!CSS 也能实现烟雾效果?
最近利用 CSS 实现了一些看似超出 CSS 能力的效果: 巧用渐变实现高级感拉满的背景光动画 Amazing!!CSS 也能实现极光? 本文继续此系列,本文主要想探讨一下,使用 CSS 能否比较好的 ...
- Improving Variational Auto-Encoders using Householder Flow
目录 概 主要内容 代码 Tomczak J. and Welling M. Improving Variational Auto-Encoders using Householder Flow. N ...
- 强强联袂!腾讯云TDSQL与国双战略签约,锚定国产数据库巨大市场
日前,腾讯云计算(北京)有限责任公司与北京国双科技有限公司签署了<国产数据库产品战略合作协议>,双方将在数据库技术方面展开深度合作,通过分布式交易型数据库的联合研发.产品服务体系建设.品牌 ...
- Electron 使用 Tray设置图标的路径问题
问题报错信息如图 上面的代码在dev模式下不报错,但是在build后,安装后,运行会提示错误,错误信息的大意是参数错误,原因应该是安装后的图片文件路径有问题,这块没有详细研究解决上面的问题的方法,是使 ...
- Android 悬浮窗
悬浮窗是一种比较常见的需求.例如把视频通话界面缩小成一个悬浮窗,然后用户可以在其他界面上处理事情. 本文给出一个简单的悬浮窗实现.可缩小activity和还原大小.可悬浮在其他activity上.使用 ...
- JMeter_csv文件参数化
CSV Data Set Config 可以从指定的文件中一行一行的提取文本内容,每行的数据通过分隔符拆解,并与变量名一一对应,就可以供取样器引用了. 所以在配置数据时,我们需要把参数化的数据进行分行 ...