【快应用】网络图片保存到相册失败案例

​问题背景：

调用 media.saveToPhotosAlbum接口保存网络路径的图片。出现错误提示 code=202，该如何处理？

代码如下：

<script>

  import prompt from '@system.prompt';

  import media from '@system.media';

  module.exports = {

    data: {

      componentData: {},

      imgurl: "https://ywopen-1252317822.image.myqcloud.com/openwx/recommendimg/20210908/6138797a4e3b3.jpg"

    },

    save() {

      media.saveToPhotosAlbum({

        uri: this.imgurl,

        success: function () {

          console.log('save success');

        },

        fail: function (data, code) {

          console.log('handling fail, code = ' + code);

        }

      })

    }

  }

</script>

报错提示如下：

09-16 14:12:01.511 E/jsLog   (19071): saveToPhotosAlbum: input err: invalid param.

09-16 14:12:01.519 I/jsLog   (19071): handling fail, code = 202

 

问题分析：

快应用在中的saveToPhotosAlbum接口目前仅支持本地图片路径保存到相册，暂不支持网络图片路径导致的。

 

解决方法：

想要保存网络路径的图片需要先调用request.download接口将图片先下载下来，拿到本地存储的临时图片路径，再去调接口将图片保存到相册。

修改代码如下：

<script>

  import prompt from '@system.prompt';

  import request from '@system.request';

  import media from '@system.media';

  module.exports = {

    data: {

      componentData: {},

      imgurl: "https://ywopen-1252317822.image.myqcloud.com/openwx/recommendimg/20210908/6138797a4e3b3.jpg",

      downloadtoken: '',

      downloadurl: ''

    },

    save() {

      media.saveToPhotosAlbum({

        uri: this.downloadurl,

        success: function () {

          console.log('save success');

          prompt.showToast({

            message: 'save success',

          })

        },

        fail: function (data, code) {

          prompt.showToast({

            message: 'handling fail, code = ' + code,

          })

          console.log('handling fail, code = ' + code);

        }

      })

    },

    download() {

      var that = this

      request.download({

        "url": this.imgurl,

        success: function (data) {

          console.log(data.token);

          that.downloadtoken = data.token

        },

        fail: function (data, code) {

          console.log("handling fail, code = " + code);

        },

        complete() {

          that.ondownloadcomplete()

        }

      })

 

    },

    ondownloadcomplete() {

      var that = this

      request.onDownloadComplete({

        "token": this.downloadtoken,

        success: function (data) {

          console.log(data.uri);

          that.downloadurl = data.uri

        },

        fail: function (data, code) {

          console.log("handling fail, code = " + code);

        }

      })

    }

  }

</script>

效果如下：

09-16 14:28:03.468 I/jsLog   (19152): 341

09-16 14:28:03.843 I/jsLog   (19152): internal://mass/Download/6138797a4e3b3-2.jpg

09-16 14:28:05.479 I/jsLog   (19152): save success

09-16 14:29:04.878 I/jsLog   (19152): save success

 

Hello.ux页面代码如下：

<template>

  <!-- Only one root node is allowed in template. -->

  <div class="container">

    <text class="txt" onclick="download">download</text>

    <text class="txt" onclick="save">savetoPhotosAlbum</text>

  </div>

</template>

 

<style>

  .container {

    flex-direction: column;

    align-items: center;

    justify-content: center;

  }

  .txt {

    font-size: 30px;

    text-align: center;

    width: 50%;

    height: 70px;

    margin-top: 5px;

    border: 1px solid #000000;

  }

</style>

 

<script>

  import prompt from '@system.prompt';

  import request from '@system.request';

  import media from '@system.media';

  module.exports = {

    data: {

      componentData: {},

      imgurl: "https://ywopen-1252317822.image.myqcloud.com/openwx/recommendimg/20210908/6138797a4e3b3.jpg",

      downloadtoken: '',

      downloadurl: ''

    },

    save() {

      media.saveToPhotosAlbum({

        uri: this.downloadurl,

        success: function () {

          console.log('save success');

          prompt.showToast({

            message: 'save success',

          })

        },

        fail: function (data, code) {

          prompt.showToast({

            message: 'handling fail, code = ' + code,

          })

          console.log('handling fail, code = ' + code);

        }

      })

    },

    download() {

      var that = this

      request.download({

        "url": this.imgurl,

        success: function (data) {

          console.log(data.token);

          that.downloadtoken = data.token

        },

        fail: function (data, code) {

          console.log("handling fail, code = " + code);

        },

        complete() {

          that.ondownloadcomplete()

        }

      })

 

    },

    ondownloadcomplete() {

      var that = this

      request.onDownloadComplete({

        "token": this.downloadtoken,

        success: function (data) {

          console.log(data.uri);

          that.downloadurl = data.uri

        },

        fail: function (data, code) {

          console.log("handling fail, code = " + code);

        }

      })

    }

  }

</script>

 

​

​

欲了解更多更全技术文章，欢迎访问https://developer.huawei.com/consumer/cn/forum/?ha_source=zzh