用appcan开发的app如何在手机上查看附件和预览附件呢?今天就为大家介绍一下,用APP看附件实大是太方便了。

1、直接上代码吧,首先要初始化插件用到的所有方法。这个方法中

cbIsFileExistByPath 是判断文件是否存在时的回调函数。如果不存在就到服务器上去下载,如果存在就直接打开。
cbCreateDownloader 创建下载对象回调,
onStatus 是下载状态的回调,在这里面我个可以在页面上加入下载的进度条。
 
        //初始化
appcan.ready(function () { initLoadDown();
});
var docName;
var savePath;
var serviceUrl;
var id; function initLoadDown() {
var cText = 0;
var cJson = 1;
var cInt = 2;
uexFileMgr.cbIsFileExistByPath = function (opId, dataType, data) {
if (data == 0) {
//不存在
appcan.window.openToast("正在加载", 2000, 5, 1);
uexDownloaderMgr.createDownloader(id);
} else if (data == 1) { appcan.window.openToast("正在打开", 1000, 5, 1);
uexDocumentReader.openDocumentReader(savePath);//打开 } else {
appcan.window.openToast("出错啦", 2000, 5, 0);//出错//出错
}
} uexDownloaderMgr.cbCreateDownloader = function (opCode, dataType, data) {
switch (dataType) {
case cText:
alert("uex.cText");
break;
case cJson:
alert("uex.cJson");
break;
case cInt:
var headJson = '{"Content-type":"application/json;charset=utf-8"}';
uexDownloaderMgr.setHeaders(1, headJson);
uexDownloaderMgr.download(id, serviceUrl, savePath, 1); break;
default:
appcan.window.openToast("出错啦", 2000, 5, 0);//出错
}
}
uexDownloaderMgr.onStatus = function (opCode, fileSize, percent, status) {
switch (status) {
case 0:
document.getElementById('percentage').innerHTML = "<span style='color:green'>下载进度:" + percent + "%</span>";
break;
case 1:
uexDownloaderMgr.closeDownloader(id);
uexDocumentReader.openDocumentReader(savePath); break;
case 2:
appcan.window.openToast("下载失败,系统中找不到该文件", 2000, 5, 0);
uexDownloaderMgr.closeDownloader(id);
break;
case 3:
appcan.window.openToast("下载取消", 2000, 5, 0);
break;
}
}
}

2、用户在点击文件时时肯定会触发单击事件。这里是所有预览开始方法。只要判断文件是否存在就行了,他们自动触发1中的回调函数cbIsFileExistByPath

savePath 是你手机上文件的保存路径,serviceUrl是服务器中文件的路径。参数name是文件件,id随便给一个值就行,可能是为了在手机上区分不同文件。v是时间戳加文件名(存入数据的名字和存在服务器中的名字)

function openDocument(v, name) {
savePath = "wgt://data/down/" + name;
id = 2;
var d = new Date();
var _year = d.getFullYear();
serviceUrl = GetApprovalServiceHostIp() + "/upload/"+ _year +"/" + v;
uexFileMgr.isFileExistByPath(id, savePath);//根据路径判断文件是否存在
};

3、代码已完成了,因为很多功能都是APPCAN公共的插件帮我们完成了,那我就要在打包是加入这些插件。

重要事件:有需要微信投票、阅读量、注册、点赞的朋友可以找我哦,百万水军。tel/vx:18963948278

appcan 文件下载与预览的更多相关文章

  1. minio + kkFileView 实现在线预览

    minio上传的pdf之类文件不支持预览,地址在浏览器访问时会直接下载,现在搭配kkFileView文件预览 1.minio查看之前的安装方式 2.kkFileView安装 docker方式 1.拉取 ...

  2. nginx,文件下载,预览,防止浏览器下载时直接打开,防止预览时直接下载文件,解决nginx谷歌浏览器不支持下载问题

    公司项目逐渐增多,对效率的要求越来越高,不同项目分部不同服务器,最初想用nginx 就是为了多个项目用一个url和服务器宕机解决方案 nginx也可作为附件服务器,毕竟nginx也对静态文件支持较好, ...

  3. 使用canvas实现图片预览、缩放(压缩)以及生成文件下载

    参考 https://www.runoob.com/html/html5-canvas.html https://www.cnblogs.com/yuanzhiguo/p/8288822.html h ...

  4. 解决 Asp.Net5 在视频文件下载预览时无法快进的问题

    前情提要 https://www.cnblogs.com/puzhiwei/p/15265005.html 在解决.Net5 如何修改Content-Disposition实现在线预览的功能后,我又遇 ...

  5. 实战动态PDF在线预览及带签名的PDF文件转换

    开篇语: 最近工作需要做一个借款合同,公司以前的合同都是通过app端下载,然后通过本地打开pdf文件,而喜欢创新的我,心想着为什么不能在线H5预览,正是这个想法,说干就干,实践过程总是艰难的,折腾了3 ...

  6. [SWF]在线预览文档下载

    写本文的缘由:领导有些项目文档需要审阅,网站上的文档只能在线预览,没有提供下载.开始用截屏的方式,可想而知这将会是多大的重复性劳动.所以研究了一下,发现可以曲线救国,所以在这里分享一下. 问题描述:这 ...

  7. uploadify插件实现多个图片上传并预览

    使用uploadify插件可方便实现图片上传功能.兼容ie6.ie7. 上传成功之后使用插件的回调函数读取json数据,根据url实现图片预览. 效果图: 点击浏览文件上传图片,图片依次在右侧显示预览 ...

  8. Java实现文件的预览

    最近项目需要用到文件的预览功能,就开始在网上收集资料,学习了几种文件预览的方法.我集成到我项目内测试的有以下三种,最后使用的是第三种: 直接使用别人提供的服务 例如:office web 365 使用 ...

  9. 动态PDF在线预览

    实战动态PDF在线预览及带签名的PDF文件转换 开篇语: 最近工作需要做一个借款合同,公司以前的合同都是通过app端下载,然后通过本地打开pdf文件,而喜欢创新的我,心想着为什么不能在线H5预览,正是 ...

随机推荐

  1. JavaFX桌面应用-loading界面

    上次使用JavaFX开发了一个视频转码工具,当用户点击"启动"按钮开始转码的时候,会禁用启动按钮,防止多次启动转码. 这种处理方式对用户来说可能并是很友好,其实可以在启动转码的时弹 ...

  2. A review of learning in biologically plausible spiking neural networks

    郑重声明:原文参见标题,如有侵权,请联系作者,将会撤销发布! Contents: ABSTRACT 1. Introduction 2. Biological background 2.1. Spik ...

  3. [PKUWC2018]Minimax 题解

    根据题意,若一个点有子节点,则给出权值:否则可以从子节点转移得来. 若没有子节点,则直接给出权值: 若只有一个子节点,则概率情况与该子节点完全相同: 若有两个子节点,则需要从两个子节点中进行转移. 如 ...

  4. Chrome 发一个请求,后台Controller 执行2次

    chrome 每发一次请求,都会执行2次controller,换成其他浏览器就不会. 最后发现是这个插件导致的,果断删除.

  5. 关于Chrome浏览器自动同步的问题

    Chrome浏览器是开发者最喜欢的浏览器,没有之一,那么公司办公和在家办公的话数据需要有一致性,这个时候就用到了浏览器的自动同步的功能 因为网络的问题,谷歌账户很难登录,基本需要VPN翻墙处理之后才能 ...

  6. light Map

    Unity5中lightmap的坑 http://blog.csdn.net/langresser_king/article/details/48914901 Unity中光照贴图一二坑及解决办法 h ...

  7. unity shader

    Unity新的shader叫做 基于物理渲染的shader,先介绍下新的shader具有的特性: Energy Conservation(能量守恒):这是一个基于物理的概念,它确保物体反射的光线不会比 ...

  8. 如何让css样式只在当前组件起作用?

    当前组件<style>写成<style  scoped>

  9. vant ui TabBar封装

    TabBar.vue基本上是放在App.vue里面,都存在 <template> <div id="app"> <home-tab-bar :tar- ...

  10. 「查缺补漏」巩固你的Nginx知识体系

    Nginx篇 基本介绍 Nginx是一款轻量级的 Web服务器 / 反向代理服务器 / 电子邮件(IMAP/POP3)代理服务器,主要的优点是: 支持高并发连接,尤其是静态界面,官方测试Nginx能够 ...