从 uglifyjs 源映射中恢复 javascript 源代码

Question

I am reverse engineering one magical script. I have an ug lified source code and source map generated by uglifyjs .

Does anybody know any straightforward way how to achieve at least partly readable source code from that? I have found some obscure ways including conversions through multiple languages, but I hope something better exists.

Thank you!

Answer 1

There is an npm library called maximize that purports to do this, but I couldn't get it to work. I rewrote it as unsourcemap but I am not a Node JS developer, so I'm sure it's awful. Anyway, it was a pretty trivial application of the source-map npm package.

Once you go through all the rigamarole of installing node-js and nvm and whatnot, you can clone that repo and say:

npm install . -g
unsourcemap path/to/packed.js path/to/packed.js.map path/to/output-dir/

I don't want to maintain this thing, so if someone wants to improve it, please just fork it and point people to that. :-)

Answer 2

If the project is bundled using webpack / browserify, you can use Debundle package to do reverse engineering. Imho, the result will be either good or bad depending on some project.

And because it de-transpiles JS only (the uglifying webpack pipeline), so if you're using Vue SFC, the Debundle cannot produces your original .vue file, it's JS file instead.

Anw, in case of reading source code, if your web page doesn't hide the source map files, you can use Chrome DevTool > Source pannel to read the beautiful source easily:

Answer 3

Check this simple NodeJS implementation: It takes the compiled file with embedded source map and parses it. It's easy to modify and feed only the map file.

const fs = require('fs');
const { SourceMapConsumer } = require("source-map");

fs.readFile('./example.js', 'utf8' , (err, data) => {
  if (err) return console.error(err);

  const sourceMapData = data.split('//# sourceMappingURL=data:application/json;base64,')[1];
  let buff = new Buffer.from(sourceMapData, 'base64');
  let rawSourceMap = buff.toString('ascii');

  const parsed = SourceMapConsumer(rawSourceMap);

  fs.writeFile('example.ts', parsed.sourcesContent, function (err) {
    if (err) return console.log(err);
  });
});

Answer 4

There are a few tools out that that can help with this. I've used http://www.cleancss.com/javascript-beautify/ and http://jsbeautifier.org/ before and had great results. If you do a quick search in Google for a JavaScript Beautifier, you will find lots of similar results. Hope this helps!