uniapp的h5端保存文件

诸葛博仌

已于 2024-03-02 18:57:05 修改

阅读量3k

点赞数 8

CC 4.0 BY-SA版权

文章标签： uni-app

于 2024-03-02 18:45:22 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_48811255/article/details/136420325

本文介绍了如何在H5环境下，由于uni.saveFile不支持，通过安装并引入file-saver第三方库，实现文件的下载和本地保存，具体步骤包括安装file-saver、引入库以及利用uni.downloadFileAPI进行下载操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、因为h5端不支持uni.saveFile方法保存文件，要使用js的第三方库来进行保存文件

1、安装file-saver：在项目目录中运行命令 npm install file-saver --save 来安装file-saver库
2、引入file-saver：使用页面import { saveAs } from 'file-saver';引入file-saver库。

2、根据文件地址信息下载保存文件

		uni.downloadFile({
            url: fileUrl,//下载文件的地址
            success: (res) => {
              if (res.statusCode === 200) {
                /** 
                 *保存文件到本地
                 *res.tempFilePath：下载好文件的临时路径，用来保存
                 *this.uploadedFile.name：下载的文件名称
				 */       
                saveAs(res.tempFilePath,this.uploadedFile.name);
              }
            }
          });