electron实现静默下载(各种踩坑解决)-编程思维
前车之鉴 也是阅读了很多资料和前人踩的坑,直接使用webContent.print方法进行打印。其他方式要不就是Bug多,官方修复也有问题;要不就是官方升级版本后不再支持等 不赘述 需求思路 在main里面实现printerHandle,暴露给渲染线程去调用打印等功能 点击打印后,调出打印页面(新建窗口再隐藏) 通过路径指向打印页面的路由地址,在此页面进行html和css编码,实现打印内容编辑
morethink program
前车之鉴 也是阅读了很多资料和前人踩的坑,直接使用webContent.print方法进行打印。其他方式要不就是Bug多,官方修复也有问题;要不就是官方升级版本后不再支持等 不赘述 需求思路 在main里面实现printerHandle,暴露给渲染线程去调用打印等功能 点击打印后,调出打印页面(新建窗口再隐藏) 通过路径指向打印页面的路由地址,在此页面进行html和css编码,实现打印内容编辑
配置文件 一般web前端项目配置文件,写死的放在src/config下,需要打包配置的放在.env文件中。但在electron项目中,如果配置数据更改,需要每次给用户打包升级肯定是行不通的。于是外部配置文件就是有必要的,具体实现方法也比较简单,通过fs去读写外部文件就可实现 具体实现 设置文件不被压缩混淆 比如配置文件放在根目录的config文件夹 配置electron- builder文件,我
package.json "config": { "forge": { "packagerConfig": { "appVersion": "1.1.4", "icon": "./icon/icon.ico", "name":"项王零售收银系统", "appCopyright": "siki"
原文链接 原文链接 Preface 最近尝试了很多不错的在线工具,只是每次都要进入网站,有点麻烦,于是想到之前了解过的electron,尝试一下打包成本地应用。 Contents 1.下载所有源文件 通过开发者工具,'copy all as Node.js fetch',然后配合 node-fetch 库,将需要用到的资源下载到本地: const fs = require('fs') const
文件下载是我们开发中比较常见的业务需求,比如:导出 excel。 web 应用文件下载存在一些局限性,通常是让后端将响应的头信息改成 Content-Disposition: attachment; filename=xxx.pdf,触发浏览器的下载行为。 在 electron 中的下载行为,都会触发 session 的 will-download 事件。在该事件里面可以获取到 download
需求:electron环境下想要实现根据多个表生成多个Excel文件,打包存入文件夹内并压缩下载到本地。(实际场景描述:界面中有软件工程一班学生信息、软件工程二班学生信息、软件工程三班学生信息,上方有“一键生成”的按钮,点击时弹出文件存储位置选择框选择压缩包所要保存的位置,选择完成后点击保存后生成压缩包中存放一、二、三班三张对应班级学生信息Excel的文件。)注:生成的Excel文件需要按照对
根据公司的实际项目需求,要求实现对pdf和ofd文件的预览,并且需要限制用户是否可以下载、打印、另存pdf、ofd文件,如果该用户可以打印、下载需要控制每个用户的下载次数以及可打印的次数。正常的预览pdf很简单,直接调用浏览器的预览就可以而且功能也比较全,但是一涉及到禁止用户打印、另存的话就不可以用浏览器自带的预览方式了。那就只能寻找插件来模拟了,之前在eletron-vue项目中使用过pdf
Electron桌面应用开发 Electron技术架构 地址:快速入门 | Electron Chromium 支持最新特性的浏览器 Node.js Javascript运行时,可实现文件读写 Native APIS 提供统一的原生界面能力 环境搭建 Node 安装 (我的版本14.15.0) 项目初始化 npm init -y // 安装Electron npm i --sa
Electron读取本地文件并显示,也就是暴露一个读取本地特定文件内容的接口给渲染进程调用。 主要参考:https://stackoverflow.com/questions/44391448/electron-require-is-not-defined 基于官方的快速教程示例代码进行修改,原始代码如下: // main.js // Modules to control applic
IPC=inter-process communication=进程间通信 仍然以Electron读取本地文件并显示中的原始代码作为基础("electron": "^15.3.0") 例子1 preload.js(渲染进程向主进程发送hello): const { ipcRenderer } = require('electron'); let sendMsgToMainProcess
背景:WEB项目迁移到Electron,原WEB项目中用了JQuery,迁移后运行,抛出Uncaught ReferenceError: $ is not defined Electron版本是15.3.0,参考了https://stackoverflow.com/questions/32621988/electron-jquery-is-not-defined 发现是这个原因: we
索引 方法一: 去掉Content Security Policy 方法二:不采用内联 CSP为什么禁止执行inline script? 方法三:修改CSP,列出允许执行的脚本代码的Hash值 不只是Electron页面,CSP(Content Security Policy)对于普通浏览器一样生效。 方法一: 去掉Content Security Policy Refused to e
前端工程师使用electron可以跨应用做的桌面客户端,但是打包后的安装界面很不美观 查找资料得知需要编写NSIS脚本更改安装界面,但是通关百度找到了一个NSIS-UI,集成于NSIS的插件,采用Duilib开发,效果图如下: 在控件的资源中,采用的是通过TAB控件来实现不同阶段的安装界面,比如:选择路径、许可协议、安装进度、完成、卸载等,在实际使用中,通过NSIS脚本来设置当前需要显
本片文章中的截图方式 : window:应用qq截图,截图方式与qq无异,截完图之后可编辑操作; mac: 调用系统截图 qq截图工具地址: https://github.com/17326953721/qqScreenshot.git 截图: 1.window截图: import { execFile } from "child_process"; const isDe
1.在已有的electron项目中添加robotjs并使用 npm install robotjs --save // js中引入使用const robot = require('robotjs') 2.安装时出错 解决方式: node版本太高,14版本的node切成了10.21版本,问题迎刃而解 3.运行时报错 报错原因: robotjs使用的Node
electron中展示圆角,但是设置背景透明无效,如图: 配置如下: mainWindow = new BrowserWindow({ width: 750, height: 440, center: true, useContentSize: false, frame: false, t
使用SRS搭建视频服务器 参见官方地址: https://ossrs.net/lts/zh-cn/docs/v5/doc/getting-started-build https://github.com/ossrs/srs 修改srs.conf文件 将rtc节点下的rtmp_to_rtc从off修改为on 启动服务器 ./objs/srs -c conf/srs.conf 推视频流 使用ff
分别安装Vue和Electron 参照地址: https://cn.vuejs.org/guide/quick-start.html#creating-a-vue-application https://www.electronforge.io/ npm init vue@latest npm init electron-app@latest my-app -- --template=webp
安装Node-USB 参考地址:https://github.com/node-usb/node-usb 安装USB操作,是需要用到node-usb这个库的。官方提供了一个Electron-USB的Demo,地址:https://github.com/node-usb/node-usb-example-electron 但是运行提供的DEMO无法检测到我要开发的设备,这个DEMO可以检测到鼠标和