Angular项目打包Exe时如何保护App.Asar文件的安全性

1. 强化Angular构建阶段代码混淆 #

生产构建时开启极致压缩与混淆，大幅降低代码可读性：

• 执行构建命令：ng build --prod --optimization=true
• 修改angular.json的build配置，优化Terser参数：

  "optimization": {
    "scripts": true,
    "styles": {"minify": true, "inlineCritical": true},
    "fonts": true
  },
    "scriptsOptimization": "all",
    "terserOptions": {
    "mangle": true,
    "compress": {
      "drop_console": true,
      "drop_debugger": true,
      "pure_funcs": ["console.log"]
    },
    "format": {"comments": false}
  }
  

  此配置会将变量名替换为无意义字符、移除调试信息、删除控制台输出，极大降低代码可理解性。

2. 加密asar文件并自定义加载逻辑 #

利用Electron的asar加密机制，配合主进程自定义解密逻辑防止直接解压：

• 打包asar时添加加密参数：asar pack app app.asar --encrypt your-encryption-key
• 修改主进程（main.js）的加载逻辑，先解密再加载asar：

  const { app, BrowserWindow } = require('electron');
  const fs = require('fs');
  const crypto = require('crypto');
  
  const decryptAsar = (filePath, key) => {
    const cipher = crypto.createDecipher('aes-256-cbc', key);
    const encryptedData = fs.readFileSync(filePath);
    return Buffer.concat([cipher.update(encryptedData), cipher.final()]);
  };
  
  app.whenReady().then(() => {
    const decryptedContent = decryptAsar('./app.asar', 'your-encryption-key');
    const tempAsar = './temp.asar';
    fs.writeFileSync(tempAsar, decryptedContent);
    
    const mainWindow = new BrowserWindow({});
    mainWindow.loadFile(`${tempAsar}/index.html`);
  
    // 退出时清理临时文件
    app.on('will-quit', () => fs.unlinkSync(tempAsar));
  });
  

  注意：加密密钥不要硬编码在主进程，可通过环境变量或其他安全方式注入。

3. 将主进程打包为二进制文件 #

避免主进程的解密逻辑暴露，可将主进程JS编译为二进制：

• 使用nexe打包：nexe main.js -o main.exe
• 或使用pkg工具：pkg main.js --targets win-x64
  编译后主进程代码变为二进制，无法直接查看。

4. 核心业务逻辑迁移至后端 #

最彻底的安全方案是把敏感逻辑从前端转移到后端：

• 将数据处理、权限验证、核心算法等放在后端API中
• 前端仅负责UI渲染和接口调用，即便前端代码被反编译，核心业务逻辑也不会泄露

问题场景示意图 #

内容的提问来源于stack exchange，提问作者Harsh Sharma