Javascript：使用源映射调试堆栈跟踪

Question

这可能是一个奇怪的问题，我似乎无法搜索正确的短语来提取任何相关的答案。

我们有一个在客户端计算机上运行的应用程序并且已缩小。我们生成源映射，但它们不会暴露给生产版本。

我有一个window.onerror，我使用了一个全部的代码来发现它是我不知道的方式。值得庆幸的是，这几乎从未被利用过。最近，我偶尔会出现undefined错误，因此有人找到了办法做某些不合意的事情。 Chrome可以很好地记录堆栈跟踪中的行号和列号，当错误捕获其中一个错误时，我们会记录到日志记录服务器，但是我必须调试并查看min文件并不是很有吸引力。 undefined is not a function也不是很有帮助:)）

问题：是否有一个工具 - 可能在nodejs中 - 可以采用min文件，源映射和堆栈跟踪字符串并生成相关文件，行号和列号？

我意识到浏览器会在运行时为您执行此操作，但在这种情况下，我没有那么奢侈，因为我试图弄清楚事后错误实际上是什么。

Answer 1

找到了这个：https://github.com/thlorenz/stack-mapper

我使用uglify，它似乎产生了这个需要的正确映射，看起来它适用于我上面建议的情况。

修改 实际上，这个工作效果要好得多，使用https://github.com/mozilla/source-map/要简单得多。

示例用法：

var fs = require('fs');
var smc = require('source-map');

var stack = "TypeError: undefined is not a function\r\nat h/min/min.js?1404839824760:9:23048";
stack = stack.split(/\r\n/g);
var error = stack.shift(); // First line is the actual error

var errors = [];
var file = null;

stack.forEach(function(line){
    var _trace = line.split('/').pop();
    var trace = {};
    trace.filename = _trace.split('?').shift();
    _trace = _trace.split(':');
    trace.line = parseInt(_trace[1], 10);
    trace.column = parseInt(_trace[2], 10);
    errors.push(trace);

    if(!file)
        file = trace.filename.split('.').shift();

    trace.filename = __dirname + '/../min/' + trace.filename;
});

// This does not account for multiple files in stack trace right now
var map = fs.readFileSync(__dirname + '/../src/' + file + '.js.map');
map = JSON.parse(map);
var sm = new smc.SourceMapConsumer(map);
console.log(sm.originalPositionFor(errors[0]));

Answer 2

stacktrace.js看起来是实现这一目标的另一个有用工具。

来自他们网站的例子：

src

Answer 3

我发现https://github.com/thlorenz/stack-mapper易于使用，可以自动执行此操作。如果您希望以交互方式执行此操作，则可以在Web浏览器中使用带有以下工具的堆栈映射器：https://github.com/Jimbly/stackwalker-只需加载.map文件，粘贴（最小化的）调用堆栈或单个错误位置，然后然后您可以在堆栈中单击并在右侧看到原始代码。