save-video-to-photos-album.uvue

<template>
  <!-- #ifdef APP -->
  <scroll-view style="flex:1">
  <!-- #endif -->
    <page-head :title="title"></page-head>
    <view class="uni-padding-wrap">
      <video class="video" :src="src" :controls="true"></video>
      <button type="primary" class="margin-top-10" @click="saveVideo">将视频保存到手机相册</button>
    </view>
  <!-- #ifdef APP -->
  </scroll-view>
  <!-- #endif -->
</template>

<script>
  export default {
    data() {
      return {
        title: 'saveVideoToPhotosAlbum',
        src: '/static/test-video/10second-demo.mp4',
        // 自动化测试
        success: false
      }
    },
    methods: {
      saveVideo() {
        uni.saveVideoToPhotosAlbum({
          filePath: this.src,
          success: (_) => {
            console.log("saveVideoToPhotosAlbum success");
            uni.showToast({
              position: "center",
              icon: "none",
              title: "视频保存成功，请到手机相册查看"
            });
            this.success = true;
          },
          fail: (err) => {
            uni.showModal({
              title: "保存视频到相册失败",
              content: JSON.stringify(err),
              showCancel: false
            });
            this.success = false;
          }
        });
      }
    }
  }
</script>

<style>
  .video {
    align-self: center;
  }

  .margin-top-10 {
    margin-top: 10px;
  }
</style>