Electron无感打印 静默打印(vue3 + ts + vite)

(electron vue3 项目搭建部分 自行查找其他资源 本文只讲解Electron+vue3 如何实现静默打印)

第一步获取打印机资源

渲染端代码(vue里面)
// 因使用了vite所以在浏览器中打开 require会报错 只能在electron中
const { ipcRenderer } = require( 'electron')
// 初始化打印
async function handleInit() {//  获取到当前所有打印机 (获取以后取打印机NAME 用于electron的deviceName字段)ipcRenderer.invoke("getPrinters").then(res=>{console.log(res)})// 创建要打印的窗口await ipcRenderer.invoke("openPrintWindow",'printId');
} 

第二步 进程端 完善

在electron文件夹目录下新增文件print.ts

// print.ts 
import { app, BrowserWindow, shell, ipcMain, BrowserWindowConstructorOptions, WebContentsPrintOptions } from 'electron'export const electronPrint = () => {let win: BrowserWindow;// 获取系统打印机详情ipcMain.handle("getPrinters", async (event) => {return await event.sender.getPrintersAsync();});// 调用打印机打印ipcMain.handle("printHandlePrint",async (event, options: WebContentsPrintOptions) => {console.log("调用打印了")return new Promise((resolve) => {event.sender.print(options,(success: boolean, failureReason: string) => {console.log("打印的结果",{ success, failureReason })resolve({ success, failureReason });});});});// 创建打印界面ipcMain.handle("openPrintWindow", (_, id) => {// id 用于传递的参数openPrintWindow(id);});// 销毁打印界面ipcMain.handle("destroyPrintWindow", () => {if (win) win.destroy();});function openPrintWindow(id) {const otherWindowConfig: BrowserWindowConstructorOptions = {useContentSize: true,autoHideMenuBar: true,frame: false,show: false,webPreferences: {contextIsolation: false,nodeIntegration: true,webSecurity: false,// 如果是开发模式可以使用devToolsdevTools:true,// 在macos中启用橡皮动画scrollBounce: process.platform === "darwin",},};win = new BrowserWindow({titleBarStyle: "hidden",...Object.assign(otherWindowConfig, {}),});win.loadURL('http://localhost:5173/#/print');win.setMenu(null);win.on("ready-to-show", () => {console.log("打印窗口已经新建出来了  隐藏处理")win.hide();});win.on("closed", () => {win = null;});}
}
在main中调用即可

在这里插入图片描述

第三步 渲染端(vue)调用打印

    onMounted(async()=>{const { ipcRenderer } = require( 'electron')setTimeout(async()=>{ try {await ipcRenderer.invoke("printHandlePrint", { deviceName:"Printer_POS_80",silent: true, // 静默打印pageSize:{width:'72100',height:'210000',},margins: { marginType: "printableArea" }, // 网页的边距});} catch (error) {} finally {await ipcRenderer.invoke("destroyPrintWindow"); // 打印完成销毁新窗口}},1000)})

在这里插入图片描述

常见问题总结

  1. require 报错
    解决:如图所示添加nodeIntegration字段 并且在electron中运行 (浏览器运行会报错)
    在这里插入图片描述

  2. 打印出来内容尺寸不对
    添加pagesize字段 width eight单位是微米 查看你要打印的尺寸设置即可 要打印的页面添加样式 @page{size:auto}
    在这里插入图片描述

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

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

相关文章

TF-IDF算法详解

前言 TF-IDF(Term Frequency-Inverse Document Frequency)是一种用于文本挖掘和信息检索的统计方法。它的核心思想是评估一个词语在一个文档中的重要程度,同时考虑到该词语在整个文档集合中的普遍性。本文将深入探讨TF-IDF算法的原理、计算方…

统计信号处理基础 习题解答10-11

题目 我们希望根据一个人的身高来估计他的体重。为了判断其可行性,对N100个人取数据,产生有序的数据对(h,w),其中h代表身高,w代表体重。得到的数据如图10.9(a)所示的。解释你如何利用MMSE估计量根据一个人的身高来猜测他的体重。对于这些数据的建模有些什么样的假设…

RT-thread内核对象的基础应用

RT-thread的内核对象基础应用 启动流程: 以RT-Thread Studio为例,用户程序入口为位于 main.c 文件中 的main 函数。系统启动后先运行startup_stm32f103xe.s文件中的汇编代码,运行“bl entry”指令后跳转到components.c 文件中调用entry函数&a…

记录request库的部分封装

仅供参考 github找的框架,基于他的代码做了一部分改动,下面着重代码的解析和一些其他的完善。记录下来主要用于后续自己再做改动。 import requests import json as complexjson from common.logger import loggerclass RestClient():def __init__(se…

WebMvcConfigurer配置不当导致鉴权失败

最近同事说他们有个新需求,需要对接口进行加解密,所以他给项目配置了一个拦截器,但这个拦截器直接导致了每个接口鉴权失败,每次调用接口都是提示没有session信息。 公司内的所有java项目是公用同一套基础依赖,所以我也…

蚂蚁分类信息系统二开仿么么街货源客模板微商货源网源码(带手机版)

源码介绍 网站采用蚂蚁分类信息系统二次开发,模板仿么么街货源客模板,微商货源网定制版。 模板设计风格简洁,分类信息采用列表形式发布,这种设计方式非常符合度娘 SEO 规则。收录效果是杠杠的。 这个网站风格目前是用来做货源推…

cuda-cuda语法

1、cuda::unique_ptr<float[]> cuda::unique_ptr<float[]>是一个C中的智能指针类型&#xff0c;用于管理在CUDA中分配的内存。这种类型的智能指针通常用于自动释放或管理内存&#xff0c;避免内存泄漏。cuda::unique_ptr<float[]>表示它是一个唯一拥有的指针…

【网络安全】【深度学习】【入侵检测】SDN模拟网络入侵攻击并检测,实时检测,深度学习【一】

文章目录 1. 前言2. Mininet 和 Ryu 的区别2.1 Mininet2.2 Ryu2.3 总结 3. 模拟攻击3.1 环境准备3.2 创建 Mininet 网络拓扑3.2 启动 Ryu 控制器3.3 模拟网络攻击3.4 捕获流量 4. 实时异常检测4.1 在 Ryu 控制器中4.2 在 h2 机器上的实验结果4.3 深度学习模型部署上h2机器 帮助…

uniapp如何实现跳转

在 UniApp 中&#xff0c;页面跳转主要可以通过两种方式实现&#xff1a;使用 <navigator> 组件和调用 UniApp 提供的导航 API。以下是这两种方式的详细说明&#xff1a; 1. 使用 <navigator> 组件 <navigator> 组件允许你在页面上创建一个可点击的元素&am…

ArcGIS Pro SDK (三)Addin控件 4 工程项目结构类

25 ArcGIS Pro 自定义项目 目录 25 ArcGIS Pro 自定义项目25.1 添加控件25.2 Code26 ArcGIS Pro 自定义工程项目26.1 添加控件26.2 Code25.1 添加控件 25.2 Code ProCustomItemTest.cs using ArcGIS.Desktop.Core; using ArcGIS.Desktop

分布式文件存储 - - - MinIO从入门到飞翔

MinIO从入门到飞翔 文章目录 MinIO从入门到飞翔0、前言1、分布式文件系统2、MinIO 介绍3、 MinIO安装&#xff08;docker&#xff09;4、基本概念5、通过代码上传文件到MinIO6、封装MinIO为starter7、在其他项目中集成封装好的模块 0、前言 对象存储是一种数据存储架构&#x…

互联网应用主流框架整合之SpringMVC基础组件开发

多种传参方式 在前一篇文章互联网应用主流框架整合之SpringMVC初始化及各组件工作原理中讨论了最简单的参数传递&#xff0c;而实际情况要复杂的多&#xff0c;比如REST风格&#xff0c;它往往会将参数写入请求路径中&#xff0c;而不是以HTTP请求参数传递&#xff1b;比如查询…

audio标签隐藏播放器尾部的三个点

问题&#xff1a; 在谷歌浏览器上&#xff0c;展示audio音频控件时&#xff0c;后面有三个点&#xff0c;点击后会显示下载和播放速度&#xff0c;想隐藏这两个控件。 注意&#xff1a; 不是所有版本都有这三个点&#xff0c;甚至有的版本里面三个点里面的控件只有下载。 解…

【Windows10】查看WIFI密码

操作步骤 电脑上查看已连接Wi-Fi的密码的步骤如下: 连接需要查看密码的Wi-Fi。右键点击任务栏上的 [网络] 图标&#xff0c;选择 [开启"网络和Internet"设置]。在 高级网络设置 项目中&#xff0c;点选 [网络和共享中心]。开启网络和共享中心的窗口后&#xff0c;点…

通过U盘 读去BIN文件进行校验写入到外部存储FLASH算法

算法原理: 数据读取:代码首先确定每次从USB设备读取的数据量(1024字节或剩余的数据量,取较小值)。错误处理:如果读取操作失败,则记录日志并跳转到错误处理部分(FILE_CLOSE)。更新剩余数据量:每次读取后,更新DataRemain以反映剩余要读取的数据量。校验和计算:在文件…

vue打包exe实战记录

vue项目不支持直接打包exe,可以依靠electron进行打包,处理方式是将vue打包的dist文件夹放到electron项目中,通过配置后打包electron.先看下本地环境 下面是实操记录: 1.vue项目打包 vue.config.js中设置项目路径为 module.exports {//publicPath: /chat_pc/, // 前端项目…

苍穹外卖笔记-13-导入地址簿功能代码、用户下单、订单支付

文章目录 1. 导入地址簿功能代码1.1 需求分析和设计1.1.1 产品原型1.1.2 接口设计1.1.3 表设计 1.2 代码导入1.2.1 Mapper层1.2.2 Service层1.2.3 Controller层 1.3 功能测试 2. 用户下单2.1 需求分析和设计2.1.1 产品原型2.1.2 接口设计2.1.3 表设计 2.2 代码开发2.2.1 DTO设计…

速盾的防护策略有哪些?

在当今数字化时代&#xff0c;网络安全至关重要&#xff0c;而速盾作为一款优秀的安全防护工具&#xff0c;拥有一系列全面且有效的防护策略。 首先&#xff0c;速盾采用了先进的访问控制策略。通过严格的身份验证和授权机制&#xff0c;确保只有合法的用户和应用程序能够访问特…

个人 PCB 设计规范

目录 PCB 布局规范 分模块布局 布局原则 PCB 布线规范 布线原则 布线顺序 规则设置 PCB 布局规范 分模块布局 按功能模块&#xff1a;完成同一功能的电路&#xff08;指由分立元件组成&#xff0c;实现特定功能的模块&#xff09;&#xff0c;应尽量靠近放置。 按电…

Spotify 音乐平台宣布成立内部创意机构,测试生成式人工智能配音广告

Spotify是一家流媒体音乐平台&#xff0c;提供广泛的音乐、播客和视频内容。用户可以通过订阅服务Spotify Premium来享受更多高级功能&#xff0c;如无广告播放、离线听歌等。 Spotify 周四宣布&#xff0c;它将通过其首家名为 Creative Lab 的内部创意机构进一步进军广告领域…