uniapp 在线预览PDF

1、官网地址:

https://mozilla.github.io/pdf.js/getting_started/

2、解压文件到static中

3、定义查看组件FilePreview

复制代码
<template>
  <view>
    <web-view :src="allUrl"></web-view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      viewerUrl: '../../static/pdf/web/viewer.html',
      allUrl: '',
    };
  },
  // 加载页面时接收的参数
  onLoad(options) {
    this.allUrl = this.viewerUrl + '?file=' + encodeURIComponent(options.url);
    console.log(options, '00000');
  },
};
</script>

<style></style>

4、如果运行报错

4.1 file origin does not match viewer's

在viewer.js文件中注释下方代码块即可,可以全局搜索file origin does not match viewer's

4.2 不支持.at()语法问题

全局搜索.at(,将at替换成slice即可,这里会有很多,仔细查找就行

相关推荐
CAD老兵2 小时前
在浏览器里对比 DWG/DXF 图纸 —— @mlightcad/cad-diff-viewer
前端·javascript·github
WL_arm2 小时前
Vibe Coding(氛围编程)入门
javascript·css·人工智能·html5
艾醒(AiXing-w)2 小时前
LangChain 1.0 入门(二):LangChain 全模型标准化接入最佳实践(小白参数详解版)
前端·javascript·langchain
Hilaku4 小时前
一行 CSS 新特性干掉 20 行 JavaScript ?
前端·javascript·程序员
风月说与山鬼4 小时前
JS闭包详解
开发语言·javascript
梦曦i4 小时前
RouterLink v2.5.0:H5端原生能力全面回归
前端·uni-app
Source.Liu4 小时前
【A11】基于 PDF 渲染引擎的统一文档界面架构设计
rust·pdf
粥里有勺糖5 小时前
视野修炼-技术周刊第130期 | 光影效果
前端·javascript·github
全栈项目管理程序猿5 小时前
ArcGIS JS 基础教程(13):屏幕坐标与地理坐标互转
javascript
名字还没想好☜6 小时前
Next.js 用 cookies()/headers() 读请求信息:动态渲染触发、缓存失效与在 Server Action 里读写 cookie
前端·javascript·缓存·react·next.js·app router