微信小程序下载照片（显示进度条）

downloadTask.onProgressUpdate((res) => {
  console.log('下载进度',res.progress)
  console.'已经下载的数据长度',51); font-weight: 700;">res.totalBytesWritten)
  console.'预期需要下载的数据总长度',51); font-weight: 700;">res.totalBytesExpectedToWrite)
})
复制代码

1.2、取消监听下载进度变化事件

DownloadTask.offProgressUpdate(function callback)
复制代码

1.3、 监听 HTTP Response Header 事件

DownloadTask.onHeadersReceived(callback)
复制代码

1.4、 取消监听 HTTP Response Header 事件

DownloadTask.offHeadersReceived(callback)
复制代码

1.5、中断下载任务

DownloadTask.abort()
复制代码

二、downloadFile 下载文件理解

• 本质：方法
• 功能：下载文件资源到本地
• 返回值：downloadTask对象

success 返回的两个参数

• tempFilePath

  • 临时文件路径。
  • 如果没传入 filePath 指定文件存储路径，则下载后的文件会存储到一个临时文件
  • string

• statusCode

  • 开发者服务器返回的 HTTP 状态码
  • number

,header:'',//HTTP 请求的 Header，Header 中不能设置 Referer
  filePath://指定文件下载后存储的路径
  success(res) {
    // 只要服务器有响应数据，就会把响应内容写入文件并进入 success 回调
    //业务需要自行判断是否下载到了想要的内容
    if (res.statusCode === 200) {
      wx.saveImageToPhotosAlbum({
        filePath: res.tempFilePath
      })
    }
  },fail(err){
      console.log(err)
  },complete(res){
      .log(res)
  }
})
复制代码

三、saveImageToPhotosAlbum 理解

• 功能：保存图片到系统相册

/**
   * [downloadPhoto 下载照片]
   */
  downloadPhoto (e) {
    let imgUrl = e.currentTarget.dataset.src
    // 下载监听进度
    const downloadTask = wx.downloadFile({
      url: imgUrl,success: function (res) {
        console.log(res)
        if (res.statusCode === 200) {
          wx.saveImageToPhotosAlbum({
            filePath: res.tempFilePath,51); font-weight: 700;">function (res) {
              wx.showToast({
                title: '保存图片成功'
              })
            },fail: '保存图片失败'
              })
            }
          })
        }
      }
    })
    downloadTask.onProgressUpdate((res) => {
      res.progress === 100) {
        this.setData({
          progress: ''
        })
      } else {
        this.setData({
          progress: res.progress + '%'
        })
      }
    })
  },复制代码