加密护航，代码无忧！只需一步，让你的代码固若金汤，告别泄露烦恼！（亲测有效，已改造10+项目）1. 背景现在随着pyt

1. 背景

现在随着python爬取网站越来越普遍，网络安全渐渐受到大家的重视，有时候公司出于安全考虑，并且保护自己的知识产权，不希望自己的代码被调试，爬取，需要对代码进行加密，达到无法恢复源码甚至无法阅读的目的。

政府类和国企项目一般都需要做等保测评，经常会扫描代码是否存在ip地址泄露，通过混淆加密，防止源码泄露ip地址，也可以达到等保的要求。

2. 准备vue-cli

如果电脑未安装vue-cli，先使用下面命令安装vue-cli，并且创建一个hello-world项目：

// @vue/cli 版本为 5.0.8
npm install -g @vue/cli
vue create hello-world
cd hello-world
npm run serve

ok，现在我们准备工作已经完成~

3. 环境说明

现在项目中使用的环境

"vue": "^3.2.13",
"@vue/cli-service": "~5.0.0",
 // webpack-obfuscator版本
"webpack-obfuscator": "^2.6.0"
"javascript-obfuscator": "^4.1.0",

项目中安装使用webpack-obfuscator时，要注意webpack-obfuscator的版本需要和本地webpack版本相匹配，我安装的vue-cli中webpack版本为webpack@^5.54.0，所以可以直接使用最新版webpack-obfuscator@3.5.1。（4.x版本的webpack使用最新版的@3.5.1会出现node_modules中文件报错，需要注意，测了下webpack-obfuscator@1.1.1版本也可以，如果使用过程中安装报错，可以自己尝试重复卸载安装切换版本调试）

  "dependencies": {
    "core-js": "^3.8.3",
    "javascript-obfuscator": "^4.1.0",
    "vue": "^3.2.13",
    "webpack-obfuscator": "^3.5.1"
  },

4. 安装依赖

npm install --save-dev javascript-obfuscator webpack-obfuscator

5. 混淆加密

比如我们在代码中使用到了某个服务器ip地址：127.0.0.1

加密前代码效果，代码逻辑也能够看到。

    plugins: [
      new JavaScriptObfuscator({
        compact:true,
        rotateStringArray: true,
        // stringArray: true,
        // stringArrayThreshold: 0.75,
        stringArrayEncoding: 'base64',
      })
    ]

仅引入webpack未做配置时候，变量已经被加密混淆，但是ip地址还可以被看到。

const JavaScriptObfuscator = require("webpack-obfuscator");

我们继续增加配置

 plugins: [
      new JavaScriptObfuscator({
        compact:true, // 压缩代码
      }),
  ],

配置压缩代码后，变量名和变量值已经被压缩，能够看到IP已经被加密过，但是逻辑还是能被看到一部分，继续增加配置。

image-20231124103352947转存失败，建议直接上传图片文件

最终配置：

const { defineConfig } = require('@vue/cli-service')
const JavaScriptObfuscator  = require("webpack-obfuscator");

module.exports = defineConfig({
  transpileDependencies: true,
  productionSourceMap: false,
  devServer: {
    port: 1993,
    headers: {
      'Access-Control-Allow-Origin': '*',
    },
  },
  configureWebpack: {  
    optimization: {  
      minimizer: [  
      ],  
    },  
    plugins: [
      new JavaScriptObfuscator({
        compact: true,  // 压缩代码
        unicodeEscapeSequence: true // 转义
      })
    ]
  }
})



// 补充：区分环境加密写法
const JavaScriptObfuscator  = require("webpack-obfuscator");
modules.exports = {
    configureWebpack:(config){
         if (process.env.NODE_ENV === 'production') { 
             // config.optimization.minimizer[0].options.terserOptions.compress.warnings = false;
             config.plugins.push( new JavaScriptObfuscator( 
                // JavaScriptObfuscator插件作用：加密混淆打包后代码 
                { 
                    compact: true, 
                    unicodeEscapeSequence: true 
                } 
            ))
         }
    }
}