当前位置：首页 > uni-app

uniapp 断点下载

2026-03-05 01:07:04uni-app

uniapp 断点下载实现方法

在uniapp中实现断点下载功能，主要通过uni.downloadFileAPI结合本地存储实现。以下是具体实现步骤：

配置manifest.json 确保在manifest.json文件中配置了下载权限：

"networkTimeout": {
  "downloadFile": 60000
},
"permission": {
  "scope.write": {
    "desc": "需要写入文件权限"
  }
}

核心代码实现

// 存储下载任务对象
let downloadTask = null
// 存储已下载大小
let downloadedSize = 0
// 文件总大小
let totalSize = 0

function startDownload(url) {
  // 检查本地是否已有部分下载
  const savedInfo = uni.getStorageSync('downloadInfo')
  if (savedInfo && savedInfo.url === url) {
    downloadedSize = savedInfo.downloadedSize
  }

  downloadTask = uni.downloadFile({
    url: url,
    header: {
      'Range': `bytes=${downloadedSize}-`
    },
    success: (res) => {
      if (res.statusCode === 206) {
        // 处理文件保存
        uni.saveFile({
          tempFilePath: res.tempFilePath,
          success: (saveRes) => {
            uni.removeStorageSync('downloadInfo')
            console.log('文件保存成功', saveRes.savedFilePath)
          }
        })
      }
    },
    fail: (err) => {
      console.error('下载失败', err)
    }
  })

  // 监听下载进度
  downloadTask.onProgressUpdate((res) => {
    totalSize = res.totalBytesExpectedToWrite
    downloadedSize = res.totalBytesWritten
    const progress = (res.totalBytesWritten / res.totalBytesExpectedToWrite * 100).toFixed(2)
    console.log(`下载进度: ${progress}%`)

    // 保存下载信息到本地
    uni.setStorageSync('downloadInfo', {
      url: url,
      downloadedSize: downloadedSize,
      totalSize: totalSize
    })
  })
}

// 暂停下载
function pauseDownload() {
  if (downloadTask) {
    downloadTask.abort()
    downloadTask = null
  }
}

// 继续下载
function resumeDownload() {
  startDownload(url)
}

注意事项

跨平台兼容性：不同平台对Range头的支持可能不同，iOS和Android通常支持良好，但部分小程序平台可能有限制。
存储管理：需要定期清理未完成的下载记录，避免存储空间浪费。
文件验证：下载完成后建议进行文件完整性校验，特别是大文件传输。
网络状态监听：建议添加网络状态变化监听，在网络恢复后自动重试。
权限处理：在Android平台上需要动态申请存储权限。

扩展功能实现

大文件分块下载 对于超大文件，可采用分块下载策略：

function chunkDownload(url, chunkSize = 1024 * 1024) {
  // 获取文件总大小
  uni.request({
    url: url,
    method: 'HEAD',
    success: (res) => {
      const totalSize = parseInt(res.header['Content-Length'])
      const chunks = Math.ceil(totalSize / chunkSize)

      for (let i = 0; i < chunks; i++) {
        const start = i * chunkSize
        const end = Math.min((i + 1) * chunkSize - 1, totalSize - 1)

        uni.downloadFile({
          url: url,
          header: { 'Range': `bytes=${start}-${end}` },
          success: (chunkRes) => {
            // 合并文件块
          }
        })
      }
    }
  })
}

后台下载实现 通过plus.downloader实现后台下载：

const createBackgroundDownload = () => {
  if (plus.os.name === 'iOS') {
    plus.downloader.createDownload(
      url,
      { method: 'GET' },
      (d, status) => {
        if (status === 200) {
          console.log('下载完成')
        }
      }
    ).start()
  }
}

以上方案可根据实际需求进行调整和扩展，建议在实际开发中进行充分测试以确保各平台兼容性。

uniapp 断点下载