electron安装包里封装浏览器直接访问URL配置

2023-08-19 09:17| 来源: 网络整理| 查看: 265

也是因为clojurescript编译后用electron打包成桌面应用安装程序这篇没有解决问题，所以考虑直接用electron打个chrome浏览器进去，然后制定访问的网页，代替本地资源。

话说前一篇之所以没有成功，也不是完全解决不了，而是因为不想折腾了，解决的话思路应该有两条：

figwheel不支持npm程序，换成shadow-cljs之类的编译器增加electron依赖，在应用层触发更新检查

这篇说明一下直接运行URL的配置和注意事项。

1. 下载electron的压缩包

https://electronjs.org/releases/stable

下载解压，内部目录大概如此

electron

主要运行时文件就是resources/default_app.asar

2. 安装asar包解压缩命令 yum install -g asar

两个命令(asar --help)：

asar pack app default_app.asar asar extract|e

其他命令自行百度。

3.核心文件

核心文件就是打包成resources/default_app.asar所需要的文件。在electron的项目目录下，创建一个文件夹app ，里面新建两个文件。

3.1 main.js // app 模块是为了控制整个应用的生命周期设计的。 // BrowserWindow 类让你有创建一个浏览器窗口的权力。 const {app, BrowserWindow, Menu, ipcMain} = require('electron'); const nativeImage = require('electron').nativeImage; var overlay = nativeImage.createFromPath('icon.png'); const mainWindowURL = 'https://www.baidu.com'; let mainWindow; //api:https://wizardforcel.gitbooks.io/electron-doc/content/api/browser-window.html function createWindow () { console.log("createWindow......"); mainWindow = new BrowserWindow({ // fullscreen: true, maximizable: true, //支持最大化 show: false, //为了让初始化窗口显示无闪烁，先关闭显示，等待加载完成后再显示。 // icon: "https://medical.3vyd.com/alk/prod/pc/icon/icon.ico" }) // Emitted when the window is closed. mainWindow.on('closed', function () { console.log("closed......"); mainWindow = null; }) // mainWindow.once('ready-to-show', () => { //开启这个以后点击了图片虽然没有白屏，但是会感觉不到点了没点 mainWindow.maximize(); //打开时最大化打开，不是全屏，保留状态栏 // }) // mainWindow.setOverlayIcon(overlay, "医敏") mainWindow.setTitle("过敏性疾病高端用户平台"); mainWindow.setAutoHideMenuBar(true);//自动隐藏菜单 mainWindow.loadURL(mainWindowURL); // app.commandLine.appendSwitch("--disable-http-cache") 禁用缓存 // mainWindow.webContents.openDevTools({mode:'bottom'}); mainWindow.show(); } app.on('ready', function() { console.log("ready......"); createWindow(); }); // Quit when all windows are closed. app.on('window-all-closed', function () { // On OS X it is common for applications and their menu bar // to stay active until the user quits explicitly with Cmd + Q if (process.platform !== 'darwin') { app.quit(); } }) 3.2 package.json { "name": "electron", "productName": "Electron", "main": "main.js" }

注意：productName的值千万不需要改。

4. 打包

在electron/resources目录下执行：

rm -rf default_app.asar asar pack app default_app.asar

也就是用自己心大的asar文件替换原来旧的。

5. 测试

在windows上访问该exe应用，一般应该没有问题打开百度的。

问题： electron缓存问题浏览器访问的资源都会被缓存，几种方式避免缓存。在css或者js等资源后面加版本号打包时禁用缓存，参考：electron 如何禁用本地缓存？强制刷新缓存方案清除本地cache

windows上位置： The Electron stores it's cache in these folders: Windows: C:\Users\AppData\Roaming\Cache Linux: /home//.config//Cache OS X: /Users//Library/Application Support//Cache

升级问题因为直接访问url，所以不存在上一篇说的版本更新问题。

【本文地址】

公司简介

联系我们