探秘app.asar

开发过Electron客户端的都知道，在package.json的build节点下，如果设置"asar": true，软件打包时会把程序文件合成为一个app.asar文件。软件安装后，可以在安装目录的resources子目录下找到它。

// package.json"build": {..."asar": true,...}

app.asar看起来是一个压缩包（像.zip或.7z），有些神秘兮兮的。而事实上，它只是一种打包格式，只是把一个个文件拼接起来，并没有做任何压缩。因为一个包里容纳了多个文件，需要对各个文件做索引，加上这些索引信息后，.asar文件大小实际上超过各个文件加起来的总和。有点小意外吧！

.asar的格式不是秘密，可以将它轻松还原。接下来，大家就跟着我一起演练一下吧（也可以到https://github.com/electron/asar 了解更多细节），分两步：

1. 全局安装asar插件：

npm install -g asar

2. 对指定的app.asar文件执行extract命令，格式为：

asar extract "<源路径>\app.asar" “<目标路径>”

以UX设计师常用工具Figma为例（访问网站www.figma.com，注册/登录后点击网页右上角的用户头像，在下拉菜单中选择“Get desktop app”，下载安装即可），执行如下命令：

asar extract "<你电脑上的安装路径>\Figma\app-108.1.0\resources\app.asar" D:\Test1

我们就可以把Figma的app.asar解开，释放到D:\Test1中。再去D:\Test1看一下，太惊喜了——一堆.js源文件呢！而且没有经过任何混淆，有兴趣的同学可以尽情研究一下人家的源代码！再进一步验证一下：app.asar文件大小是1.55MB，而D:\Test1下的所有文件大小是3.55MB，怎么回事？不是说.asar不做压缩吗？没错！回到Figma的安装目录，你会看到一个app.asar.unpacked目录，里面的文件正好是2MB。在执行asar extract命令的时候，它其实会把app.asar.unpacked目录下的文件一起拷贝到D:\Test1下。（小插曲：在演练的时候我踩过一个坑：因为app.asar的安装路径太深了，我先把它拷贝到D盘，然而在执行asar extract命令时报错了，说找不到app.asar.unpacked目录，哦……我明白了！）

接下来，我们再顺便探索一下其他Electron客户端软件吧。比如微软的Teams，对app.asar解包后，我们打开它的主程序入口文件main.bundle.js，看到如下内容：

!function(e,t){for(var n in t)e[n]=t[n]}(exports,function(e){var t={};function n(i){if(t[i])return t[i].exports;var o=t[i]={i:i,l:!1,exports:{}};

源代码显然是被混淆过的，对人类不太友好，直接放弃吧。再来看GitHub Desktop，有趣的是，在它的安装目录下没有app.asar，然后打开main.js，发现跟Teams类似也是做了代码混淆的。再来看一个叫Lofelt Studio的软件，把它的app.asar解包后，打开main.js看到代码也是被混淆过的，再打开package.json可以发现它是基于React框架开发的，通过webpack编译打包出来的.js文件自然就是这种效果啦。如果大家还意犹未尽的话，https://www.electronjs.org/apps 还有更多Electron App，说不定能探到宝哦！

本文即将收尾，我猜，大家心里可能还有个疑问：.asar既不做加密，也不做压缩，那它还有什么价值呢？没错！使用asar打包不是必需的，就像GitHub Desktop那样。而使用asar打包，网传也有一些好处，比如：如果我们的程序依赖的某些资源路径很深，而在Windows上对资源路径的长度是有限制的，路径过长就会加载失败，使用asar打包就能绕开这个问题；另外，程序运行时加载一个总的.asar文件，比起加载一堆零散的小文件，可以避免磁盘的频繁寻址，在性能上会有一些收益——我觉得，有道理~

探秘app.asar相关推荐

Application entry file “background.ts“ in the “**dist_electron\win-unpacked\resources\app.asar“ does
vue-cli3 + electron 打包报错:Error: Application entry file "background.ts" in the "**\dis ...
.asar反编译，electron打包以后反编译，使用node.js安装asar和反编译app.asar
1.以管理员身份打开Windows PowerShell 输入以下指令安装asar npm install -g asar 2.进行反编译用Windows PowerShell切换到app.asar ...
electron-vue的app.asar
electron-vue的app.asar 下面的例子都是以window系统为基准,并且项目为一个electron-vue项目,为使用vue-cli-plugin-electron-builder为打 ...
如何解压electron的app.asar
目录一.描述: 二.解压步骤: 一.描述: 目前打包electron的项目时,发现打包出的压缩包有点大,查看npm run build里面的build文件夹,发现是app.asar文件比较大, (a ...
解压app.asar文件
npm i -g asar asar extract app.asar ./asar
探秘 App Clips
正文字数:3378字预计阅读时间:9分钟 ◆ ◆ ◆ 简介在iOS14中苹果推出了很多新特性,其中就包含App Clips.App Clips类似微信的小程序,不需要显式的去App Store里 ...
这种app.asar文件怎么做修改啊
electron 安装import_Electron: 从零开始写一个记事本app
Electron介绍简单来说,Electron就是可以让你用Javascript.HTML.CSS来编写运行于Windows.macOS.Linux系统之上的桌面应用的库.本文的目的是通过使用Ele ...
Electron初步【02】--第一个Electron App
目录结构与文件 Electron App的目录结构如下: your-app/ ├── package.json ├── main.js └── index.html 其中的package.json和N ...

探秘app.asar

探秘app.asar相关推荐

最新文章

热门文章