您现在的位置: 微信小程序 > 微信小程序开发 > 教程 >

小程序之保存图片到相册的几种方法

来源:微信小程序 编辑:Yiyongtong.com 发布时间:2018-06-28 15:26热度:

保存图片到本地有两种方法,其一是网络图片保存到相册,其二本地图片保存到相册。

官方文档

保存图片前需要授权,因此我们先授权,代码如下:

 

  1. //获取相册授权
  2. wx.getSetting({
  3. success(res) {
  4. if (!res.authSetting['scope.writePhotosAlbum']) {
  5. wx.authorize({
  6. scope:'scope.writePhotosAlbum',
  7. success() {
  8. console.log('授权成功')
  9. }
  10. })
  11. }
  12. }
  13. })
  14. //此方法可以写在app.js中,也可以写在调用保存按钮时。

获取授权

第一种方法,网络图片保存:

 

  1. var imgSrc = "http://yijiao.oss-cn-qingdao.aliyuncs.com/images/http://tmp/wx1b4e5e756cd48af1.o6zAJsws4grEQvYrWTjBigy-6QaU.0llhudiKSF2V955a1c48350d9328ef064b4d36d12746.jpg"
  2. wx.downloadFile({
  3. url: imgSrc,
  4. success: function (res) {
  5. console.log(res);
  6. //图片保存到本地
  7. wx.saveImageToPhotosAlbum({
  8. filePath: res.tempFilePath,
  9. success: function (data) {
  10. wx.showToast({
  11. title: '保存成功',
  12. icon: 'success',
  13. duration: 2000
  14. })
  15. },
  16. fail: function (err) {
  17. console.log(err);
  18. if (err.errMsg === "saveImageToPhotosAlbum:fail auth deny") {
  19. console.log("当初用户拒绝,再次发起授权")
  20. wx.openSetting({
  21. success(settingdata) {
  22. console.log(settingdata)
  23. if (settingdata.authSetting['scope.writePhotosAlbum']) {
  24. console.log('获取权限成功,给出再次点击图片保存到相册的提示。')
  25. } else {
  26. console.log('获取权限失败,给出不给权限就无法正常使用的提示')
  27. }
  28. }
  29. })
  30. }
  31. },
  32. complete(res){
  33. console.log(res);
  34. }
  35. })
  36. }
  37. })

第二种方法:选择相册图片存入本地

 

  1. wx.chooseImage({
  2. count:1,// 默认9
  3. sizeType: ['original','compressed'],// 可以指定是原图还是压缩图,默认二者都有
  4. sourceType: ['album','camera'],// 可以指定来源是相册还是相机,默认二者都有
  5. success:function (res) {
  6. // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
  7. console.log("choose image")
  8. console.log(res)
  9. var tempFilePath = res.tempFilePaths[0]
  10. wx.getImageInfo({
  11. src: tempFilePath,
  12. success:function (res) {
  13. console.log("get image info")
  14. console.log(res)
  15. wx.saveImageToPhotosAlbum({
  16. filePath: res.path,
  17. success(res) {
  18. console.log("保存图片成功")
  19. console.log(res)
  20. wx.showToast({
  21. title:'保存成功',
  22. icon:'success',
  23. duration:2000
  24. })
  25. },
  26. fail(err) {
  27. console.log('失败')
  28. console.log(err)
  29.  
  30. if (err.errMsg == "saveImageToPhotosAlbum:fail cancel"){
  31. wx.openSetting({
  32. success(settingdata) {
  33. console.log(settingdata)
  34. if (settingdata.authSetting["scope.writePhotosAlbum"]) {
  35. console.log('获取权限成功,给出再次点击图片保存到相册的提示。')
  36. }else {
  37. console.log('获取权限失败,给出不给权限就无法正常使用的提示')
  38. }
  39. }
  40. })
  41. }
  42. }
  43. })
  44. }
  45. })
  46. }
  47. })

如有疑问,请简信。