uniapp使用H5实现预览pdf文件

在这里插入图片描述
下载后把压缩包解压到自己的项目的static文件夹下的pdf文件下,如图
在这里插入图片描述
新建一个文件名为filePreview.vue

<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=${options.url}`;// this.allUrl = this.viewerUrl + '?file=' + options.url}}
</script>

在下载文件事件

<view @click=”getContractPdf“>下载文件</view>getContractPdf() {exportContractPdf({id: this.id}).then(res => {this.url = res.datauni.navigateTo({url: '/pages/index/filePreview?url=' + this.url})})},

1.如果预览文件是乱码情况或者在pc上报ocale.properties的请求返回404
解决:就是pdfjs下载版本有问题,下载以前的老版本

2.如果出现跨域问题直接修改源代码在viewer.js中,也可以全局搜素file origin does not match viewer,注释该代码块
解决如下:
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/127787.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

git:一些撤销操作

参考自 如何撤销 Git 操作&#xff1f;[1] 一、撤销提交 git revert HEAD 撤销上次提交. (会在当前提交后面&#xff0c;新增一次提交&#xff0c;抵消掉上一次提交导致的所有变化,所有记录都会保留) 二、撤销某次merge git merge --abort 三、替换上一次提交 git commit --ame…

【AIGC专题】Stable Diffusion 从入门到企业级实战0402

一、概述 本章是《Stable Diffusion 从入门到企业级实战》系列的第四部分能力进阶篇《Stable Diffusion ControlNet v1.1 图像精准控制》第02节&#xff0c; 利用Stable Diffusion ControlNet Openpose模型精准控制图像生成。上一节&#xff0c;我们介绍了《Stable Diffusion C…

使用Puppeteer爬取地图上的用户评价和评论

导语 在互联网时代&#xff0c;获取用户的反馈和意见是非常重要的&#xff0c;它可以帮助我们了解用户的需求和喜好&#xff0c;提高我们的产品和服务质量。有时候&#xff0c;我们需要从地图上爬取用户对某些地点或商家的评价和评论&#xff0c;这样我们就可以分析用户对不同…

服务器(I/O)之多路转接

五种IO模型 1、阻塞等待&#xff1a;在内核将数据准备好之前&#xff0c;系统调用会一直等待。所有的套接字&#xff0c;默认都是阻塞方式。 2、非阻塞等待&#xff1a;如果内核没有将数据准备好&#xff0c;系统调用仍然会返回&#xff0c;并且会返回EWUOLDBLOCK或者EAGAIN错…

Oracle数据库概念简介

1. 数据库 一般意义上的数据库包含两个部分 库&#xff1a;就是一个存储一堆文件的文件目录数据库管理系统&#xff1a;管理库的系统 2. DBMS 数据库管理系统 数据库管理系统(Database Management System)&#xff0c;是一种操纵和管理数据库的大型软件&#xff0c;用于建立…

kubernetes(K8S)笔记

文章目录 大佬博客简介K8SDocker VS DockerDockerK8S简介K8S配合docker相比较单纯使用docker 大佬博客 Kubernetes&#xff08;通常缩写为K8s&#xff09;是一个用于自动化容器化应用程序部署、管理和扩展的开源容器编排平台。它的构造非常复杂&#xff0c;由多个核心组件和附加…

UNIAPP之js/nvue混淆探索

因项目需要对UNIAPP的js混淆做了一些调研 混淆教程: https://uniapp.dcloud.net.cn/tutorial/app-sec-confusion.html 按照教程配置进行打包正式包进行混淆 下载正式包将 .ipa改为.zip 解压获取到HBuilder.app 右键显示包内容 获取到混淆的key 不同时间进行打包混淆同一文…

Zabbix 利用 Grafana 进行图形展示

安装grafana和插件 配置zabbix数据源 导入模版 查看数据 1.安装grafana wget https://mirrors.tuna.tsinghua.edu.cn/grafana/yum/rpm/Packages/grafana-10.0.0-1.x86_64.rpm [rootrocky8 apps]# yum install grafana-10.0.0-1.x86_64.rpm [rootrocky8 apps]# systemctl sta…

【公网远程手机Android服务器】安卓Termux搭建Web服务器

目录 概述 1.搭建apache 2.安装cpolar内网穿透 3.公网访问配置 4.固定公网地址 5.添加站点 概述 Termux是一个Android终端仿真应用程序&#xff0c;用于在 Android 手机上搭建一个完整的Linux 环境&#xff0c;能够实现Linux下的许多基本操作&#xff0c;不需要root权限…

springWeb

springweb就是spring框架中的一个模块&#xff0c;对web层进行了封装&#xff0c;使用起来更加方便。如何方便&#xff1f;参数接收框架进行封装 SpringWeb拥有控制器&#xff0c;接收外部请求&#xff0c;解析参数传给服务层。 SpringWeb运行流程 用户发起请求 ip:端口/项目名…

晶尔忠产业集团全面启动暨表彰大会

八月下旬&#xff0c;三伏已尽&#xff0c;初秋遂至。夏日的余热还没有完全散去&#xff0c;初秋的热浪随之席卷而来&#xff0c;大地依旧绿意盎然&#xff0c;万物正是生长最猛烈的时期&#xff0c;为秋天的收获做最后的冲刺&#xff0c;这是一个充满生机的时节&#xff0c;也…

设计模式之桥接模式、组合模式与享元模式

目录 桥接模式 简介 优缺点 结构 实现 运用场景 组合模式 简介 优缺点 结构 实现 运用场景 享元模式 简介 优缺点 结构 实现 运用场景 桥接模式 简介 将抽象与实现分离&#xff0c;使它们可以独立变化。它是用组合关系代替继承关系来实现&#xff0c;从而降…

基于springboot的图片文字识别,支持中英文识别

概述 基于springboot的图片文字识别,支持中英文识别. 页面上传图片即可转换为中文或者英文. 详细 1.需求&#xff08;要做什么&#xff09; 识别图片文字, 实现页面上传图片即可转换为中文或者英文. 2.理论概述 OCR&#xff0c;即Optical Character Recognition&#xff…

数据结构与算法:概述

目录 算法 评价标准 时间的复杂度 概念 推导原则 举例 空间的复杂度 定义 情形 运用场景 数据结构 组成方式 算法 在数学领域&#xff0c;算法是解决某一类问题的公式和思想&#xff1b; 计算机科学领域&#xff0c;是指一系列程序指令&#xff0c;用于解决特定的…

数据结构插入排序

好久不见&#xff0c;这几天有点事情&#xff0c;都快一个礼拜没有学习&#xff0c;对键盘都要陌生起来了&#xff0c;今天也是刚刚学了一点排序&#xff0c;在这里也给大家更新一个插入排序&#xff0c;后面也会渐渐的把八大排序更新完的&#xff0c;还有就是二叉树&#xff0…

Vivado 2017.04版本安装教程

文章目录 前言一、vivado 简介二、vivado 下载三、vivado 安装四、vivado 申请证书五、关闭升级提醒六、资源自取 前言 本文记录了在 windows 11 下安装 vivado 2017 的详细步骤。 一、vivado 简介 Vivado 是 Xilinx 公司于 2012 推出的新一代集成设计环境&#xff0c;虽然目…

学习笔记|定时器|STC中断|定时器时间计算|STC32G单片机视频开发教程(冲哥)|第十一集:定时器的作用和意义

文章目录 1.定时器的作用和意义定时器中断定时器是定时器和计数器的统称。 2.STC32G单片机定时器使用原理2.1 先设置功能为定时器/计数器(本质都是加法计数器)2.2、在定时器模式下&#xff0c;设置不分频或者12分频∶Tips&#xff1a;选择不分频还是12分频2.3、定时器的工作模式…

算法竞赛个人注意事项

浅浅记录一下自己在算法竞赛中的注意事项。 数据类 注意看数大小&#xff0c;数学库中的函数尽量加上 * 1.0&#xff0c;转成double&#xff0c;防止整型溢出。&#xff0c;int型相乘如果可能溢出&#xff0c;乘 * 1LL。 数据范围大于1e6&#xff0c;注意用快读。 浮点数输…

HCIP自我重修总笔记

第一章.复习OSITCP/IP 模型 &#xff08;2023 9/5&#xff09; OSI 模型: 开放式系统互联参考模型 应用层&#xff1a;抽象语言-->编码表示层&#xff1a;编码--->二进制会话层&#xff1a;提供会话地址&#xff0c;建立应用程序端到端的会话 上三层为应用程序对数据加…

初识Python

初识Python Python背景知识1. 编程语言2. Python优缺点 搭建Python环境1.找到官网2. 下载3.安装4.检查 安装PyCharm1.找到官网下载2. 安装3. 检查 Python官网文档学习 Python背景知识 1. 编程语言 编程语言通常可以分为以下三类&#xff1a; 高级语言&#xff08;High-Level…