雷石|Electron应用调试技巧分享

共 4510字,需浏览 10分钟

 ·

2023-06-30 16:33



c64f4ff651175b6ef5c6e12a45999bfd.webp







前言



1cb171e792bd65408d116a995d1cd800.webpElectron是一个使用JavaScript、HTML和CSS构建跨平台的桌面应用程序。它基于Node.js和Chromium,被Atom编辑器和许多其他应用程序使用。
Electron兼容Mac、Windows和Linux,可以构建出三个平台的应用程序。  
相对而言,Electron 的维护成本较低,因而十分流行。VS Code、一些企业的即时通讯工具等,都使用了Electron。但存在性能问题,同时也引入了其他的安全问题。






01.




分析Electron应用




一个正常的Electron程序,通常它的JS源码会被打包到.asar文件中,或者直接以JS文件的方式存储在程序目录内,下面是一个例子。






91ea97c78d79a35393f39a7dfe35e2f6.webp








针对asar文件,可以用官方提供的工具(
https://github.com/electron/asar
) 进行解包分析,通过extract参数进行解包,当然直接看解包以后的代码并不是很友好,所以这里不做演示。  



chrome调试Electron应用




02.



Electron应用实际上也是个Chromium ,可以通过Chromium的方式开启开发者工具。以某工具为例为例,在运行程序时,添加--remote-debugging-port=xxxx 参数,即可在对应端口为Electron应用的主窗口开启远程调试功能:
这里端口需要根据inspect(chrome://inspect/)中的配置来选择。




89cc8612f326af282af67d0840acf898.webp



这里使用9222端口,在命令行添加参数启动。









e8caf8200e0d4d34b852925e43dc984d.webp








启动后可以在inspect页面看到对应的Target:




17ad0082e3c500173fa0164938ffea5a.webp







然后就可以点击进入进行调试了,不过此时开启的是Render Process的开发者工具。



87dbd910870cc666f0d877dc2ce19997.webp







我们可以通过添加--inspect=9222参数来调试Main Process。



edd98dee2065ab4fcb704f651514a6a3.webp







03.




Debugtron调试Electron应用





Debugtron是一个基于Electron开发的客户端桌面GUI程序,可以用于调试生产环境下的 Electron 应用。项目地址:
https://github.com/pd4d10/debugtron
  直接下载对应的Releases版本,安装后即可使用。





34ffb36721f1396b81366f0e7c6c1e3e.webp



直接将要调试的Electron应用拖拽过来即可。








15fa756157473bd27d1cc115cffa5218.webp




不过debugtron中没有找到堆栈调用的信息,可以根据这里端口(devtools),添加到inspect的配置中,用chrome的inspect进行调试。




695d948cb43ce8ac79847b6e45cce05a.webp



这样就能跑起来,调起来了。不过现在大多的应用都会对关键的js进行混淆加密,或者使用修改过的Chromium内核,要分析还是要有耐心。



参考




04.






·Electron 的一些调试技巧(点击查看)






往期回顾




01




Python安全工具开发思路分享



02




一个好用的RPC框架



03





一个有趣的ssh后门|Linux后门系列






雷石安全实验室







商务咨询:



0571-87031601



商务邮箱:



mtn@motanni.com



浏览 173
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报