deobfuscate with sourcemap

[jimmywarting]

it would be cool if you took advantage of the sourcemap if such exist. Would be nice to just pass a url and all the relative path from that url be used to download the original code

[jimmywarting]

Finally decided to take mathers into my own hands: https://jsfiddle.net/maqLcbrf/ Not perfect but gets the job done

[bitwiseman]

Great! Please add this into the index.html page and include tests or instructions on how to test it. Seems like a cool feature!

[jimmywarting]

I have only tested it with one sourcemap url... I got the original code with comments and import statements and everything and the hole node_modules folder. I have not done something about inline sourcemaps so I think something needs to be done about that first.

Also I'm very unfamiliar with you codebase. I will leave it up to you to include it if you want to. Don't want to dig into yet another codebase.

Would be nice if the textarea on your website could detect (inline) sourcemaps and show a filetree to explore the code of each file with an option to download some or everything

[bitwiseman]

That is unfortunate as I don't have time to integrate a feature I don't really understand. 😞 Seems like you'd need to make a change to https://github.com/beautify-web/js-beautify/blob/master/index.html and https://github.com/beautify-web/js-beautify/blob/master/web/common-function.js

If you or anyone else has time, the source from that fiddle was:

HTML:

<script src="https://unpkg.com/source-map@0.7.3/dist/source-map.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.5/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.8/FileSaver.min.js"></script>

<form id="form">
  <input type="url" required placeholder="source map" name="sourcemap">
  <input type="submit">
</form>

JS:

sourceMap.SourceMapConsumer.initialize({
  'lib/mappings.wasm': 'https://unpkg.com/source-map@0.7.3/lib/mappings.wasm'
})

form.onsubmit = async evt => {
  evt.preventDefault()
  const cors = 'https://cors-anywhere.herokuapp.com/'
  const sourceMapURL = evt.target.sourcemap.value
  document.body.innerText = 'downloading sourcemap...'

    const rawSourceMap = await fetch(cors + sourceMapURL).then(r => r.json())

    document.body.innerText = 'generatin AST...'

  sourceMap.SourceMapConsumer.with(rawSourceMap, null, consumer => {
    document.body.innerText = `generatin zip file from ${consumer.sources.length} files`

      const zip = new JSZip()

    for (const source of consumer.sources)
      zip.file(source, consumer.sourceContentFor(source))

        zip.generateAsync({type:'blob'}).then(blob => saveAs(blob, 'out.zip'))
  })

}

[domints]

I appreciate this code but there’s small flaw in it - if you get map of something more complex, like React project with node_modules, you end up with zip with paths with .. in front. Thus I slightly modified this fiddle to wrap results in parent folder and resolve one level of ...

Here’s link: https://jsfiddle.net/re5814ko/8/

I tested it with main.js.map from app.storypoint.poker, and while it doesn’t create complete buildable project (that wasn’t my goal), it gives you correct zip that can be extracted with basic tools like the one built in into the Windows.

This thing could probably use even smarter approach, but I hope this helps in case somebody needs to retrieve original source and stumbles across the same problem. Heck, I might as well try integrating that into beautify-js if I have some spare time this weekend :)

[bitwiseman]

PRs welcome.