React Native中rn-fetch-blob下载文件完整性保存问题求助

具体实现步骤 #

1. 定义临时路径与最终保存路径，临时文件建议用.tmp后缀区分
2. 发起下载请求时，指定临时路径作为下载中的存储位置
3. 下载成功后，通过文件移动操作将临时文件转移到目标路径
4. 下载取消/失败时，立即删除临时文件

代码示例 #

import RNFetchBlob from 'rn-fetch-blob';

// 配置临时文件和最终文件路径
const tempFilePath = `${RNFetchBlob.fs.dirs.DocumentDir}/temp_download.tmp`;
const finalSavePath = `${RNFetchBlob.fs.dirs.DocumentDir}/target_file.pdf`;

// 保存下载任务引用，用于取消操作
let downloadTask = null;

const startFileDownload = async () => {
  try {
    // 先清理可能残留的旧临时文件
    await RNFetchBlob.fs.unlink(tempFilePath).catch(() => {});

    // 发起下载，指定临时路径存储
    downloadTask = RNFetchBlob.config({
      path: tempFilePath,
      // 可选：监听下载进度
      progress: (received, total) => {
        console.log(`进度：${Math.floor((received/total)*100)}%`);
      }
    }).fetch('GET', 'https://your-api-domain.com/download-file', {
      // 按需添加请求头，比如 Authorization: Bearer xxx
    });

    // 等待下载完成
    const response = await downloadTask;
    // 移动临时文件到最终路径（原子操作，不会出现中间状态）
    await RNFetchBlob.fs.mv(tempFilePath, finalSavePath);
    console.log('文件下载并保存成功');
  } catch (error) {
    console.log('下载取消或失败');
    // 无论失败原因，删除临时文件
    await RNFetchBlob.fs.unlink(tempFilePath).catch(() => {});
  } finally {
    downloadTask = null;
  }
};

// 取消下载的方法
const cancelCurrentDownload = () => {
  if (downloadTask) {
    downloadTask.cancel();
  }
};

关键细节说明 #

• 临时文件路径可根据下载文件类型调整后缀（比如.temp.pdf），方便排查问题
• 每次下载前清理临时文件，避免之前的残留文件干扰
• 文件移动（mv）是原子性操作，确保只有完整文件会出现在最终路径
• 取消下载时，downloadTask.cancel()会触发catch块，自动执行临时文件删除

内容的提问来源于stack exchange，提问作者Arjun_B