16

私は、JavaScript エラーをキャッチし、それを内部ログ用に独自のシステムに送信する方法についていくつかの調査を行ってきました(これにより、可能な場合は複製を試み、可能なバグを修正することができます)。これまでのところ、かなりの数の有料サービスを見つけました。

TrackJSは確かに面白そうに見えますが、毎月これ以上の出費をする余裕はありません。その後、このライブラリに出くわしました:

http://www.stacktracejs.com/#!/docs/stacktrace-js

私はそれを実行できないようです。ここに私がしようとしているものがあります:

window.onerror = function(msg, file, line, col, error) {
    StackTrace.fromError(error).then(callback).catch(errback);
};

var callback = function(stackframes) {
    var stringifiedStack = stackframes.map(function(sf) {
        return sf.toString();
    }).join('\n');
    console.log(stringifiedStack);
};

var errback = function(err) {
        console.log(err);
};

StackTrace.get().then(callback).catch(errback);

...そして、私が返すのは次のとおりです。

TypeError: ErrorStackParser が定義されていません

var stackframes = ErrorStackParser.parse(エラー);

他の誰かが解決策を提案したり、stacktrace.jsスクリプトで私が間違っていることを確認したりできますか?

更新:以下の助けを借りて、少なくとも今何かをすることができました. 複数の js ライブラリが必要であることがわかりました。

しかし、私はまだそれを実行することができないようです。

var callback = function(stackframes) {
    console.log(stackframes)
    var stringifiedStack = stamap(function(sf) {
        return sf.toString();
    }).join('\n');
    console.log(stringifiedStack);
};

var errback = function(err) { console.log(err.message); };

 try {
    foo;
 } catch(e) {
    StackTrace.get().then(callback).catch(errback);
 }

コンソールにエラーが記録されるようになりましたが、行番号とエラー メッセージはあまり役に立ちません :( 例:

.get()@https://cdn.steampunkjunkies.net/2014/js/scripts-all11.js:5:19706
{anonymous}()@https://cdn.steampunkjunkies.net/2014/js/scripts-all11.js:84:2

行 84 は呼び出し元関数です。

StackTrace.get().then(callback).catch(errback);

...そして 5 行目は、stacktrace.min.js の縮小されたインクルードです (メインの JS ファイル内)。

どうすれば有益な情報を得ることができるのか、私は少し困惑しています :/

更新 2 : わかりました、私は近づいています!

var callback = function(stackframes) {
    var stringifiedStack = stackframes.map(function(sf) {
        return sf.toString();
    }).join('\n');
    alert(stringifiedStack);
};

var errback = function(err) { console.log(err.message); };

 try {
    var foo = 0;
    foo / 1;

    aklert;

    test;
 } catch(e) {
    StackTrace.fromError(e).then(callback).catch(errback);
 }

これにより、alert()メッセージが出力されます。

{匿名}()@ https://cdn.steampunkjunkies.net/2014/js/scripts-all11.js:73:1

ただし、必要な情報はそれだけではありません。明らかに、素敵なメッセージが必要です(つまりvar x cannot be undefined

誰でもアイデアはありますか?

それらを(行番号と列番号を使用して)配列に保存しようとしましたが、すべてのブラウザーで機能するわけではありません(皮肉なことに、デバッグコードは致命的なエラーを引き起こしました:))

更新 3

わかりました、まあ、私たちは近づいています:)

var callback = function(stackframes) {
    var stringifiedStack = stackframes.map(function(sf) {
        return sf.toString();
    }).join('\n');
    alert(stringifiedStack);
};

var errback = function(err) { console.log(err.message); };

window.onerror = function(msg, file, line, col, error) {
    var callback = reportWithMessage(msg);
    StackTrace.fromError(error).then(callback).catch(errback);
};


function reportWithMessage(message) {
    return function report(stack) {
        var yourErrorCollectorUrl = 'https://steampunkjunkiesdev.net/cgi-bin/debug.cgi';
        stack.message = message;
        StackTrace.report(stack, yourErrorCollectorUrl);
    };
}

 try {
    var foo = 0;
    foo / 1;

    aklert;

    test;
 } catch(e) {
    StackTrace.get().then(reportWithMessage()).catch(errback);
 }

ここに画像の説明を入力

92行目はこれです}:

StackTrace.get().then(reportWithMessage()).catch(errback);

...そのため、この関数が呼び出されたことがわかりますが、実際のエラーの行番号はありません。

何か案は?JS のエラーをキャッチしてスクリプトに報告するだけで、どれほど複雑なのか信じられません。過去 20 年以上にわたるインターネットの発展に伴い、私たち開発者のために、より準拠したものが開発されていたと思われるでしょう :/

4

1 に答える 1