首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

客户端开发(Electron)系统级API使用

嵌入 Chromium 和 Node.js 到 二进制的 Electron 允许您保持一个 JavaScript 代码代码库并创建 Windows上运行的跨平台应用 macOS和Linux——不需要本地开发...调用系统API实现文件保存或读取前的选择功能: 如上图所示的功能,我们使用电脑时就经常会遇到,Electron我们可以通过调用dialog.showOpenDialogSync函数同步打开下面的对话框...properties openFile 允许选择文件 openDirectory 允许选择文件夹 multiSelections 允许多选 showHiddenFiles 显示对话框隐藏文件...菜单栏菜单: Electron提供的默认菜单栏中的菜单都是一些为了演示和开发使用的,实际的应用我们还是需要进行配置来实现我们自己的功能。...菜单栏自动隐藏,应用启动后默认隐藏,当按下ALT件后显示原菜单栏: const win = new BrowserWindow({ autoHideMenuBar: true, }) 通过Electron

2.5K50
您找到你想要的搜索结果了吗?
是的
没有找到

第五章-处理多窗口 | Electron实战

当该窗口关闭时,应用程序退出。虽然这种行为完全可以接受,但我们通常希望能够打开多个独立的窗口本章,我们将Fire Sale从一个窗口应用程序转换为一个支持多个窗口的应用程序。...如果它们仍然是未定义的(例如,没有焦点窗口),那么Electron将使用缺省值,就像我们实现此功能之前所做的那样。图5.4显示了与第一个窗口相比的第二个窗口偏移量。 ?...我们只有一个窗口,无法创建其他窗口本节,我们只允许应用程序macOS中保持打开状态。默认情况下,当Electron触发它的window-all-closed事件时,它将退出应用程序。...另一种可能性是,您的应用程序可以隐藏,或者使用全局快捷方式显示,或者从托盘或菜单栏显示。我们将在后面的章节实现这些。...通过这两个额外的事件,我们将Fire Sale从窗口应用程序转换为支持多窗口的应用。这个清单显示了主进程当前状态的代码。 列表5.13 主进程实现多个窗口: .

4.1K21

如何使用mimicLInux以普通用户身份来隐藏进程

关于mimic mimic是一款针对进程隐藏的安全工具,该工具的帮助下,广大研究人员可以通过普通用户身份来Linux操作系统(x86_64)上隐藏某个进程的执行。...使用的是一种名为“Covert execution”的技术,这种技术是一种隐藏进程的方式。在这种情况下,mimic会将进程隐藏起来,mimic可以启动任何程序,并使其看起来像任何其他程序。...0t0 TCP *:31337 (LISTEN) apache2 1931 empty 4u IPv4 14463 0t0 TCP *:31337 (LISTEN) 第二个例子...这将允许我们选择进程列表我们所希望进程出现的位置。需要注意的是,内核为内核线程保留了前300个pid。如果你试图低于这个值,你可能最终会得到进程pid 301。

34130

客户端开发(Electron)认识窗口

背景说明: 窗口指的就是我们电脑端经常使用的软件时候显示Logo,标题和操作最小化,最大化,关闭按钮的标题栏及标题栏下面显示内容的整个窗口,这往往Web前端接触的不是那么多,但要开发一款体验不错的...,如下图: Vue的App.vue通过html标签来绘制我们的标题栏,绘制后的结果如下图所示: 为标题栏的按钮增加事件: 按钮事件和调用函数的定义均与Vue一致,我们需要考虑的是如何与...Electron联通来调用对应的API: 调整窗口对象的如下所示属性,切记启用remote: App.vue中导入electron对象: const { remote } = window.require...('electron') 对应的操作API调用: 当窗口最大化后如何缩小: 监听窗口的变化来动态切换isMaxSize的值来动态渲染最大化后的按钮,主要通过窗口对象来监听maximize,unmaximize...,我们可以用来记录窗口信息: 恢复窗口信息的代码如下: 当我们修改主进程的代码并服务自动重启后你会发现窗口会先回到居中的位置再移动到保存的窗口状态的位置,我们需要在主进程关闭展示窗口,并由我们渲染进程控制

5.1K60

一个Electron应用程序的package.json文件。

唯一客服系统PC客户端,利用Electron打包实现 可以避免浏览器被误关闭,支持缩小右下角系统托盘,支持通知栏和声音访客新消息提醒 一个Electron应用程序的package.json文件。...BrowserWindow({ width: 1366, height: 768, //fullscreen: true, // 添加此行以使窗口默认全屏 frame:...minimizable: true, // 添加此行以启用最小化 closable: true, // 将此行更改为false以禁用关闭 // show: false // 添加此行以最初隐藏窗口...}) win.loadURL('https://gofly.v1kf.com/main') //隐藏顶部菜单 win.setMenu(null); //托盘图标 let tray...event.preventDefault() win.hide() //显示托盘提示 tray.displayBalloon({ title:"客服系统", content:"已隐藏在托盘处

1.5K20

Electron

Electron .npmrc 安装electron依赖经常会不成功 项目目录下创建.npmrc文件,设置镜像地址 npm config set strict-ssl false registry...热加载 方案一 安装:npm install electron-reloader --save-dev 主进程 js 文件 try { require("electron-reloader")(module... Electron ,借助 Tray 模块实现。 //app 模块,控制整个应用程序的事件生命周期。 //BrowserWindow 模块,它创建和管理程序的窗口。.../src/img/logo.png"); //应用运行时的标题栏图标 let mainWindow, tray; // Electron ,只有 app 模块的 ready 事件被激发后才能创建浏览器窗口...("Tasky"); //鼠标移到托盘应用程序的图标上时,显示的文本 tray.on("click", () => { //点击图标的响应事件,这里是切换主窗口的显示和隐藏 if

10210

10分钟实现Typora(markdown)编辑器

为了简化和清晰,我们继续熟悉Electron时,我们app/main.js中保存了主进程的所有代码,app/renderer.js中保存了渲染器进程的所有代码。...index.html,我们添加清单3.3的标记来创建图3.5的浏览器窗口。 ? 图3.5 开始我们第一个未样式化的Electron应用 列表3.3 我们应用的标记:....用户不习惯本地应用程序中看到这种情况,我们可以通过重新思考如何启动窗口来避免这种情况。 如果您认为应用程序第一次启动时的虚无闪光是无意义的,考虑主进程的代码:它创建一个窗口,然后在其中加载内容。...如果我们隐藏窗口直到内容被加载呢?然后,当UI准备好时,我们显示窗口,并避免短暂地暴露一个空窗口。...Electron的默认应用程序菜单提供了一个命令来打开应用程序的Chrome开发工具。第6章,我们将学习如何创建我们自己的自定义菜单,并在您不希望将其公开给用户的情况下消除此功能。

2.6K50

第三章 构建Markdown应用程序 | Electron in Action(中译)

为了简化和清晰,我们继续熟悉Electron时,我们app/main.js中保存了主进程的所有代码,app/renderer.js中保存了渲染器进程的所有代码。...优雅地显示浏览器窗口 如果你仔细观察你的应用程序的启动,您将注意到,Electron加载index.html并在窗口中呈现DOM之前,窗口完全为空。...用户不习惯本地应用程序中看到这种情况,我们可以通过重新思考如何启动窗口来避免这种情况。 如果您认为应用程序第一次启动时的虚无闪光是无意义的,考虑主进程的代码:它创建一个窗口,然后在其中加载内容。...如果我们隐藏窗口直到内容被加载呢?然后,当UI准备好时,我们显示窗口,并避免短暂地暴露一个空窗口。...Electron的默认应用程序菜单提供了一个命令来打开应用程序的Chrome开发工具。第6章,我们将学习如何创建我们自己的自定义菜单,并在您不希望将其公开给用户的情况下消除此功能。

2K30

基于electron快速将任意网站打包成跨平台的桌面端软件

当然这篇文章不会介绍如何从零使用 electron , 而是会提供一种方案, 帮助大家快速的将线上网站转化为 electron 应用....Electron架构上非常类似于一个现代的网页浏览器。...每个 Electron 应用都有一个单一的主进程,作为应用程序入口。主进程 Node 环境运行,我们可以使用所有 Node 的能力。 那么主进程我们可以做些什么呢?...主进程的主要目的是使用 BrowserWindow 模块创建和管理应用程序窗口。 BrowserWindow 类的每个实例创建一个应用程序窗口,且单独的渲染器进程中加载一个网页。...实现将线上网站打包成桌面端软件 我们知道如果想要加载第三方网络资源, 可以使用 mainWindow.loadURL(url) 来实现, 所以只需要将网址放到 loadURL 方法electron

39410

客户端开发(Electron)URL远程启动

嵌入 Chromium 和 Node.js 到 二进制的 Electron 允许您保持一个 JavaScript 代码代码库并创建 Windows上运行的跨平台应用 macOS和Linux——不需要本地开发...这样的功能是如何实现的呢?我们一起来走进Electron Url 远程启动。...客户端操作时:浏览器打开: 第一步:preload定义打开浏览器的桥接函数 通过渲染进程发送open事件 桥接函数 const { contextBridge, ipcRenderer } = require...gotTheLock) { app.quit(); } else { // 当第二个实例被执行并且调用 app.requestSingleInstanceLock() 时,这个事件将在你的应用程序的首个实例触发...file://", __dirname, "index.html"); shell.openExternal(pagePath); }); 复制代码 总结: 本篇涉及到了以下2点: windows第二个窗口实例处理

1.7K30

超详细的Electron使用教程

Electron Electron是什么,我们先看看官方https://www.electronjs.org/ 的介绍如何说的 What is Electron?...启动 执行npm start即可启动这个项目,可以看到打开了一个窗口,显示index.html的内容。 本地应用网络请求失败 上面可以看到main.js是通过loadFile来加载文件的。...应用只是在窗口内展示,所以Electron窗口也需要我们关注,通过Electron提供的api来定义一个合适的窗口 窗口设置 在上面我们创建的main.js,可以看到通过BrowserWindow创建的窗口...,也就是说这里的高度是内容的高度+24 菜单栏 默认窗口是有菜单栏的,mac上因为是通知栏上而不是窗口上,所以不是很明显,但是windows上就很明显了。...这是因为Electron的默认配置导致的,Electron默认是开启同源策略的,这样就导致无法访问外部的一些链接。

7.8K40

分享这半年的 Electron 应用开发和优化经验

我们把隐藏的内容、或者次优先级的模块拆分出去,启动模块只保留关键路径。我们也可以浏览器空闲时预加载这些模块。...比如要求初始化的过程不要有‘副作用’,例如DOM访问。因为‘编译时‘这些东西不存在。...这篇文章详细介绍了如何Electron 应用 v8 snapshot: How Atom Uses Chromium Snapshots 还有一个更加广泛使用的方案是 v8 Code Cache。...这里用到了一些 Hack 手段,我们将这些窗口放到了屏幕之外,并设置 skipTaskBar 来实现隐藏或者关闭的效果。 对于频繁开启/关闭的窗口,也可以使用窗口池来优化。...千万避免主进程跑计算密集任务和同步I/O。

6.9K83

用JS开发跨平台桌面应用,从原理到实践

开发模式上,Electron调用系统API和绘制界面上是分离开发的,下面我们来看看Electron关于进程如何划分。...BrowserWindow的构造参数,将frame设置为false可以指定窗口为无边框窗口,将工具栏隐藏后,就会产生两个问题: 1.窗口控制按钮(最小化、全屏、关闭按钮)会被隐藏 2.无法拖拽移动窗口...可以通过指定titleBarStyle选项来再将工具栏按钮显示出来,将其设置为hidden表示返回一个隐藏标题栏的全尺寸内容窗口左上角仍然有标准的窗口控制按钮。...并且有两种对象可以调用打印: 通过window的webcontent对象,使用此种方式需要单独开出一个打印的窗口,可以将该窗口隐藏,但是通信调用相对复杂。...首先要监听窗口的关闭事件,阻止用户关闭操作的默认行为,将窗口隐藏

6.9K50

自己动手用electron+vue开发博客园文章编辑器客户端【一】

QQ截图、微信截图,直接黏贴到编辑器) 图片拖拽到编辑器自动上传 插入公式、插入地图、插入表情、插入表格、插入音乐、插入代码...一应俱全; 纯客户端,直接与博客园服务端通信(没有任何自建服务,不采集用户任何信息...程序的入口是一个js文件 js文件里打开一个窗口,让这个窗口加载指定的画面 functioncreateWindow () {     mainWindow = newBrowserWindow({...的时候,创建了一个窗口,并加载了一个路径 app和窗口都是通过下面的代码得来的: import{ app, BrowserWindow } from 'electron' 路径是通过下面的代码得来的:...`http://localhost:9080`:     `file://${__dirname}/index.html` electron允许打开子窗口,也允许开多标签页 苹果端,当所有窗口都关闭后...要想绕开这个东西,成本一下子高很多 因为这个东西的目的,就是为了防止被绕开的 (其实我有思路,但并未做尝试) 后来想到,就算绕开又如何呢?

3.4K30
领券