27

フォームのあるページがたくさんある私のプロジェクト。これは、銀行の CRM システムのバックエンドであるため、作業プロセス中のエラーをキャプチャして調査する必要があります。サーバー側では Java 例外システムを強化しましたが、クライアント側でエラーが発生した場合 - javascript 現在得られる唯一の情報は、IE の js エラー ウィンドウ、または上級ユーザーが作成したページのスクリーンショットです。

Javascript コードには、Jquery を利用した UI 拡張機能と、ハードコーディングされたインライン イベント ハンドラーおよび関数の両方が含まれています。

それで、あらゆる種類のjsエラーをキャプチャするためのアプローチを使用できるかどうかを尋ねていますか? Mozilla の firebug や Chrome の web-console のような追加のライブラリまたはスタックトレースを提供できるものはありますか?

4

7 に答える 7

32

を調べwindow.onerrorます。エラーをキャプチャしてサーバーに報告する場合は、おそらく AJAX リクエストを試すことができます。

window.onerror = function(errorMessage, errorUrl, errorLine) {
    jQuery.ajax({
        type: 'POST',
        url: 'jserror.jsf',
        data: {
            msg: errorMessage,
            url: errorUrl,
            line: errorLine
        },
        success: function() {
            if (console && console.log) {
                console.log('JS error report successful.');
            }
        },
        error: function() {
            if (console && console.error) {
                console.error('JS error report submission failed!');
            }
        }
    });

    // Prevent firing of default error handler.
    return true;
}
于 2012-06-29T07:06:45.980 に答える
20

免責事項: 私はSentryの CEO であり、Javascript を含む多くの言語のクラッシュ レポートを行うオープン ソースの有料サービスです。

フロントエンドの例外をキャプチャするのはかなり難しい場合があります。テクノロジー (ブラウザー JS エンジン) は向上していますが、まだ多くの制限があります。

  1. サーバー側のログ エンドポイントが必要になります。これには、悪用される可能性があるため、いくつかの複雑な点があります (つまり、PEN テスターが脆弱性を公開しようとする可能性があります)。ここでも CORS を処理する必要があります。これには明らかに Sentry をお勧めします。私たちはクラス最高であり、必要に応じてサーバーを自分で (オープン ソースとして) ホストすることもできます。
  2. コード内のエラーを実際にキャプチャする実装はかなり複雑です。window.onerrorさまざまな理由で信頼できません(ほとんどの場合、ブラウザは歴史的にここで悪い情報を提供するためです)。raven.jsクライアント (TraceKit ベース) で行うことは、いくつかの関数にパッチを適用して、それらを try/catch ステートメントでラップすることです。たとえば、window.setTimeout. これにより、ほとんどのブラウザーで完全なスタック トレースを生成するエラー ハンドラーをインストールできます。
  3. コードのソースマップを生成していること、およびデータを処理するサーバーがそれらをサポートしていることを確認する必要があります。Sentry は、(標準を介して) 自動的にスクレイピングするか、 APIを介してアップロードできるようにすることで、これを行います。これがなければ、コードを縮小していると仮定すると、物事はほとんど使用できなくなります。
  4. 最後の大きな問題はノイズです。ほとんどのブラウザー拡張機能はスクリプトに直接挿入されるため、ノイズをフィルター処理する必要があります。これを 2 つの方法で解決します。無視するパターンのブラックリスト (つまり、「スクリプト エラー」が最も役に立たない) と、受け入れるドメインのホワイトリスト (つまり、「example.com」) です。この 2 つの組み合わせは、ほとんどのランダム ノイズを除去するのに十分効果的であることがわかりました。

サーバー上で注意すべき点:

  • クライアントが開いたままになる場合があり (つまり、ボットや悪意のあるユーザー)、大量の役に立たないデータや単純な古いエラーが発生することがあります。
  • サーバーはこれらのイベントのカスケードを処理し、適切に失敗する必要があります。Sentry は、速度制限とデータのサンプリングによってこれを行います。
  • 例外はブラウザー言語にローカライズされており、集中データベースがなければ、自分で翻訳するのに行き詰まります (ただし、一般的に意味は明らかです)。
于 2015-06-25T01:26:48.143 に答える
2

簡単な実装を行いたい場合は、この人のjavascriptコードをアプリに配置するだけです。それ以外の場合、実装する場合は、これを試してスタックトレースをオンにしwindow error、を使用ajaxしてエラーを報告できます。olarkによって報告されたエラーを追跡するための良い方法

于 2012-06-29T07:12:24.193 に答える
2

http://exceptionhub.com トリックにすべきです。 http://errorception.com/ デバッグに関する情報はそれほど多くありませんが、良さそうです。

proxino は自分たちが何をしているのかわからないようです。前回チェックしたときにエラー イベントをログに記録するために、ロガー コードに完全な jQuery が含まれていました。JavaScript エラーをログに記録するクライアント側の JavaScript をほとんど把握していないサービスは信用できません。

于 2012-07-01T17:28:23.817 に答える
1

JsLog.meサービスの使用をお勧めします

エラーとスタックトレースに加えて、コンソール出力全体をキャプチャできます。プロジェクトで使用しています。コンソール ログ全体を記録すると、QA チームが問題の再現方法を記録するのに役立ちます。また、Chrome コンソールのような大きな JSON オブジェクトでもうまく機能し、検索機能もあります。

于 2014-11-25T16:31:56.477 に答える
0

Atatusは JavaScript エラーをキャプチャし、エラーの前のユーザー アクションもキャプチャします。これは、エラーをよりよく理解するのに役立ちます。Atatus は、エラーだけでなく、フロントエンドのパフォーマンスも監視するのに役立ちます (Real User Monitoring)

https://www.atatus.com/

免責事項: 私は Atatus の Web 開発者です。

于 2015-07-08T14:40:00.337 に答える