前端小程序实现预览pdf并导出完整代码
更新时间：2025年01月13日 09:23:49 作者：@Dai
这篇文章主要介绍了小程序中无法直接导出PDF或文档的解决方案,通过调用API下载文件并打开,文中通过代码介绍的非常详细,对大家的学习或者工作具有一定的参考借鉴价值,需要的朋友可以参考下
一、前言
小程序没办法直接导出pdf或一些文档，只能借助api先将文件下载下来并打开，再让用户手动去保存。之前做“小程序当前页面截图转pdf导出”功能的时候，小程序好像也无法实现。所以要打开文件，都让后端去做吧，要么给前端一个文件地址，要么返回二进制文件流，这样小程序就能打开文件了。
二、需要的wx api
- downloadFile（下载文件）
- openDocument（打开文件）
showMenu设置为true才能支持用户把文件下载到本地
三、完整代码
const preViewPdf = (url) => { // 预览pdf
uni.showLoading({
title: '加载中',
mask: true
})
return new Promise((resolve, reject) => {
uni.downloadFile({
url: baseUrl + url,
header: {
'Authorization': store.state.token
},
success: (res) => {
if (res.statusCode === 200) {
uni.openDocument({
filePath: res.tempFilePath,
showMenu: true, //显示右上角三个点，支持手动保存到本地
success: (res) => {
uni.hideLoading()
resolve(true)
},
fail: (err) => {
uni.hideLoading()
resolve(true)
uni.showToast({
title: '打开失败',
icon: 'none'
})
}
})
}
},
fail: (err) => {
uni.hideLoading()
uni.showToast({
title: '下载失败',
icon: 'none'
})
}
})
})
}总结
到此这篇关于前端小程序实现预览pdf并导出的文章就介绍到这了,更多相关前端小程序预览pdf并导出内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
项目前端的文件和后台开发分离，只要后台开发更新svn前端的js，css文件都会更新，以前引用的是一个js文件如AA.js，由于想在项目中引用jquery库，如果在每个文件的头部都引让他们从新写入这个jq文件不太可能2010-04-04
当我们在开发Uni-app应用时,经常会遇到需要在不同页面之间传递参数的情况,为了实现跨页面传参,Uni-app提供了几种方式,所以本文小编将给大家介绍一下uniapp跨页面传参的几种方式,文中有详细的代码示例供大家参考,需要的朋友可以参考下2024-01-01
看了很多介绍javascript面向对象技术的文章,很晕.为什么?不是因为写得不好,而是因为太深奥.2009-12-12
Js获取当前日期时间及其它操作，还有一些自己常用的方法，很好用，也很全。这里推荐给大家，有需要的小伙伴可以参考下。2015-04-04
我写JavaScript代码已经很久了，都记不起是什么年代开始的了。本文给大家分享javascript七大技巧(二)，对javascript技巧相关知识感兴趣的朋友一起学习吧2015-12-12
这篇文章主要给大家介绍了关于前端实现文件下载常见的几种方法,需要的朋友可以参考下2025-01-01
JavaScript作为一种广泛使用的编程语言,它的流程控制语句是构建逻辑和实现功能的基础,这篇文章主要介绍了JavaScript分支语句和循环语句的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下2025-08-08
这篇文章主要为大家详细介绍了微信小程序实现星级评分，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-11-11
将Datatable转化成json可以将dt序列化成json，放到前台的隐藏控件hidBoundary中，具体的实现如下，有类似需求的朋有可以参考下2013-09-09
今天小编就为大家分享一篇layui下拉框获取下拉值(select)的例子，具有好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-09-09
最新评论