前端小程序?qū)崿F(xiàn)預(yù)覽pdf并導(dǎo)出完整代碼
更新時間：2025年01月13日 09:23:49 作者：@Dai
這篇文章主要介紹了小程序中無法直接導(dǎo)出PDF或文檔的解決方案,通過調(diào)用API下載文件并打開,文中通過代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考借鑒價值,需要的朋友可以參考下
一、前言
小程序沒辦法直接導(dǎo)出pdf或一些文檔，只能借助api先將文件下載下來并打開，再讓用戶手動去保存。之前做“小程序當(dāng)前頁面截圖轉(zhuǎn)pdf導(dǎo)出”功能的時候，小程序好像也無法實(shí)現(xiàn)。所以要打開文件，都讓后端去做吧，要么給前端一個文件地址，要么返回二進(jìn)制文件流，這樣小程序就能打開文件了。
二、需要的wx api
- downloadFile（下載文件）
- openDocument（打開文件）
showMenu設(shè)置為true才能支持用戶把文件下載到本地
三、完整代碼
const preViewPdf = (url) => { // 預(yù)覽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, //顯示右上角三個點(diǎn)，支持手動保存到本地
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)預(yù)覽pdf并導(dǎo)出的文章就介紹到這了,更多相關(guān)前端小程序預(yù)覽pdf并導(dǎo)出內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
還隱約記得第一次遇到 parseInt這個詭異問題的時候，以為發(fā)現(xiàn)了IE的BUG，興奮不已。2009-09-09
這篇文章主要為大家詳細(xì)介紹了JavaScript經(jīng)典案例之簡易計算器，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-08-08
js 動態(tài)添加標(biāo)簽（新增一行，其實(shí)很簡單，就是幾個函數(shù)的應(yīng)用）
把所有代碼拷下另存為一個html文件，在瀏覽器中打開，點(diǎn)擊“新增一行”按鈕就可以,以下是對js函數(shù)的解釋2009-03-03
原生JS與CSS實(shí)現(xiàn)軟件卸載對話框功能
今天給大家分享一個特別有意思的軟件卸載對話框功能，本段代碼是基于js 與css實(shí)現(xiàn)的，感興趣的朋友跟隨小編一起看看吧2019-12-12
基于Javascript實(shí)現(xiàn)文件實(shí)時加載進(jìn)度的方法
不知道大家有沒有發(fā)現(xiàn)在現(xiàn)在的移動頁面上，有很多情況需要加載大量的資源。但是移動端的訪問速度和pc還是有很大的差距，有些時候需要一些取巧的方式來提升用戶體驗(yàn)，而實(shí)時顯示加載進(jìn)度就是其中一種。這篇文章就給大家分享了Javascript實(shí)現(xiàn)文件實(shí)時加載進(jìn)度的方法。2016-10-10
判斷某一個對象里面是否存在某個屬性，是常見錯誤場景排查，但是你真的知道該如何使用嘛，本文為大家整理了常用的三種方法，希望對大家有所幫助2023-05-05
在JavaScript編程中我們經(jīng)常需要操作對象,包括給對象添加屬性、刪除屬性以及修改屬性的值,這篇文章主要介紹了在JS中刪除對象的某個屬性常見的幾種方案,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2025-07-07
這篇文章主要為大家詳細(xì)介紹了Bootstrap樹形控件使用方法，感興趣的小伙伴們可以參考一下2016-01-01
微信小程序?qū)崿F(xiàn)收藏與取消收藏切換圖片功能
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)收藏與取消收藏切換圖片功能,非常不錯，具有一定的參考借鑒價值，需要的朋友可以參考下2018-08-08
這篇文章主要介紹了js 計算月/周的第一天和最后一天代碼,需要的朋友可以參考下2020-02-02