前端如何在 Vite 项目中混淆你的代码

什么是 viteObfuscateFile?

简单来说,viteObfuscateFile 是一个 Vite 插件,用于将你的 JavaScript 代码混淆,让别人看得头疼、抓狂,最终不得不放弃。它基于强大的 JavaScript Obfuscator 库,专门混淆指定的文件。

这个插件不会大包大揽去处理整个项目,而是非常贴心地只针对某些文件动手脚。毕竟,代码混淆虽然让别人难受,但也可能让你自己难受。所以我们只混淆那些真正敏感、需要保护的文件。

npm install vite-plugin-obfuscator --save-dev

在你的 vite.config.js 文件中配置一下,你就可以正式进入“反抄袭新时代”了。

import { defineConfig } from 'vite';
import viteObfuscateFile from 'vite-plugin-obfuscator';
 
export default defineConfig({
  plugins: [
    viteObfuscateFile({
      include: ['src/**/*.js'], // 指定需要混淆的文件(正则也行)
      exclude: ['node_modules/**'], // 别把人家的库也混了,抄袭者可能是你的用户
      obfuscatorOptions: {
        compact: true, // 把代码压成面条一样紧凑
        controlFlowFlattening: true, // 开启控制流平坦化,让代码逻辑难以追踪
        controlFlowFlatteningThreshold: 0.5, // 控制流平坦化的阈值,影响混淆程度
        deadCodeInjection: true, // 注入死代码,迷惑对手
        deadCodeInjectionThreshold: 0.1, // 死代码注入概率
        debugProtection: true, // 调试保护,阻止开发者工具调试
        disableConsoleOutput: true, // 禁用 console 输出,增加调试难度
        domainLock: [], // 锁定混淆后的代码,仅允许在特定域名运行
        identifierNamesGenerator: 'hexadecimal', // 标识符混淆方式(如十六进制)
        renameGlobals: true, // 全局变量和函数名称混淆
        rotateStringArray: true, // 字符串数组随机旋转
        selfDefending: true, // 启用自我保护,防止代码被美化
        stringArray: true, // 提取字符串到数组
        stringArrayEncoding: ['rc4'], // 字符串数组编码方式(如 rc4 或 base64)
        stringArrayIndexesType: ['hexadecimal-number'], // 字符串数组索引类型
        stringArrayThreshold: 0.75, // 字符串数组使用的概率
        unicodeEscapeSequence: false, // 禁用 Unicode 转义序列
      },
    }),
  ],
});

这段配置代码很全面。下面,我们对关键参数逐一解析:

include:指定需要混淆的文件路径,比如你的核心业务逻辑代码。
exclude:排除那些无需混淆的文件,比如依赖库。
compact:让代码变得紧凑,丢掉没必要的空格和换行。
controlFlowFlattening:开启控制流平坦化,把简单的逻辑代码变得绕来绕去,仿佛“逻辑迷宫”。
controlFlowFlatteningThreshold:控制流平坦化的概率,值越高混淆越多。
deadCodeInjection:随机插入一些“假代码”,看似有用其实无效,让人晕头转向。
deadCodeInjectionThreshold:控制假代码的插入比例。
debugProtection:防止开发者工具调试,直接阻断某些控制台行为。
disableConsoleOutput:禁用 console 输出,进一步阻碍调试。
domainLock:限制代码只能在特定域名运行,保护你的代码不被盗用。
identifierNamesGenerator:混淆变量名的生成方式,常用 hexadecimal 或 mangled。
renameGlobals:是否混淆全局变量和函数名。
rotateStringArray:随机旋转字符串数组,进一步增加混淆难度。
selfDefending:保护混淆后的代码,避免被美化或修改。
stringArray:将字符串提取到数组中,以增加混淆效果。
stringArrayEncoding:对字符串数组加密,比如 rc4 或 base64。
stringArrayIndexesType:设置字符串数组的索引类型,比如 hexadecimal。
stringArrayThreshold:控制字符串数组的使用概率。
unicodeEscapeSequence:控制是否将字符串转换为 Unicode 转义序列。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容