微信小程序一键保存视频到手机相册功能(视频来源为链接)

zrong180106

已于 2022-11-11 13:12:25 修改

阅读量4.4k

点赞数 1

文章标签：微信小程序前端 javascript

于 2022-11-11 13:05:23 首次发布

本文链接：https://blog.csdn.net/qq_44830060/article/details/127804235

版权

流程:

1. 首先第一次要获取用户授权,授权使用相册权限

        调用this.onStartDownload()函数获取用户授权

2.拿到视频地址就可以实现下载功能了

3.主要的api:

        wx.downloadFile()

        wx.getFileSystemManager()

        wx.saveVideoToPhotosAlbum()

视频链接为 http://xxxxxx.mp4 形式

通过https下载

wx.downloadFile({
      url: this.data.videoUrl, // 视频资源地址
      filePath: wx.env.USER_DATA_PATH + '/' + fileName + '.mp4',
      header: {
        "Content-Type":"video/mp4"
        },
      success: res => {
        console.log('downloadFile成功回调res:', res)
        wx.hideLoading()
        let FilePath= res.filePath; // 下载到本地获取临时路径
        let fileManager = wx.getFileSystemManager();
        // 保存到相册
        wx.saveVideoToPhotosAlbum({ // 保存到相册
          filePath: FilePath,
          success: file => {
            // console.log('saveVideoToPhotosAlbum成功回调file:', file)
            wx.showToast({
              title: '视频保存成功',
              duration: 3000,
              icon: 'none'
            })
            fileManager.unlink({ // 删除临时文件
              filePath: wx.env.USER_DATA_PATH + '/' + fileName + '.mp4',
            })
          },
          fail: err => {
            // console.log('saveVideoToPhotosAlbum失败回调err:', err)
            fileManager.unlink({ // 删除临时文件
              filePath: wx.env.USER_DATA_PATH + '/' + fileName + '.mp4'
            })
            wx.showToast({
              title: '视频保存失败',
              duration: 3000,
              icon: 'none'
            })
          },
          complete() {
            wx.hideLoading()
          }
        })
        //
      },
      fail(e) {
        console.log('失败e', e)
        wx.showToast({
          title: '视频保存失败1',
          duration:3000,
          icon:'none'
        })
      },
      complete() {
        // wx.hideLoading();
      }
})

//获取用户授权相册权限
onStartDownload() {
    
    wx.getSetting({
      success: (res) => {
        if (res.authSetting['scope.writePhotosAlbum'] === undefined) {
          wx.authorize({
            scope: 'scope.writePhotosAlbum',
            success: () => {
              console.log('打开了授权')
              this.downloadVideo()
            },
            fail: (err) => {
              console.log('授权失败:', err)
            }
          })
        } else if (!res.authSetting['scope.writePhotosAlbum']) {
          wx.openSetting({
            success: (res) => {
              console.log('openSetting成功回调:res', res)
              if (res.authSetting['scope.writePhotosAlbum']) {
                console.log('授权了')
                this.downloadVideo()
              } else {

              }
            },
            fail: (err) => {

            },
          })
        } else {
          this.downloadVideo()
        }
      }
    })
  },