小工具知识网

当前位置: 首页 > 行业知识 > [uniapp小程序][文件和图片预览方法][读取文件/文件夹警告] 无法读取 文件或文件夹不在白名单中, 上传时会被忽略, 在真机上可能无法读取

行业知识

[uniapp小程序][文件和图片预览方法][读取文件/文件夹警告] 无法读取 文件或文件夹不在白名单中, 上传时会被忽略, 在真机上可能无法读取

2026-11-07 04:44:26 来源:互联网转载

文件图片预览方式:

利用微信自带的wx.downloadFile() + wx.openDocument()

 uni-app官网 | uni.uploadFile(OBJECT) 详解

https://uniapp.dcloud.net.cn/api/request/network-file.html#downloadfile

uni-app官网 | uni.uni.openDocument(OBJECT)详解

https://uniapp.dcloud.net.cn/api/file/file.html#opendocument

代码如下

读取文件/文件夹警告出现原因:

解决方案:

我们先使用uni.downloadFile把后台接口或者本地的PDF以及其他格式转为获取到本地临时路径。然后再使用uni.openDocument就可以了。

 

源码如下:

{{ item.name }}
// 文件类型识别,用正则去识别不同文件类型,然后对应不同文件类型去做不同操作Preview(item) {      console.log(item);      // 定义图片类型的正则表达式      const imageRegex = /(\.jpg|\.jpeg|\.png)$/i;      // 定义文档类型的正则表达式      const docRegex = /(\.doc|\.docx|\.pdf)$/i;      // // 定义其他文件类型的正则表达式       const othersRegex = /(\.txt|\.csv|\.xlsx)$/i;      // 利用正则表达式判断文件类型      if (imageRegex.test(item.name)) {        console.log("图片类型");        this.lookImage(item.url) //预览图片      } else if (docRegex.test(item.name)) {        console.log("文档类型");        this.lookFile(item.url) //预览文件      } else if (othersRegex.test(item.name)) {        console.log("其他文件类型");      } else {        uni.showToast({          title: `未知文件类型`,          icon: 'none',          duration: 2000        })      }},// 预览图片lookImage(url) {    let imgArray = [];    imgArray[0] = url    uni.previewImage({current: 0,urls: imgArray    })},//预览文件//此处的参数url为uni.uploadFile上传文件,返回的永久地址lookFile(url) {console.log('预览文件的url:',url)uni.downloadFile({url:url,success:function(res){if(res.statusCode === 200){console.log("临时路径",res.tempFilePath)let filePath = res.tempFilePath//调用uni.openDocument打开文件uni.openDocument({filePath: filePath,success: function (res) {console.log("打开文档成功");},fail: function (res) {console.log("uni.openDocument,fail");console.log(res)},complete: function (res) {console.log("uni.openDocument,complete");console.log(res)}});}},fail:function(err){console.log('文件下载失败',err)}})},

 

上一篇:每日一练:LeeCode-701、二叉搜索树中的插入操作【二叉搜索树+DFS+全搜】

下一篇:苹果手机怎么设置imap服务器?