使用APICloud实现文档下载和预览功能

简介: 使用 APICloud 开发 app 时,可以使用 api.download 方法实现下载;预览文档可以使用 superFile 模块。superFile 模块封装了基于腾讯浏览服务 TBS,使用 X5Webkit 内核,实现文件的展示功能,支持多种文件格式(PDF、Word、Execl、TXT、PPT)。

文档下载是很多 app,尤其是企业应用中常用的功能。使用 APICloud 开发 app 时,可以使用 api.download 方法实现下载;预览文档可以使用 superFile 模块。superFile 模块封装了基于腾讯浏览服务 TBS,使用 X5Webkit 内核,实现文件的展示功能,支持多种文件格式(PDF、Word、Execl、TXT、PPT)。

 

在项目中添加 superFile 模块:

网络异常,图片无法展示
|

 

然后编译自定义 loader ,把自定义 loader 安装包安装到手机上,然后就可以使用 APICloud Studio3 wifi 同步功能,把代码同步到自定义 loader 中进行调试。 参考教程: https://docs.apicloud.com/Dev-Guide/Custom_Loader

 

实例代码如下:

<template>
  <safe-area>
    <scroll-view class="main" scroll-y>
      <view><text onclick='this.downloadDoc_open'>下载并打开文档</text></view>
    </scroll-view>
  </safe-area></template><style>.main { width: 100%;  height: 100%; background-color: #fff;
}</style><script>export default { name: 'test',
  data() {    return {
    }
  },
  apiready() {
  },  methods: {
    downloadDoc_open() {
      api.download({        url: '',  // 填写要下载文档的url
        savePath: 'fs://myapp/test.doc',        report: true,       cache: true,        allowResume: true
      }, function (ret, err) {        if (ret.state == 1) {         //下载成功
          console.log(JSON.stringify(ret));         if (api.systemType == 'ios') {            // ios  不需要初始化,直接open
            var superFile = api.require('superFile');
            superFile.open({              path: ret.savePath,
            })
          }         if (api.systemType == 'android') {            console.log(2);           var superFile = api.require('superFile');
            superFile.init(function (ret) {             if (ret.eventType == 'onViewInitFinished') {
                superFile.open({                  path: ret.savePath
                })
              }
            });
          }
        }
      });
    }
  }
}</script>

 


目录
相关文章
|
5月前
uniapp点击图片预览功能?
uniapp点击图片预览功能?
|
API
【工具推荐】 Obsidian 插件 Obsidian to Flomo 一键同步内容到 Flomo 插件
Obsidian to Flomo 是一款可以一键发送内容到 Flomo 的Obsidian 插件。
766 0
|
5月前
多功能在线二维码生成源码
上传即可使用,可以把电子名片、文本、wifi网络、电子邮件、短信、电话号码、网址等信息生成对应的二维码图片。
91 24
多功能在线二维码生成源码
|
5月前
|
iOS开发 开发者 索引
批量上传 iOS 应用程序截图的实用技巧
批量上传 iOS 应用程序截图的实用技巧
|
11月前
|
前端开发 JavaScript
uniapp上传图片至服务器,获得在线图片链接预览(实战)
uniapp上传图片至服务器,获得在线图片链接预览(实战)
416 0
|
12月前
|
小程序
【uniapp】视频分享预览小程序
【uniapp】视频分享预览小程序
|
iOS开发 开发者 索引
批量上传iOS应用程序截图的实用技巧
提交iOS应用程序截图到iTunes Connect是一项非常繁琐的任务,因为你必须上传多达数十张屏幕截图,这是一个重复而枯燥的过程。但是,我们有一个好消息要告诉开发者们,现在有一个工具可以帮助你批量上传,方便快捷。
|
移动开发 JSON 前端开发
前端H5选图预览到上传
在金融性质的App里,选择本地相册图片或者拍照,然后预览并且上传是一个典型的使用场景,比如常见的身份证信息上传。在最近接触的几家银行客户里,都反馈有类似的场景,并且在使用上都或多或少的遇到一些问题,最后找到我们,希望我们提供一些最佳实践。在这里分享下对应场景的一些优化解决方案。
390 0
前端H5选图预览到上传
APICloud 实现文档下载和预览功能
文档下载是很多app,尤其是企业应用中常用的功能。使用APICloud开发app时,可以使用api.download方法实现下载;预览文档可以使用superFile 模块。superFile 模块封装了基于腾讯浏览服务TBS,使用X5Webkit内核,实现文件的展示功能,支持多种文件格式(PDF、Word、Execl、TXT、PPT)。
302 0
APICloud 实现文档下载和预览功能
|
存储 移动开发 JSON
如何实现H5可视化编辑器的实时预览和真机扫码预览功能
所见即所得的设计理念在WEB IDE领域里一直是备受瞩目的功能亮点, 也能极大的提高** web coder的编程体验和编程效率. 笔者接下来就将对H5可视化编辑器的实时预览和真机扫码预览**功能做一次方案剖析, 为大家在设计类似产品的时候提供一些思路. 我们还是基于笔者开发的 H5-Dooring可视化编辑器作为案例来分析上述功能实现.
374 0