怎样用uglifyjs3压缩一组代码，将几个文件的函数名同步混淆？可以用uglifyjs混淆.html文件吗？

Question

比如我在A.js中创建了：

function Add(str1, str2)
{
    var strSum = str1 + str2;
    return strSum;
}

在B.js调用了A的函数：

var sum = Add(1,2);

在C.html调用了A的函数：

var sum = Add(2,2);

可以用uglify把他们的函数名同步混淆吗，如果A中的‘Add’变成m，B和C中的‘Add’也变成m。
现在我通过把lifyjs.js文件中option配置成：

var options = {
    mangle: {
        toplevel: true,
    },
    nameCache: {}
};

可以把A.js中的Add变为n，但是其他文件调用的函数Add不能同步混淆。

Answer 1

本答案由爪磕协同GPT-4o回答，希望对您有所帮助 解决问题望采纳！

---

要使用 UglifyJS 3 对多个文件进行同步混淆，你可以利用 nameCache 选项来共享变量名映射，从而确保所有文件中的函数名和变量名等能够一致地被混淆。以下是一个详细的步骤来实现这个目标：

1. 安装 UglifyJS 3

首先，确保你已经安装了 UglifyJS 3：

npm install uglify-js --save-dev

2. 创建一个 nameCache 对象

使用一个共享的 nameCache 对象来确保所有文件的混淆是一致的。

3. 压缩和混淆多个文件

在 Node.js 脚本中处理多个文件并确保它们使用相同的 nameCache：

const fs = require('fs');
const path = require('path');
const UglifyJS = require('uglify-js');

const filesToMinify = ['A.js', 'B.js', 'C.html']; // 你要压缩的文件列表
const nameCache = {};

filesToMinify.forEach(file => {
    const filePath = path.join(__dirname, file);
    const code = fs.readFileSync(filePath, 'utf8');

    const result = UglifyJS.minify(code, {
        mangle: {
            toplevel: true
        },
        nameCache: nameCache
    });

    if (result.error) {
        console.error(`Error minifying ${file}:`, result.error);
        return;
    }

    const minifiedPath = filePath.replace(/\.js$/, '.min.js').replace(/\.html$/, '.min.html');
    fs.writeFileSync(minifiedPath, result.code, 'utf8');
    console.log(`Successfully minified ${file} to ${minifiedPath}`);
});

4. 确保 HTML 文件中的 JavaScript 也被处理

如果你的 HTML 文件中包含内联的 JavaScript 代码，你需要提取这些代码进行混淆，然后再将其插入回 HTML 文件中。以下是一个简单的示例：

const fs = require('fs');
const path = require('path');
const UglifyJS = require('uglify-js');
const { JSDOM } = require('jsdom');

const filesToMinify = ['A.js', 'B.js', 'C.html']; // 你要压缩的文件列表
const nameCache = {};

filesToMinify.forEach(file => {
    const filePath = path.join(__dirname, file);
    const code = fs.readFileSync(filePath, 'utf8');

    if (path.extname(file) === '.html') {
        const dom = new JSDOM(code);
        const scripts = dom.window.document.querySelectorAll('script');

        scripts.forEach(script => {
            if (script.textContent) {
                const result = UglifyJS.minify(script.textContent, {
                    mangle: {
                        toplevel: true
                    },
                    nameCache: nameCache
                });

                if (result.error) {
                    console.error(`Error minifying script in ${file}:`, result.error);
                    return;
                }

                script.textContent = result.code;
            }
        });

        const minifiedPath = filePath.replace(/\.html$/, '.min.html');
        fs.writeFileSync(minifiedPath, dom.serialize(), 'utf8');
        console.log(`Successfully minified ${file} to ${minifiedPath}`);
    } else {
        const result = UglifyJS.minify(code, {
            mangle: {
                toplevel: true
            },
            nameCache: nameCache
        });

        if (result.error) {
            console.error(`Error minifying ${file}:`, result.error);
            return;
        }

        const minifiedPath = filePath.replace(/\.js$/, '.min.js');
        fs.writeFileSync(minifiedPath, result.code, 'utf8');
        console.log(`Successfully minified ${file} to ${minifiedPath}`);
    }
});

5. 运行脚本

保存以上脚本为 minify.js，然后在命令行中运行：

node minify.js

这样，所有指定的文件中的函数名和变量名都会一致地被混淆。如果 A.js 中的 Add 函数被混淆为 m，那么 B.js 和 C.html 中的 Add 也会被混淆为 m。

通过这种方式，你可以确保多个文件的函数名和变量名混淆一致。