您的位置:

Uniapp下载详解

一、Uniapp下载功能

Uniapp是一款跨平台开发工具,可以在使用一套代码的情况下同时开发iOS、Android以及H5应用。为了让开发者方便地进行开发,Uniapp提供了一套完善的下载机制。

在使用Uniapp进行开发的时候,常常需要下载一些资源或者文件,这时候就需要用到Uniapp提供的下载功能。Uniapp下载功能可以完成以下几方面的功能:

  • 下载网络上的图片和视频
  • 下载远程页面
  • 下载Jar包以及其他二进制文件
  • 下载本地文件

Uniapp下载功能可以把下载文件保存到本地,为开发者提供了很大的便利。

二、Uniapp下载视频到本地

Uniapp提供了一种方式,可以将网络上的视频下载到本地。需要用到uni.downloadFile()函数,需要开发者传入视频的网络URL地址以及本地存储的路径。例如:

uni.downloadFile({
  url: 'http://example/video.mp4',
  success: (res) => {
    if (res.statusCode === 200) {
      uni.saveVideoToPhotosAlbum({
        filePath: res.tempFilePath,
        success: () => {
          uni.showToast({
            title: '保存成功'
          })
        },
        fail: () => {
          uni.showToast({
            title: '保存失败'
          })
        }
      })
    }
  },
  fail: () => {
    uni.showToast({
      title: '下载失败'
    })
  }
})

以上代码会将http://example/video.mp4下载到本地存储,并保存到本地相册中。

三、Uniapp下载页面

在Uniapp中,下载页面的本质就是下载一个远程的HTML页面,并且通过WebView进行展示。Uniapp提供了一个uni.downloadFile()函数,可以用来完成远程页面下载。例如:

uni.downloadFile({
  url: 'http://example/index.html',
  success: (res) => {
    if (res.statusCode === 200) {
      uni.navigateTo({
        url: '/pages/webview/index?url=' + res.tempFilePath
      })
    }
  },
  fail: () => {
    uni.showToast({
      title: '下载失败'
    })
  }
})

以上代码会将http://example/index.html下载到本地存储,并且通过uni.navigateTo()函数进行打开。

四、Uniapp下载Jar包

在Uniapp开发中,有时候需要下载Jar包以及其他的二进制文件,这时候就需要用到uni.downloadFile()函数和uni.saveFile()函数。例如:

uni.downloadFile({
  url: 'http://example/jarfile.jar',
  success: (res) => {
    if (res.statusCode === 200) {
      uni.saveFile({
        tempFilePath: res.tempFilePath,
        success: (file) => {
          uni.showToast({
            title: '下载成功'
          })
        },
        fail: () => {
          uni.showToast({
            title: '保存失败'
          })
        }
      })
    }
  },
  fail: () => {
    uni.showToast({
      title: '下载失败'
    })
  }
})

以上代码会将Jar包下载到本地存储,并且通过uni.saveFile()函数保存到本地。

五、Uniapp下载uView报错

在Uniapp中使用uView的过程中,有时候会出现下载uView报错的情况。大多数情况下是因为编译环境问题导致的。这时候需要在manifest.json中添加如下代码:

"app-plus": {
  "name": "hello uni-app",
  "type": "APP",
  "versionCode": 1,
  "versionName": "1.0.0",
  "uview-ui": {
    "noPromise": true
  }
}

以上代码会禁用uView的promise支持,一般可以解决uView下载报错的问题。

六、Uniapp下载文件到手机

在Uniapp中,可以直接将文件下载到手机的内置存储器中。需要用到uni.downloadFile()函数和uni.saveFile()函数。例如:

uni.downloadFile({
  url: 'http://example/image.jpg',
  success: (res) => {
    if (res.statusCode === 200) {
      uni.saveFile({
        tempFilePath: res.tempFilePath,
        success: (file) => {
          uni.saveImageToPhotosAlbum({
            filePath: file.savedFilePath,
            success: () => {
              uni.showToast({
                title: '保存成功'
              })
            },
            fail: () => {
              uni.showToast({
                title: '保存失败'
              })
            }
          })
        },
        fail: () => {
          uni.showToast({
            title: '保存失败'
          })
        }
      })
    }
  },
  fail: () => {
    uni.showToast({
      title: '下载失败'
    })
  }
})

以上代码会将http://example/image.jpg下载到本地存储,并且通过uni.saveImageToPhotosAlbum()函数保存到本地相册中。

七、Uniapp下载完提示完成

在Uniapp中,可以通过uni.downloadFile()函数的success回调函数来提示下载完成。例如:

uni.downloadFile({
  url: 'http://example/image.jpg',
  success: (res) => {
    if (res.statusCode === 200) {
      uni.showToast({
        title: '下载完成'
      })
    }
  },
  fail: () => {
    uni.showToast({
      title: '下载失败'
    })
  }
})

以上代码会将http://example/image.jpg下载到本地存储,并且通过uni.showToast()函数提示下载完成。

八、Uniapp下载文件到本地

在Uniapp中,可以将文件下载到本地存储,需要用到uni.downloadFile()函数和uni.saveFile()函数。例如:

uni.downloadFile({
  url: 'http://example/image.jpg',
  success: (res) => {
    if (res.statusCode === 200) {
      uni.saveFile({
        tempFilePath: res.tempFilePath,
        success: (file) => {
          uni.showToast({
            title: '保存成功'
          })
        },
        fail: () => {
          uni.showToast({
            title: '保存失败'
          })
        }
      })
    }
  },
  fail: () => {
    uni.showToast({
      title: '下载失败'
    })
  }
})

以上代码会将http://example/image.jpg下载到本地存储,并且通过uni.saveFile()函数保存到本地。

九、Uniapp下载的文件在哪里

在Uniapp中,使用uni.downloadFile()函数下载的文件都是保存在本地存储器中的,保存的位置在uni.saveFile()函数保存时指定。在Android平台下,默认保存在/storage/emulated/0/Android/data/{appid}/files/目录下。在iOS平台下,默认保存在应用的沙盒目录中。

十、Uniapp下载管理器实现选取

在Uniapp中,可以通过uni.downloadFile()函数和uni.saveFile()函数实现下载管理器。可以先使用uni.downloadFile()函数将文件下载到本地存储器中,然后通过uni.saveFile()函数将文件保存到指定的文件目录中。这样就可以实现下载并管理文件了。