当前位置: 首页 > article >正文

微信小程序中的文件查看方法

获得后缀名判断类型,如果是图片用ex.previewImage(),如果是视频,用uni.previewMedia(),如果是word文档这些的,用 uni.downloadFile来下载资源后用 uni.saveFile来保存到本地,uni.openDocument来打开新的网页,如果打不开的话则返回说到PC端去打开

 const lookFile = (url) => {
  let index = url.lastIndexOf('.');
  let filttype = url.slice(index + 1);
  if (url.includes('?token')) {
    filttype = url.split('?token')[0].split('.').slice(-1);
  }
  uni.showLoading({
    title: '加载中',
    mask: true,
  });
  if (['bmp', 'jpg', 'jpeg', 'png', 'gif', 'image'].some((item) => item == filttype)) {
    uni.previewImage({
      current: url, // 当前显示图片的 http 链接
      urls: [url], // 需要预览的图片 http 链接列表
      success() {
        uni.hideLoading();
      },
    });
  } else if (['mp4', 'avi'].some((item) => item == filttype)) {
    uni.previewMedia({
      sources: [
        {
          url,
          type: 'video',
        },
      ], // 需要预览的资源列表
      current: 1, // 当前显示的资源序号,
      success() {
        uni.hideLoading();
      },
      fail: function (err) {
        uni.showToast({
          title: '播放失败',
          icon: 'none',
        });
        console.log(err);
      },
    });
  } else if (['zip', 'rar'].some((item) => item == filttype)) {
    uni.showToast({
      title: '暂不支持预览',
      icon: 'none',
    });
  } else {
    uni.downloadFile({
      //下载
      url, // 从后端获取的url地址,赋值在标签的data属性上
      header: {
        token: uni.getStorageSync('token'),
        'content-type': 'application/x-www-form-urlencoded;charset=UTF-8',
      },
      success: function (res) {
        const tempFilePath = res.tempFilePath;
        uni.openDocument({
          //新开页面打开文档
          filePath: tempFilePath,
          showMenu: true,
          fileType: filttype,
          success: function (res) {
            console.log('打开文档成功');
          },
          fail: function (err) {
            console.log('打开文档失败', err);
          },
          complete: () => {
            uni.hideLoading();
          },
        });
        /* uni.saveFile({
          //保存文件到本地
          tempFilePath,
          success(res) {
            const savedFilePath = res.savedFilePath;
            const filttypeName = filttype;
            uni.openDocument({
              //新开页面打开文档
              filePath: savedFilePath,
              showMenu: true,
              fileType: filttypeName,
              success: function (res) {
                console.log('打开文档成功');
              },
              fail: function (err) {
                console.log('打开文档失败', err);
              },
              complete: () => {
                uni.hideLoading();
              },
            });
          },
        }); */
      },
      fail: function (err) {
        uni.showToast({
          title: '下载失败',
          icon: 'none',
        });
        console.log(err);
      },
    });
  }
};

http://www.kler.cn/news/357805.html

相关文章:

  • Vulnhub打靶-matrix-breakout-2-morpheus
  • 信息学奥赛 csp-j 2023 普及组 第一轮试题及答案
  • Debian12离线部署docker详细教程
  • HDFS详细分析
  • 英飞达医学影像存档与通信系统 WebUserLogin.asmx 信息泄露漏洞复现
  • 视频转文字工具搜集
  • 深入探索 APKTool:Android 应用的反编译与重打包工具
  • 新基建下的园区智慧化变革 | 科技驱动未来开放式智慧园区
  • Ubuntu20.04下安装多CUDA版本,以及后续切换卸载
  • 云计算环境下的等保测评:挑战、策略与实践
  • prim算法
  • 基于yolov8、yolov5的行人检测系统(含UI界面、训练好的模型、Python代码、数据集)
  • 理解JVM
  • Leetcode—1279. 红绿灯路口【简单】Plus(多线程)
  • redis的发布订阅模式
  • vue3缓存菜单
  • Python从0到100(六十四):Python OpenCV-图像运算进阶实战
  • laravel-数据库查询
  • HarmonyNext保存Base64文件到Download下
  • 使用多路复用技术提升网站性能