uniapp实现远程图片下载到手机相册功能

在 UniApp 中实现点击下载图片到相册的功能，需要以下几个步骤：

1. 下载图片到本地（uni.downloadFile）

2. 将图片保存到相册（uni.saveImageToPhotosAlbum）

完整代码示例：

<template>
  <view @click="downloadAndSaveImage">点击下载并保存图片</view>
</template>

<script>
export default {
  data() {
    return {
      imageUrl: 'https://example.com/your-image.jpg' // 替换为你的图片地址
    }
  },
  methods: {
    async downloadAndSaveImage() {
      try {
        // 1. 下载图片
        const { tempFilePath } = await new Promise((resolve, reject) => {
          uni.downloadFile({
            url: this.imageUrl,
            success: (res) => {
              if (res.statusCode === 200) {
                resolve(res);
              } else {
                reject(new Error('下载失败'));
              }
            },
            fail: (err) => {
              reject(err);
            }
          });
        });

        // 2. 获取相册权限
        await new Promise((resolve, reject) => {
          uni.getSetting({
            success: (res) => {
              if (!res.authSetting['scope.writePhotosAlbum']) {
                uni.authorize({
                  scope: 'scope.writePhotosAlbum',
                  success: resolve,
                  fail: () => {
                    uni.showToast({ title: '请开启相册权限', icon: 'none' });
                    reject(new Error('未授权写入相册'));
                  }
                });
              } else {
                resolve();
              }
            }
          });
        });

        // 3. 保存图片到相册
        await new Promise((resolve, reject) => {
          uni.saveImageToPhotosAlbum({
            filePath: tempFilePath,
            success: resolve,
            fail: (err) => {
              reject(err);
            }
          });
        });

        uni.showToast({ title: '保存成功' });
      } catch (err) {
        uni.showToast({ title: '保存失败', icon: 'none' });
        console.error(err);
      }
    }
  }
}
</script>

注意事项：

• 跨域问题：确保图片 URL 支持跨域访问。
• 合法域名：在小程序端使用时，图片 URL 必须配置在小程序后台的 下载域名白名单 中。
• 权限申请：首次保存需用户主动触发授权（如点击按钮），不能自动静默执行。
• 临时路径：uni.downloadFile 返回的是临时路径，保存后可删除或复用。

可选增强功能：

• 使用 uni.getImageInfo 预加载图片信息；
• 添加 loading 状态提示；
• 在 H5 端可用 <a download> 实现替代方案。

如果你有具体使用的平台（如微信小程序、H5、App）或其他需求，我们可以一起交流学习。