解决PDF预览时,电子签章、日期等不显示问题

文章目录

    • 问题描述
    • 问题排查
    • 问题解决

问题描述

在预览PDF时,部分签章或控件没有显示。如下图:

image-20231121141354956

正确应该要这样:

image-20231121141443132

问题排查

根据网上搜索,排查,我先看看,pdf.worker.js 里的这三行代码,是否已经注释:

//  if (data.fieldType === 'Sig') {
//    _this2.setFlags(_util.AnnotationFlag.HIDDEN);
//  }

注释了,但是依然没有显示,问题是浏览器控制台也没有报错。证明不是代码问题。

继续排查,发现通过接口下载下来的接口是有日期的,这个侧面也证明数据是没问题的。

那到底是哪里出了问题呢,我再一次考虑是不是因为日期字体等文件没有请求成功的问题。最终发现就是在加载日期字体时,出了问题(没有报错,但是无法预览)。

如下图:

image-20231121142436403

image-20231121143306363

对比正确的路径,发现原来是多了public路径:

问题解决

找到PDF引用cmaps的文件,将public去除,重新打包即可在开发和生产环境正常看到电子签章了。

//原来
export let cMapUrl = "./public/cmaps/";
//现在
export let cMapUrl = "./cmaps/";

如果你在web前端开发、面试、前端学习路线有困难可以加我V:imqdcnn。免费答疑,行业深潜多年的技术牛人帮你解决bug。

祝你能成为一名优秀的WEB前端开发工程师!

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

无需API开发,有赞小程序集成广告推广系统,提升品牌曝光

无需API开发,实现有赞小程序与其他系统的连接 有赞小程序作为一个多功能的电子商务解决方案,为商家提供了无需复杂API开发就可以实现系统连接和集成的便捷途径。通过有赞小程序,商家可以轻松实现与各种系统的数据同步和应用互联,…

【机器学习】聚类(二):原型聚类:LVQ聚类(学习向量量化)

文章目录 一、实验介绍1. 算法流程2. 算法解释3. 算法特点4. 应用场景5. 注意事项 二、实验环境1. 配置虚拟环境2. 库版本介绍 三、实验内容0. 导入必要的库1. LVQ类a. 构造函数b. 闵可夫斯基距离c. LVQ聚类过程e. 聚类结果可视化 2. 辅助函数3. 主函数a. 命令行界面 &#xff…

【MATLAB】VMD分解+FFT+HHT组合算法

有意向获取代码,请转文末观看代码获取方式~也可转原文链接获取~ 1 基本定义 VMD(Variational Mode Decomposition)是一种信号分解方法,基于HHT(Hilbert-Huang Transform,希尔伯特-黄变换)。HH…

3、点亮一个LED

新建工程 project—>New uVision Project LED介绍 中文名:发光二极管 外文名:Light Emitting Diode 简称:LED 用途:照明、广告灯、指引灯 电路图分析 进制的转换 生成下载文件: 代码 //导包 #inclu…

Javascript每天一道算法题(十八)——矩阵置零-中等

文章目录 1、问题2、示例3、解决方法(1)方法1——标记数组 1、问题 给定一个 y x x 的矩阵,如果一个元素为 0 ,则将其所在行和列的所有元素都设为 0 。请使用 原地 算法。 2、示例 示例 1: 输入:matrix [[…

Java 多线程编程

Java 给多线程编程提供了内置的支持。一个多线程程序包含两个或多个能并发运行的部分。程序的每一部分都称作一个线程,并且每个线程定义了一个独立的执行路径。 多线程是多任务的一种特别的形式。多线程比多任务需要更小的开销。 这里定义和线程相关的另一个术语&…

道高一尺,魔高一丈!Python爬虫与反爬虫大战见此回分晓?

文章目录 前言一、重新理解爬虫中的一些概念二、反爬虫的目的三、爬虫与反爬虫大战关于Python及爬虫技术储备一、Python所有方向的学习路线二、Python基础学习视频三、精品Python学习书籍四、Python工具包项目源码合集①Python工具包②Python实战案例③Python小游戏源码五、面试…

动态规划经典例题leetcode思路代码详解

目录 动态规划基础篇例题 leetcode70题.爬楼梯 leetcode746题.使用最小花费爬楼梯 leetcode198题.打家劫舍 leetcode62题.不同路径 leetcode64题.最小路径和 leetcode63题.63不同路径II 动态规划基础篇例题 这一篇的例题解答是严格按照我上一篇写的动态规划三部曲做的&…

【机器学习】算法性能评估常用指标总结

考虑一个二分问题,即将实例分成正类(positive)或负类(negative)。对一个二分问题来说,会出现四种情况。如果一个实例是正类并且也被 预测成正类,即为真正类(True positive&#xff0…

【图解系列】一张图带你了解 DevOps 生态工具

一张图带你了解 DevOps 生态工具 ✅ 协作(Collaborate):JIRA、Confluence 大家肯定不陌生了,我之前也写过利用 Jekyll 搭建个人博客的帖子。✅ 构建(Build):常用的 SCM(Software Con…

【数据结构】时间和空间复杂度

马上就要进入到数据结构的学习了 ,我们先来了解一下时间和空间复杂度,这也可以判断我们的算法是否好坏; 如何衡量一个算法的好坏? 就是看它的算法效率 算法效率 算法效率分析分为两种:第一种是时间效率,第…

Android自动化测试必备的测试框架

Appium Appium是一个开源的移动测试工具,支持iOS和Android,它可以用来测试任何类型的移动应用(原生、网络和混合)。作为一个跨平台的工具,你可以在不同的平台上运行相同的测试。为了实现跨平台的功能,Appiu…

AI创作工具:Claude2注册保姆级教程

最近软件打算多接入几个AI写作平台,包括讯飞星火,百度文心,Claude2,这样就能给用户提供更多的写作选择 经过半天的调研,讯飞星火,百度文心一言,接入都比较简单,毕竟是国内的。 在调…

【后端卷前端】

为啥现在对后端要求这么高?为啥不要求前端会后端呢? 可能是后端人太多了,要求后端需要会前端的框架(vue react angular ), 这不我为了适应市场的需求来系统的学习vue了: 生成一个基础的vue项目 创建vue项目 vue create projectname 创建vitevue npm init vitelatest p…

Kafka系列 - 生产者客户端架构以及3个重要参数

整体架构 整个生产者客户端由两个县城协调运行,这两个线程分别为主线程和Sender线程(发送线程)。 主线程中由KafkaProducer创建消息,然后通过可能的拦截器,序列化器和分区器之后缓存到消息累加器(RecordAc…

面试cast:reinterpret_cast/const_cast/static_cast/dynamic_cast

目录 1. cast 2. reinterpret_cast 3. const_cast 3.1 加上const的情况 3.2 去掉const的情况 4. static_cast 4.1 基本类型之间的转换 4.2 void指针转换为任意基本类型的指针 4.3 子类和父类之间的转换 5. dynamic_cast 5.1 RTTI(Run-time Type Identification) 1.…

kafka 集群 KRaft 模式搭建

Apache Kafka是一个开源分布式事件流平台,被数千家公司用于高性能数据管道、流分析、数据集成和关键任务应用程序 Kafka 官网:https://kafka.apache.org/ Kafka 在2.8版本之后,移除了对Zookeeper的依赖,将依赖于ZooKeeper的控制器…

【JavaEE初阶】线程安全问题及解决方法

目录 一、多线程带来的风险-线程安全 1、观察线程不安全 2、线程安全的概念 3、线程不安全的原因 4、解决之前的线程不安全问题 5、synchronized 关键字 - 监视器锁 monitor lock 5.1 synchronized 的特性 5.2 synchronized 使用示例 5.3 Java 标准库中的线程安全类…

vscode运行c++程序如何支持c++11

参考https://zhuanlan.zhihu.com/p/269244754 更改setting.json文件

Spring cloud - Feign

Feign的作用 Feign是Netflix公司开发的声明式web客户端组件,Spring对Feign做了无缝集成: Feign is a declarative web service client. It makes writing web service clients easier. To use Feign create an interface and annotate it. It has plugg…