前端小程序?qū)崿F(xiàn)預覽pdf并導出完整代碼
更新時間：2025年01月13日 09:23:49 作者：@Dai
這篇文章主要介紹了小程序中無法直接導出PDF或文檔的解決方案,通過調(diào)用API下載文件并打開,文中通過代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考借鑒價值,需要的朋友可以參考下
一、前言
小程序沒辦法直接導出pdf或一些文檔，只能借助api先將文件下載下來并打開，再讓用戶手動去保存。之前做“小程序當前頁面截圖轉(zhuǎn)pdf導出”功能的時候，小程序好像也無法實現(xiàn)。所以要打開文件，都讓后端去做吧，要么給前端一個文件地址，要么返回二進制文件流，這樣小程序就能打開文件了。
二、需要的wx api
- downloadFile（下載文件）
- openDocument（打開文件）
showMenu設(shè)置為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'
})
}
})
})
}總結(jié)
到此這篇關(guān)于前端小程序?qū)崿F(xiàn)預覽pdf并導出的文章就介紹到這了,更多相關(guān)前端小程序預覽pdf并導出內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
深入聊聊Array的sort方法的使用技巧.詳細點評protype.js中的sortBy方法
深入聊聊Array的sort方法的使用技巧.詳細點評protype.js中的sortBy方法...2007-04-04
這篇文章主要給大家介紹了關(guān)于JS獲取當前時間的兩種方法,在web開發(fā)中,通過js獲取時間非常的常用,我這里做個總結(jié),需要的朋友可以參考下2023-09-09
說實話，加好友的太多了，怎么辦，想個批量的辦法吧2009-02-02
JavaScript中的toString()和toLocaleString()方法的區(qū)別
本文給大家介紹JavaScript中的toString()和toLocaleString()方法的區(qū)別,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2017-02-02
如何使用JS獲取當前節(jié)點的兄弟/父/子節(jié)點
在日常的網(wǎng)頁開發(fā)中,我們會遇到獲取節(jié)點的問題,而js是寫網(wǎng)頁的最基礎(chǔ)的語言,也是最常用的,這篇文章主要給大家介紹了關(guān)于如何使用JS獲取當前節(jié)點的兄弟/父/子節(jié)點的相關(guān)資料,需要的朋友可以參考下2023-04-04
js中關(guān)于String對象的replace使用詳解
關(guān)于String對象的replace使用詳解,需要的朋友可以參考下。2011-05-05
javascript和jquery中cookie的設(shè)置方法
Cookie 是瀏覽器訪問服務器后，服務器傳給瀏覽器的一段數(shù)據(jù)。瀏覽器需要保存這段數(shù)據(jù)，不會輕易刪除（保存在計算機中）。此后每次瀏覽器訪問該服務器，都必須帶上這段數(shù)據(jù)。這篇文章主要介紹了javascript和jquery中cookie的設(shè)置方法2023-07-07
這篇文章主要給大家介紹了關(guān)于JS實現(xiàn)頁面跳轉(zhuǎn)與刷新的方法，文中通過示例代碼介紹的非常詳細，對大家學習或者使用JS具有一定的參考學習價值，需要的朋友們下面來一起學習學習吧2019-08-08
詳解如何使用JavaScript中Promise類實現(xiàn)并發(fā)任務控制
在JavaScript中,Promise是一種用于管理異步操作的強大工具,但是,有時候需要更高級的控制,以限制同時執(zhí)行的任務數(shù)量,以避免系統(tǒng)資源超負荷,本文將深入探討JavaScript中的并發(fā)任務控制,并介紹如何創(chuàng)建一個自定義的Promise類——ConcurrentPromise2023-08-08
這篇文章主要為大家詳細介紹了js仿360開機效果，并且封裝一個帶回調(diào)函數(shù)的緩動動畫，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-12-12