uni-app 預覽pdf文件

安卓uni-app實現pdf文件預覽功能：

1.https://mozilla.github.io/pdf.js/getting_started/#download下載

放在根目錄下，

2.新建一個webView頁面

<template>
    <view style="width: 100%;" >
        <web-view :src="allUrl"></web-view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                allUrl:'',
                viewerUrl: '/hybrid/html/web/viewer.html', // 格式化文件流的一個js 文件
            }
        },
        onLoad(options) {
            // encodeURIComponent 函數可把字符串作為 URI 組件進行編碼。decodeURIComponent解碼
            let fileUrl = encodeURIComponent(decodeURIComponent(options.fileUrl)); 
            this.allUrl = this.viewerUrl + '?file=' + fileUrl
          }
    }
</script>

3.前一個頁面增加跳轉：

// 預覽pdf
toViewFile(item) {
    let fileUrl = `${this.baseUrl}/share/downloadFile?filePath=${item.filePath}&fileName=${item.fileName}`;
    uni.navigateTo({
        url: '/pages/webView/webView?fileUrl='+ encodeURIComponent(fileUrl)
    });
},

由於url路徑比較長，帶有&符號，傳參，&后面的會被截斷，故需要加上encodeURIComponent。完美解決pdf無法打開問題。

 

相關網站：https://mozilla.github.io/pdf.js/getting_started/#download   

　　　　　https://blog.csdn.net/mwh_user/article/details/112368597