微信小程序文件预览

最近遇到了小程序文件预览的需求,简单说一下吧:


一、小程序的文件预览仅仅支持.doc .docx .xls .xlsx .ppt .pptx .pdf这几种格式,不支持图片预览

二、然而图片预览在程序中也是必不可少的功能,我们可以把土拍呢预览的方法放进文件预览中,如果有名字可以从名字中判断是图片直接进行预览

if (name != "" && name != undefined) {

            if (name.indexOf("png") != -1 || name.indexOf("jpg") != -1 || name.indexOf("jpeg") != -1) {

                //通过URL获取新的url 

                let pictureId = url.split('/').pop();

                let coverPath =

                    baseUrl +

                    "/fweb-fileservice/fileext/preview/" +

                    pictureId +

                    "?token=" + http.headers.token;

                uni.previewImage({

                    current: coverPath, // 当前显示图片的http链接

                    urls: [coverPath] // 需要预览的图片http链接列表

                });

                return;

            }

        }

三、有的时候我们是不知道文件是否是图片,只能进行下载。 下来完会获取到文件名 如果是图片再执行上面的预览

uni.showLoading({

            title: '加载中...',

        })

        let me = this;

        if (url.indexOf("http") == -1) {

            url = baseUrl + url;

        }

        var obj = {};

        obj.url = url;

        obj.header = {

            "token": http.headers.token

        },

        obj.success = function (res) {

                uni.hideLoading();               

 console.log("下载成功:==============================", res);}

        obj.fail = function (res) {

            uni.hideLoading();

            console.log("下载失败:==============================", res);

        }

        const downloadTask = uni.downloadFile(obj)

        downloadTask.onProgressUpdate((res) => {

            console.log('下载进度', res.progress)

        })

四、如果下载i下来是普通的文档则调用openDocument进行预览

uni.openDocument({

                    filePath: filePath,

                    fileType: name1,

                    success: function (res) {

                        console.log("已打开文档");

                    },

                    fail: function (err) {

                        console.log("打开文档失败", err);

                        me.showMessageMotherd(err.errMsg);

                    }

                });

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。