uniapp 之 Base64图片的显示问题以及保存到相册

 

一、base64 图片显示问题

  uniapp 官网明文指出 image 标签的 src 支持base64 码：

  但是实际操作还需要注意一个点，base64码可能过长，过长的情况就可能存在换行符\r \n，所以我们就需要把换行符给处理掉：

let base64 = 'data:image/jpeg;base64,/9h/5SAESkZJTgA......'
this.imageSrc = base64.replace(/[\r\n]/g, "")

  之后，就可以正常显示图片了，亲测有效。

  
  

二、base64 图片保存到相册

话不多说，直接上代码：

// 将base64 图片保存到本地系统相册
saveBaseImgFile(base64) {
    
    
	const bitmap = new plus.nativeObj.Bitmap('base64')
	bitmap.loadBase64Data(base64, () => {
    
    
			const url = '_doc/' + new Date().getTime() + '.png'
			bitmap.save(
				url,
				{
    
    
					overwrite: true // 是否覆盖
					// quality: 'quality'  // 图片清晰度
				},
				(i) => {
    
    
					uni.saveImageToPhotosAlbum({
    
    
						filePath: url,
						success: () => {
    
    
							toast('图片保存成功')
							bitmap.clear()
						}
					})
				},
				(e) => {
    
    
					toast('图片保存失败')
					bitmap.clear()
				}
			)
		},
		(e) => {
    
    
			toast('图片保存失败')
			bitmap.clear()
		}
	)
}

 

如有不足，望大家多多指点！ 谢谢！