小程序中将base64图片保存到相册中的方法介绍

互联网 18-12-14
本篇文章给大家带来的内容是关于小程序中将base64图片保存到相册中的方法介绍,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

一、授权获取

1、相关apiwx.getSettingwx.authorize

2、授权获取流程一般为 是否有该权限 ——> 若无 ——> 调起授权弹窗 ——> 同意 ——> 使用相关api (如果用户拒绝授权则可使用wx.opensetting引导用户前往授权设置页授权)

3、代码实现

static async weAuthCheck(type = 'address') {     let resGetting = await new Promise((resolve, reject) => {         wepy.getSetting({             success: res => {                 // console.log(res, 'getsetting')                 if (res.authSetting.hasOwnProperty(`scope.${type}`) && res.authSetting[`scope.${type}`]) {                     resolve({                         succeeded: true                     })                 } else {                     wepy.authorize({                         scope: `scope.${type}`,                         success: () => {                             resolve({                                 succeeded: true                             })                         },                         fail: err => {                             // console.log(err, 'errrrr')                             resolve({                                 succeeded: false,                                 err: err                             })                         }                     })                 }             },             fail: err => {                 resolve({                     succeeded: false,                     err: err                 })             }         })     })     console.log('getSetting res: \n', resGetting)     return resGetting }

二、写入临时文件

1、相关api文件系统writeFile

2、参数encoding 用于说明 写入的参数data的格式是什么,并非是将data按encoding的形式写入。在这里我们应该指定encoding为base64

3、代码实现

// 先获得一个实例  this.fileManager = wx.getFileSystemManager() this.fileManager.writeFile({     filePath: `${wx.env.USER_DATA_PATH}/qrcode_${timestamp}.png`,     data: data,     encoding: 'base64',     success: res => {         console.log('res: \n:', res)     },     fail: res => {         console.log(res)     } })

三、格式化字符串

1、base64字符串的格式: "data:image/png;base64,...........",逗号前面这一段为格式说明,用于说明后续的内容格式是图片格式为png的base64格式。

2、如果直接将整一串字符传入,虽然可以保存成功,但是将导致图片文件格式错误。因此再做一步切割操作

let startIdx = this.qrcode.indexOf('base64,') + 7

四、完整实现

async onTapSaveQrcode() {     let startIdx = this.qrcode.indexOf('base64,') + 7     let resCheck = await this.$weAuthCheck('writePhotosAlbum')     let timestamp = new Date().getTime()     let self = this     if (resCheck.succeeded) {         wepy.showLoading()         this.fileManager.writeFile({             filePath: `${wx.env.USER_DATA_PATH}/qrcode_${timestamp}.png`,             data: this.qrcode.slice(startIdx),             encoding: 'base64',             success: res => {                 console.log('res: \n:', res)                 wx.saveImageToPhotosAlbum({                     filePath: `${wx.env.USER_DATA_PATH}/qrcode_${timestamp}.png`,                     success: res => {                         self.$emit('save-qrcode-success')                         wepy.showToast({                             title: '保存成功'                         })                     },                     fail: err => {                         console.log(err)                         if (!err.errMsg.includes('cancel')) {                             wepy.showToast({                                 title: err.errMsg,                                 icon: 'none'                             })                         }                     },                     complete: () => {                         wepy.hideLoading()                     }                 })             },             fail: res => {                 wepy.hideLoading()                 console.log(res)             }         })     } }

以上就是小程序中将base64图片保存到相册中的方法介绍的详细内容,更多内容请关注技术你好其它相关文章!

来源链接:
免责声明:
1.资讯内容不构成投资建议,投资者应独立决策并自行承担风险
2.本文版权归属原作所有,仅代表作者本人观点,不代表本站的观点或立场
标签: 小程序
上一篇:php获取远程图片并下载保存到本地的方法分析 下一篇:微信小程序修改data使页面数据实时更新的代码示例

相关资讯