当前位置: 首页 > news >正文

vue实现不预览PDF的情况下打印pdf文件

前景:默认情况,实现打印需要根据预览的内容进行打印。
但是当只有打印按钮存在,不预览文件内容的情况下,实现打印的话,可以通过后端接口返回服务器上PDF的地址,前端通过隐藏的iframe标签中src可实现预览功能
主要是根据pdf的链接地址实现打印pdf

实现方式1:通过fetch()将PDF地址转化为blob

	print(row) {let contractUrl = "http://xxxxxx.pdf"fetch(contractUrl).then(res => {return res.blob() //将url地址转化为blob}).then(res => {var iframe = document.createElement('iframe')iframe.style.frameborder = 'no'iframe.style.display = 'none'iframe.style.pageBreakBefore = 'always'iframe.setAttribute('id', `printPdf${row.pk}`) //id要是唯一的,不然会获取到上一个PDF文件的内容iframe.setAttribute('name', `printPdf${row.pk}`)iframe.src = window.URL.createObjectURL(res) //创建一个包含指定对象的URLdocument.body.appendChild(iframe)this.doPrint(`printPdf${row.pk}`)window.URL.revokeObjectURL(iframe.src) //释放url})},doPrint(val) {var ordonnance = document.getElementById(val).contentWindowsetTimeout(() => {ordonnance.print()}, 500)},

实现方式2:采用文档流的形式解决跨域的问题

print() {// res为接口获取到的pdf文档流数据const blob = new Blob([res], {type: 'application/pdf'})var iframe = document.createElement('iframe')iframe.style.frameborder = 'no'iframe.style.display = 'none'iframe.style.pageBreakBefore = 'always'iframe.setAttribute('id', 'printPdf')iframe.setAttribute('name', 'printPdf')iframe.src = window.URL.createObjectURL(blob) //创建一个包含指定对象的URLdocument.body.appendChild(iframe)this.doPrint('printPdf')window.URL.revokeObjectURL(iframe.src) //释放url},
doPrint(val) {var ordonnance = document.getElementById(val).contentWindowsetTimeout(() => {ordonnance.print()}, 500)
},

相关文章:

vue实现不预览PDF的情况下打印pdf文件

前景:默认情况,实现打印需要根据预览的内容进行打印。 但是当只有打印按钮存在,不预览文件内容的情况下,实现打印的话,可以通过后端接口返回服务器上PDF的地址,前端通过隐藏的iframe标签中src可实现预览功能 主要是根据…...

C++ | Leetcode C++题解之第199题二叉树的右视图

题目&#xff1a; 题解&#xff1a; class Solution { public:vector<int> rightSideView(TreeNode* root) {unordered_map<int, int> rightmostValueAtDepth;int max_depth -1;stack<TreeNode*> nodeStack;stack<int> depthStack;nodeStack.push(ro…...

[leetcode]圆圈中最后剩下的数字/ 破冰游戏

. - 力扣&#xff08;LeetCode&#xff09; class Solution {int f(int num, int target) {if (num 1) {return 0;}int x f(num - 1, target);return (target x) % num;} public:int iceBreakingGame(int num, int target) {return f(num, target);} };...

mysql数据库的管理

目录 一、常用的数据类型 二、MySQ数据库基础操作 1、登录数据库 2、查看当前的 MySQL 版本信息及连接用户名 3、查看当前服务器中的数据库 4&#xff0e;查看数据库中包含的表 5&#xff0e;查看表的结构&#xff08;字段&#xff09; 6、MySQL的6大约束属性 三、SQL…...

Java项目分层(持续更新中)

第一次更新时间2024.6.26 分包 实体类 功能类 工具类 分层 实体类层 我们要操作的对象&#xff0c;Book,Student... 控制层 控制请求转发 业务层 处理业务 数据层 连接数据库 处理数据 工具类层 JDBC等工具类 测试层 最终启动项目 明确我们所要做的业务之后&a…...

2024年软件测试面试题大全【答案+文档】

&#x1f345; 视频学习&#xff1a;文末有免费的配套视频可观看 &#x1f345; 点击文末小卡片&#xff0c;免费获取软件测试全套资料&#xff0c;资料在手&#xff0c;涨薪更快 一、面试基础题 简述测试流程&#xff1a; 1、阅读相关技术文档&#xff08;如产品PRD、UI设计…...

数据赋能(131)——体系:数据转换——概述、关注焦点

概述 数据转换是指将数据从一种格式、结构或类型转换为另一种格式、结构或类型的过程。 数据转换操作属于数据整理过程。 它通常涉及数据清洗、数据映射、数据合并、数据拆分等操作&#xff0c;以确保数据的正确性和一致性。 数据转换的目的在于将原始数据转换为更易于处理…...

【自然语言处理系列】掌握jieba分词器:从基础到实战,深入文本分析与词云图展示

本文旨在全面介绍jieba分词器的功能与应用&#xff0c;从分词器的基本情况入手&#xff0c;逐步解析全模式与精确模式的不同应用场景。文章进一步指导读者如何通过添加自定义词典优化分词效果&#xff0c;以及如何利用jieba分词器进行关键词抽取和词性标注&#xff0c;为后续的…...

TikTok短视频矩阵系统

随着数字化时代的到来&#xff0c;短视频已成为人们获取信息、娱乐消遣的重要渠道。TikTok&#xff0c;作为全球最受欢迎的短视频平台之一&#xff0c;其背后的短视频矩阵系统是支撑其成功的关键因素。本文将深入探讨TikTok短视频矩阵系统的构成、功能以及它在新媒体时代中的影…...

码题杯:我会修改图

原题链接&#xff1a;码题集OJ-我会修改图​​​​​​ 题目大意&#xff1a;给你一张n个点&#xff08;编号为1∼n&#xff09;&#xff0c;m条边&#xff08;编号为1∼m&#xff09;的无向图&#xff0c;图上每个点都有一个点权&#xff0c;权值分别为a1​,a2​,…,an​&…...

MongoDB Map-Reduce 简介

MongoDB Map-Reduce 简介 MongoDB 是一个流行的 NoSQL 数据库&#xff0c;它使用文档存储数据&#xff0c;这些数据以 JSON 格式存储。MongoDB 提供了多种数据处理方法&#xff0c;其中 Map-Reduce 是一种用于批量处理和聚合数据的功能强大的工具。Map-Reduce 允许用户对大量数…...

某平台小程序逆向思路整理

一、下载软件 devtools 二、强制打开控制台 根据返回的数据我们得知数据被加密了 找到这个加密的js 发现加密的位置 打断点进入这个加密的方法 之后自定义js。python调用解密即可。...

黑马苍穹外卖6 清理redis缓存+Spring Cache+购物车的增删改查

缓存菜品 后端服务都去查询数据库&#xff0c;对数据库访问压力增大。 解决方式&#xff1a;使用redis来缓存菜品&#xff0c;用内存比磁盘性能更高。 key :dish_分类id String key “dish_” categoryId; RestController("userDishController") RequestMapping…...

鸿蒙开发系统基础能力:【@ohos.systemTime (设置系统时间)】

设置系统时间 本模块用来设置、获取当前系统时间&#xff0c;设置、获取当前系统日期和设置、获取当前系统时区。 说明&#xff1a; 本模块首批接口从API version 7开始支持。后续版本的新增接口&#xff0c;采用上角标单独标记接口的起始版本。 导入模块 import systemTime …...

CVE-2020-26048(文件上传+SQL注入)

简介 CuppaCMS是一套内容管理系统&#xff08;CMS&#xff09;。 CuppaCMS 2019-11-12之前版本存在安全漏洞&#xff0c;攻击者可利用该漏洞在图像扩展内上传恶意文件&#xff0c;通过使用文件管理器提供的重命名函数的自定义请求&#xff0c;可以将图像扩展修改为PHP&#xf…...

【面试题】信息系统安全运维要做什么

信息系统安全运维是确保信息系统稳定、可靠、安全运行的一系列活动和措施。 其主要包括以下几个方面&#xff1a; 1.系统监控&#xff1a; 实时监测信息系统的运行状态&#xff0c;如服务器的性能指标、网络流量、应用程序的运行情况等。通过监控工具&#xff0c;及时发现系统…...

引导过程与服务器控制

一、引导过程 1.开机自检 服务器主机开机以后&#xff0c;将根据主板 BIOS 中的设置对 CPU&#xff08;Central Processing Unit&#xff0c; 中央处理器&#xff09;、内存、显卡、键盘等设备进行初步检测&#xff0c;检测成功后根据预设的启动顺序移 交系统控制权&#xff0c…...

前置章节-熟悉Python、Numpy、SciPy和matplotlib

目录 一、编程环境-使用jupyter notebook 1.下载homebrew包管理工具 2.安装Python环境 3.安装jupyter 4.下载Anaconda使用conda 5.使用conda设置虚拟环境 二、学习Python基础 1.快排的Python实现 (1)列表推导-一种创建列表的简洁方式 (2)列表相加 2.基本数据类型及运…...

在Ubuntu上安装和配置配置服务器防火墙(CSF)的方法

前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到网站。 简介 Config Server Firewall&#xff08;CSF&#xff09;是大多数 Linux 发行版和基于 Linux 的 VPS 的免费高级防火墙。除了基本的防…...

Python-井字棋

井字棋 1.设计登录界面1.1导入需要的工具包1.2窗口显示1.3登录界面图片显示1.6标签按钮输入框显示 2.登录功能实现2.1用户数据存储 2.2登录和注册2.2.1登录功能实现2.2.2注册功能实现 3.井字棋游戏3.1 导入需要的工具包3.2 窗口显示3.2 按钮标签显示3.3 棋盘设置初始状态3.4 游…...

陀螺匠企业助手-产品

1. 功能说明维护出售产品的基本信息数据&#xff0c;支持在添加商机/合同中进行选择。2. 进入产品页面路径&#xff1a;客户>产品管理>产品3. 新增产品功能说明&#xff1a;维护产品信息&#xff0c;添加完成的产品信息&#xff0c;可以在添加商机/合同中进行选择。新增产…...

大模型私有化不是选型,是生存!Python工程师必须在Q3前掌握的5类国产化适配方案,否则明年项目全卡审批

第一章&#xff1a;大模型私有化是Python工程师的生存分水岭当企业开始将大语言模型从公有云API转向本地GPU集群部署&#xff0c;Python工程师的角色正经历一次静默但深刻的重构——不再只是调用requests.post()封装接口&#xff0c;而是要亲手构建模型加载、推理服务、权限控制…...

5步实现Switch控制器PC全功能适配:从连接到精通的设备适配指南

5步实现Switch控制器PC全功能适配&#xff1a;从连接到精通的设备适配指南 【免费下载链接】BetterJoy Allows the Nintendo Switch Pro Controller, Joycons and SNES controller to be used with CEMU, Citra, Dolphin, Yuzu and as generic XInput 项目地址: https://gitc…...

从零开始:如何用开源方案打造你的第一台六足机器人

从零开始&#xff1a;如何用开源方案打造你的第一台六足机器人 【免费下载链接】hexapod 项目地址: https://gitcode.com/gh_mirrors/hexapod5/hexapod 想要亲手制作一台能够自如行走的六足机器人吗&#xff1f;hexapod开源项目为你提供了一套完整的免费解决方案&#…...

基于Python的本科生交流培养管理平台毕业设计源码

博主介绍&#xff1a;✌ 专注于Java,python,✌关注✌私信我✌具体的问题&#xff0c;我会尽力帮助你。 一、研究目的 本研究旨在设计并实现一个基于Python的本科生交流培养管理平台&#xff0c;以提升我国高等教育中本科生交流培养的质量与效率。具体研究目的如下&#xff1a…...

OpenCore辅助工具(OCAT)全攻略:从配置到优化的黑苹果必备工具

OpenCore辅助工具(OCAT)全攻略&#xff1a;从配置到优化的黑苹果必备工具 【免费下载链接】OCAuxiliaryTools Cross-platform GUI management tools for OpenCore&#xff08;OCAT&#xff09; 项目地址: https://gitcode.com/gh_mirrors/oc/OCAuxiliaryTools 核心价值&…...

如何使用Postman,通过Mock的方式测试我们的API

&#x1f345; 点击文末小卡片&#xff0c;免费获取软件测试全套资料&#xff0c;资料在手&#xff0c;涨薪更快 这篇文章将教会大家如何利用 postman&#xff0c;通过 Mock 的方式测试我们的 API。什么是 MockMock 是一项特殊的测试技巧&#xff0c;可以在没有依赖项的情况下进…...

Uvicorn与Couchbase Analytics Service集成:构建高性能数据分析API的终极指南

Uvicorn与Couchbase Analytics Service集成&#xff1a;构建高性能数据分析API的终极指南 【免费下载链接】uvicorn An ASGI web server, for Python. &#x1f984; 项目地址: https://gitcode.com/GitHub_Trending/uv/uvicorn 在现代数据驱动的应用开发中&#xff0c;…...

OpenClaw量化对比:Qwen3.5-4B-Claude-4.6-Opus-Reasoning-Distilled-GGUF不同精度版本的自动化任务表现

OpenClaw量化对比&#xff1a;Qwen3.5-4B-Claude-4.6-Opus-Reasoning-Distilled-GGUF不同精度版本的自动化任务表现 1. 测试背景与实验设计 去年在开发一个自动化文档处理流程时&#xff0c;我发现OpenClaw的任务成功率与底层模型量化精度密切相关。当时使用Q8版本处理Excel文…...

UG模型转STP后总出问题?可能是STEP 203和214版本没选对

UG模型转STP格式的深度选择指南&#xff1a;STEP 203与214版本差异解析 在工业设计领域&#xff0c;UG NX与STP格式的转换堪称日常操作&#xff0c;但许多工程师都曾遭遇这样的困境&#xff1a;明明转换过程一切顺利&#xff0c;接收方打开文件时却出现面片丢失、PMI信息异常甚…...