«

uniapp微信小程序保存base64格式图片的方法

时间:2024-3-3 11:14     作者:韩俊     分类: Javascript


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)
                }
            })
        },

标签: javascript 微信小程序

热门推荐