I am reverse engineering one magical script. I have an uglified 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!
I am reverse engineering one magical script. I have an uglified 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!
Share Improve this question asked Aug 23, 2015 at 1:52 yetyyety 7114 gold badges16 silver badges26 bronze badges 3- I'm not aware of a tool that will reverse this off the top of my head. However if you load up the file in an HTML page in Chrome and open the dev tools it should be able to display the source code. If the obfuscated code doesn't have a reference to the source map you may need to add it yourself. – Boushley Commented Aug 23, 2015 at 2:17
- If you have an "obscure way" and you only need to do this once, why don't you just do that? – Ira Baxter Commented Aug 23, 2015 at 7:13
- How did you get the source map, without having run uglify yourself on the original source? Surely the original author would not provide it, having signalled their intentions by uglification. – Ira Baxter Commented Aug 23, 2015 at 7:13
4 Answers
Reset to default 9There 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. :-)
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:
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);
});
});
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!