问题:base64图片不能直接用wx.saveImageToPhotosAlbum保存到手机相册

解决:

先用fs.writeFile写入本地文件,再wx.saveImageToPhotosAlbum保存到手机相册

saveimg:function(){
var _this=this
//获取文件管理器对象
const fs = wx.getFileSystemManager() //文件保存路径
const Imgpath = wx.env.USER_DATA_PATH + '/qrcodeImg' + '.png'
//_this.data.imgsrc base64图片文件
let imageSrc = _this.data.imgsrc.replace(/^data:image\/\w+;base64,/, '') //写入本地文件
fs.writeFile({
filePath: Imgpath,
data: imageSrc,
encoding: 'base64',
success (res) {
console.log(res) //保存到手机相册
wx.saveImageToPhotosAlbum({
filePath: Imgpath,
success(res) {
console.log(res)
wx.showToast({
title: '保存成功',
icon: 'success'
})
},
fail:function(err){
console.log("失败了")
console.log(err)
}
}) }
})
},

存储的话上面就可以实现了,下面是如果需要,删除文件的方法

项目中有遇到过,因为接口返回的画海报的图片是base64的图片,需要先存为本地文件才可以画图,canvas画完海报素材还在临时文件中,不一会就满了,这时候就需要将临时文件中不需要的文件删除了,就用到如下方法:

Object wx.env

小程序环境变量对象

wx.env.USER_DATA_PATH

文件系统中的用户目录路径

let fs = wx.getFileSystemManager()
//获取文件 Stats 对象
fs.stat({
// `${}` 是es6中新增的字符串方法
// ` 返单引号
path: `${wx.env.USER_DATA_PATH}`,
recursive: true,
success: res => {
//获取到stats对象 //Object.keys(要返回其枚举自身属性的对象) 返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和正常循环遍历该对象时返回的顺序一致
Object.keys(res.stats).forEach(path => {
var stats = res.stats[path] //删除指定路径的文件
fs.unlink({
filePath:`${wx.env.USER_DATA_PATH}`+stats.path,
success:function(res){
//删除成功
},
fail:function(res){
//删除失败
}
}) })
},
fail:res=>{
//失败
}
})

获取的stats对象:



Object.keys(res.stats):

微信小程序base64图片保存到手机相册的更多相关文章

  1. 微信小程序 base64 图片 canvas 画布 drawImage 实现

    在微信小程序中 canvas drawImage API 传入的第一个参数是 imageResource 图片资源路径,这个参数通常由从相册选择图片 wx.chooseImage 或 wx.getIm ...

  2. 微信小程序 base64图片在canvas上画图

    上代码 wxml <canvas canvas-id="myCanvas" style="width:400px;height:400px;">&l ...

  3. 微信小程序裁剪图片成圆形

    代码地址如下:http://www.demodashi.com/demo/14453.html 前言 最近在开发小程序,产品经理提了一个需求,要求微信小程序换头像,用户剪裁图片必须是圆形,也在gith ...

  4. 微信小程序动态生成保存二维码

    起源:最近小程序需要涉及到一些推广方面的功能,所以要写一个动态生成二维码用户进行下载分享,写完之后受益良多,特此来分享一下: 一.微信小程序动态生成保存二维码 wxml: <view class ...

  5. 微信小程序实现图片是上传、预览功能

    本文实例讲述了微信小程序实现图片上传.删除和预览功能的方法,分享给大家供大家参考,具体如下: 这里主要介绍一下微信小程序的图片上传图片删除和图片预览 1.可以调用相机也可以从本地相册选择 2.本地实现 ...

  6. 微信小程序点击保存图片到本地相册——踩坑

    在微信小程序中要保存图片到本地相册,需要获取相册权限. 总之整个功能实现下来需要如下几个小程序的API:wx.getSetting,wx.authorize,wx.openSetting,wx.dow ...

  7. 小程序base64图片格式保存至手机相册

    // 保存图片至相册 saveImg() { //获取文件管理器对象 const fs = wx.getFileSystemManager() //文件保存路径 const Imgpath = wx. ...

  8. 微信小程序之图片base64解码

    不知道大家在做微信小程序的时候遇到base64解码的问题,我之前在做微信小程序的时候遇到base64解析图片一直有问题,所以在这里把遇到的问题和解决方案在这里记录一下: 在平时的项目中我们是直接用ba ...

  9. 微信小程序 wx.uploadFile在安卓手机上面the same task is working问题解决

    微信小程序上传图片的时候,如果是多图片上传,一般都是直接用一个循环进行wx.uploadFile 这个在电脑上面测试与苹果手机上面都不会有什么问题 但当用安卓测试的时候,你会发现小程序会提示一个the ...

随机推荐

  1. DDS协议解读及测试开发实践

    DDS概述 DDS是OMG在2004年发布的中间件协议和应用程序接口(API)标准,它为分布式系统提供了低延迟.高可靠性.可扩展的通信架构标准.DDS目前在工业.医疗.交通.能源.国防领域都有广泛的应 ...

  2. Explain的详细使用

    官方文档 https://dev.mysql.com/doc/refman/5.7/en/explain-output.html explain俩种类型 explain extended 会在 exp ...

  3. Python解释器下载安装

    一.简介 吉多·范罗苏姆(Guido van Rossum)在1989年的圣诞节期间,编写能够解释Python语言语法的解释器. 解释器版本 第一个数字是大版本号 数字不同功能上可能会有很大差异 py ...

  4. Markdown 语法粗学

    Markdown 语法粗学 Typora下载 Typora官网 下拉点击右上角 选择下载即可 里面选择自己想要的系统下载即可 如果下载缓慢,推荐使用各自的下载工具或者使用软件管家等 亲测迅雷速度尚可 ...

  5. Sql中的小技巧

    1.where 字段名 regexp '正则表达式' 正则符号: ^ $ . [ ] * | . 表示1个任意字符 * 表示前面重复0次,或者任意次 ^ 开始 $ 结尾 [] 范围 | 或 sql示例 ...

  6. Docker容器自动更新

    前言: Watchtower 是一个可以实现自动化更新 Docker 基础镜像与容器的实用工具.它监视正在运行的容器以及相关的镜像,当检测到reg­istry中的镜像与本地的镜像有差异时,它会拉取最新 ...

  7. [react]react创建app,路由,mobx 全教程

    ​ 1.创建app, npx create-react-app my-app Cmd Copy 2.进入项目目录 cd my-app Cmd Copy 3.启用配置文件(默认是不开启配置文件的) ya ...

  8. windows10 c++获取本机IPv4,ipv6,查询本机Ipv4,ipv6

    1.关于 演示环境: win10+VS2017 2.支持 需要下面的库支持: ws2_32.lib 需要下面的宏,添加到项目属性-> c/c++ -> 预处理器定义 _WINSOCK_DE ...

  9. Android 控件使用教程(三)—— NineGridImageView 九宫格展示图片

    引子 上文降到RecyclerView的使用,确实非常方便易用,而且样式多样,很灵活.但在图像展示时,经常有朋友圈和微博等9张图以内的图片展示需求,这时候,不是一个可以无限下滑的RecyclerVew ...

  10. 【LeetCode】1170. Compare Strings by Frequency of the Smallest Character 解题报告(C++)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 双重循环 日期 题目地址:https://leetc ...