uni-app保存图片到相册出现*.unknown错误及saveImageToPhotosAlbum:fail invalid file type错误

前言

使用uni-app开发微信小程序中,应用到保存图片到相册功能。通过调用getImageInfo()以及saveImageToPhotosAlbum()方法,电脑端和手机端均可保存到相册。今天uni.getImage开发时,uni.saveImageToPhotosAlbum模拟器保存正常,真机保存失败。出现*.unknown错误及saveImageToPhotosAlbum:fail invalid file type错误。

调试步骤如下:

1、调用 uni.downloadFile 下载图片 - 成功

2、用 uni.previewImage 预览-成功

3、调用 uni.authorize 获取 scope.writePhotosAlbum 授权 - 成功

4、在模拟器上调用 uni.saveImageToPhotosAlbum 保存图片 - 成功

5、在真机上调用  uni.saveImageToPhotosAlbum 保存图片 - 失败

错误信息下图所示:

实现

1、调用uni.downloadFile()方法,在downloadFile中设置filePath,而不要使用默认的保存路径,然后 saveImageToPhotosAlbum使用filePath,即可完美解决。

2、由于下载的图片后缀不一致,不均是png格式,调用uni.getImageInfo()方法获取图片Url的后缀名。

具体演示代码

onSavePhoto(){
  // #ifdef MP-WEIXIN
  uni.getImageInfo({
	src: _this.imageUrl,
	success: function(e) {
	  // e.type=png/jpg 扩展名
	  // filePathNew: 指定文件下载后存储的路径 (本地路径)
	  var filePathNew = wx.env.USER_DATA_PATH + "/" + new Date().valueOf() +'.'+e.type; 
	  uni.downloadFile({
		url: _this.imageUrl, //仅为示例,并非真实的资源
		filePath: filePathNew,
		success: (res) => {
		  if (res.statusCode === 200) {
			uni.saveImageToPhotosAlbum({
			  filePath: filePathNew,
				success: function() {
				  uni.showToast({title: '保存到相册成功',icon: 'none',duration: 2200});
				},
				fail: function(err){
				  console.log('saveImageToPhotosAlbum() fail ', err)
				}
			});
		  }
		}
	  });
	},
	complete: function(e) {
	  console.log('getImageInfo',e.path)
	}
  });
  // #endif
}

微信小程序中保存到相册需要微信授权,授权逻辑如下:

openSetting() {
  let _this = this;
  uni.getSetting({
    success(res) {
      if (!res.authSetting['scope.writePhotosAlbum']) {
        uni.authorize({
          scope: 'scope.writePhotosAlbum',
          success(res) {
            // 授权成功
            uni.showToast({title: '授权成功',icon: 'none',duration: 2200});
            _this.onSavePhoto();
          },
          fail() {
            uni.showModal({
              content: '检测到您没打开相册功能权限,是否去设置打开?',
              confirmText: "确认",
              cancelText: '取消',
              success: (res) => {
                if (res.confirm) {
                  uni.openSetting({
                    success: (res) => {
                      if (res.authSetting['scope.writePhotosAlbum']) {
                        _this.onSavePhoto();
                      } else {
                        //用户未同意保存图片权限
                      }
                    },
                    fail: (err) => {
                      console.log(err)
                    }
                  })
                } else {
                  uni.showToast({
                    title: '获取授权相册授权失败',
                    icon: 'none',
                    success: function() {
                      uni.navigateBack()
                    }
                  })
                }
              }
            })
          }
        })
      } else {
        _this.onSavePhoto()
      }
    },
    fail() {
      uni.showToast({
        title: '获取授权相机授权失败',
        icon: 'none',
        success: function() {
          uni.navigateBack()
        }
      })
    }
  })
}

猜你喜欢

转载自blog.csdn.net/loveliqi/article/details/125295904
今日推荐