uniapp 打包成安卓APP预览base64pdf实现方法

下载PDF.js

问题描述

在uniapp中预览base64的PDF,可以使用web-view组件嵌入一个PDF.js的实例。以下是一个简单的示例:

解决方案:

1.在页面的.vue文件中添加web-view组件:

复制代码
<template>
  <view style="width: 50%;">
    <web-view :src="allUrl"></web-view>
  </view>
</template>
 
<script>
  export default {
    data () {
      return {
        allUrl: '',
        viewerUrl: '/static/hybrid/html/web/viewer.html',//引入下载好的文件
        // pdfUrl: 'http://172.11.11.11:8888/ceshi.pdf',//可访问的http地址
		'pdfUrl':'data:application/pdf;base64'// 可以去线上生成一个base64pdf
      }
    },
    onLoad (options) {
      this.pdfUrl = options.pdfUrl
      let fileUrl = encodeURIComponent(this.pdfUrl) // encodeURIComponent 函数可把字符串作为 URI 组件进行编码。
      this.allUrl = this.viewerUrl + '?file=' + fileUrl
    }
  }
</script>
 
<style>
 
</style>

2.将PDF.js的预览页面viewer.html与PDF.js库一起打包到你的应用中。

这是一个简化的示例,实际情况可能需要考虑更多因素,如PDF.js的版本兼容性、应用的性能和兼容性等。

相关推荐
plainGeekDev3 小时前
依赖管理 → Version Catalog
android·java·kotlin
韩曙亮5 小时前
【Flutter】Flutter 进程保活 ③ ( 屏幕常亮设置 | Flutter 禁止息屏、关闭自动锁屏、屏蔽系统屏保 )
android·flutter·ios·屏幕常亮·禁止息屏
爱笑鱼6 小时前
NDK、SDK、APP、Framework、Native 到底怎么区分?
android
私人珍藏库6 小时前
[Android] 发票制作器-内置多行业专业模板
android·人工智能·app·软件·多功能
不厌 -_-7 小时前
VSCode 中 Markdown 转 PDF
vscode·pdf
悲凉的紫菜8 小时前
dariy
android·ide·android studio
2501_915909068 小时前
IPA 深度混淆是什么意思?从混淆强度到实际效果的解读
android·ios·小程序·https·uni-app·iphone·webview
LT10157974449 小时前
2026年手机机型兼容性测试选型指南:安卓机型碎片化、APP闪退UI错乱如何解决
android·测试工具·ui·智能手机
阿pin9 小时前
Android随笔-view是如何显示到屏幕上
android·view
蜡台10 小时前
修改Uniapp input 组件不刷新视图问题
前端·uni-app·input