ChatGPT解决这个技术问题 Extra ChatGPT

抛出异常时如何获取 JavaScript 堆栈跟踪?

如果我自己抛出一个 JavaScript 异常(例如,throw "AArrggg"),我怎样才能获得堆栈跟踪(在 Firebug 或其他方式中)?现在我刚刚收到消息。

编辑:正如下面许多人发布的那样,可以获得 JavaScript 异常的堆栈跟踪,但我想获得我的异常的堆栈跟踪。例如:

function foo() {
    bar(2);
}
function bar(n) {
    if (n < 2)
        throw "Oh no! 'n' is too small!"
    bar(n-1);
}

调用 foo 时,我想获得一个堆栈跟踪,其中包括对 foobarbar 的调用。

自 2008 年以来,Firebug 错误跟踪器上的错误仍然存在:code.google.com/p/fbug/issues/detail?id=1260 - 给它加星标!
答案应该是“throw new Error('arrrgh');”看到这个写得很好的页面:devthought.com/2011/12/22/a-string-is-not-an-error
(2013) 您现在可以在 Firefox 上的 Firebug 中获取堆栈跟踪,即使它只是 throw 'arrrgh';,它们看起来与 throw new Error('arrrgh'); 相同。但是,Chrome 调试器仍然需要 throw new Error('arrrgh');(但 Chrome 似乎提供了更详细的跟踪)。
我建议更改标题以引用不是从 Error 派生的 custom 异常,因为这似乎是这个问题的主题。

S
Stan James

编辑 2(2017 年):

在所有现代浏览器中,您只需调用:console.trace(); (MDN Reference)

编辑 1 (2013):

如原始问题的评论中所指出的,一个更好(更简单)的解决方案是使用 Error 对象的 stack 属性,如下所示:

function stackTrace() {
    var err = new Error();
    return err.stack;
}

这将生成如下输出:

DBX.Utils.stackTrace@http://localhost:49573/assets/js/scripts.js:44
DBX.Console.Debug@http://localhost:49573/assets/js/scripts.js:9
.success@http://localhost:49573/:462
x.Callbacks/c@http://localhost:49573/assets/js/jquery-1.10.2.min.js:4
x.Callbacks/p.fireWith@http://localhost:49573/assets/js/jquery-1.10.2.min.js:4
k@http://localhost:49573/assets/js/jquery-1.10.2.min.js:6
.send/r@http://localhost:49573/assets/js/jquery-1.10.2.min.js:6

给出调用函数的名称以及 URL、它的调用函数等。

原件(2009 年):

this snippet 的修改版本可能会有所帮助:

function stacktrace() { 
  function st2(f) {
    return !f ? [] : 
        st2(f.caller).concat([f.toString().split('(')[0].substring(9) + '(' + f.arguments.join(',') + ')']);
  }
  return st2(arguments.callee.caller);
}

我不确定为什么没有更多的投票 - 其他答案对我来说效果不佳。顺便说一句,请确保不要将参数视为数组(此处更新片段:gist.github.com/965603
不能在 chrome 中工作,tacktrace():[异常:TypeError:Object # 没有方法
查看对原始问题的评论:您不需要自定义代码,只需使用“throw new Error('arrrgh')”
Error.stack 在 IE 中未定义,仅适用于 chrome 和 Mozilla firefox
请注意,现在不推荐使用 caller,并且从 ES5 严格模式中删除了 callee。这就是为什么stackoverflow.com/questions/103598/…
L
Lee Goddard

Chrome/Chromium 和其他使用 V8 的浏览器以及 Firefox 具有方便的界面,可通过 Error 对象的 stack 属性获取堆栈跟踪:

    try {
        // Code throwing an exception
        throw new Error();
    } catch(e) {
        console.log(e.stack);
    }

请参阅 V8 documentation 中的详细信息


Firefox 也支持 .stack 属性。
您也可以使用 console.error(e.stack);,使其看起来像默认异常消息
此问题专门询问Error 派生并因此不具有 stack 属性的异常。
J
Justin L.

在 Firefox 中,您似乎不需要抛出异常。做就够了

e = new Error();
console.log(e.stack);

也适用于移动应用程序(使用 JQM 构建)。
也可以在 Chromium 中使用(无论如何都是版本 43)。
在 Firefox 59 中,这在通过 window.onerror 调用时不起作用,它显示一个几乎为空的堆栈,只有 onerror 函数。
更好的是,你可以这样做:console.log(new Error().stack) >:( >:( >:(
这将在创建 Error 对象的位置记录堆栈,而不是在引发原始异常的位置。
B
Boann

如果您有 firebug,则脚本选项卡中的所有错误选项都会中断。脚本到达断点后,您可以查看 firebug 的堆栈窗口:

https://i.stack.imgur.com/XA8Bf.png


嗯,这似乎不起作用。它会阻止我在调试器中处理 Javascript 引发的错误(例如,未定义的变量错误),但是当我抛出自己的异常时,除了“未捕获的异常”消息之外,我什么也得不到。
G
Gabriel Nahmias

如原始问题的评论中所指出的,一个好的(且简单的)解决方案是使用 Error 对象的 stack 属性,如下所示:

function stackTrace() {
    var err = new Error();
    return err.stack;
}

这将生成如下输出:

DBX.Utils.stackTrace@http://localhost:49573/assets/js/scripts.js:44
DBX.Console.Debug@http://localhost:49573/assets/js/scripts.js:9
.success@http://localhost:49573/:462
x.Callbacks/c@http://localhost:49573/assets/js/jquery-1.10.2.min.js:4
x.Callbacks/p.fireWith@http://localhost:49573/assets/js/jquery-1.10.2.min.js:4
k@http://localhost:49573/assets/js/jquery-1.10.2.min.js:6
.send/r@http://localhost:49573/assets/js/jquery-1.10.2.min.js:6

给出调用函数的名称以及 URL 和行号、它的调用函数等。

我有一个非常精细和漂亮的解决方案,我为我目前正在从事的项目设计了它,并且我已经提取并重新设计了它以进行概括。这里是:

(function(context){
    // Only global namespace.
    var Console = {
        //Settings
        settings: {
            debug: {
                alwaysShowURL: false,
                enabled: true,
                showInfo: true
            },
            stackTrace: {
                enabled: true,
                collapsed: true,
                ignoreDebugFuncs: true,
                spacing: false
            }
        }
    };

    // String formatting prototype function.
    if (!String.prototype.format) {
        String.prototype.format = function () {
            var s = this.toString(),
                args = typeof arguments[0],
                args = (("string" == args || "number" == args) ? arguments : arguments[0]);
            if (!arguments.length)
                return s;
            for (arg in args)
                s = s.replace(RegExp("\\{" + arg + "\\}", "gi"), args[arg]);
            return s;
        }
    }

    // String repeating prototype function.
    if (!String.prototype.times) {
        String.prototype.times = function () {
            var s = this.toString(),
                tempStr = "",
                times = arguments[0];
            if (!arguments.length)
                return s;
            for (var i = 0; i < times; i++)
                tempStr += s;
            return tempStr;
        }
    }

    // Commonly used functions
    Console.debug = function () {
        if (Console.settings.debug.enabled) {
            var args = ((typeof arguments !== 'undefined') ? Array.prototype.slice.call(arguments, 0) : []),
                sUA = navigator.userAgent,
                currentBrowser = {
                    firefox: /firefox/gi.test(sUA),
                    webkit: /webkit/gi.test(sUA),
                },
                aLines = Console.stackTrace().split("\n"),
                aCurrentLine,
                iCurrIndex = ((currentBrowser.webkit) ? 3 : 2),
                sCssBlack = "color:black;",
                sCssFormat = "color:{0}; font-weight:bold;",
                sLines = "";

            if (currentBrowser.firefox)
                aCurrentLine = aLines[iCurrIndex].replace(/(.*):/, "$1@").split("@");
            else if (currentBrowser.webkit)
                aCurrentLine = aLines[iCurrIndex].replace("at ", "").replace(")", "").replace(/( \()/gi, "@").replace(/(.*):(\d*):(\d*)/, "$1@$2@$3").split("@");

            // Show info if the setting is true and there's no extra trace (would be kind of pointless).
            if (Console.settings.debug.showInfo && !Console.settings.stackTrace.enabled) {
                var sFunc = aCurrentLine[0].trim(),
                    sURL = aCurrentLine[1].trim(),
                    sURL = ((!Console.settings.debug.alwaysShowURL && context.location.href == sURL) ? "this page" : sURL),
                    sLine = aCurrentLine[2].trim(),
                    sCol;

                if (currentBrowser.webkit)
                    sCol = aCurrentLine[3].trim();

                console.info("%cOn line %c{0}%c{1}%c{2}%c of %c{3}%c inside the %c{4}%c function:".format(sLine, ((currentBrowser.webkit) ? ", column " : ""), ((currentBrowser.webkit) ? sCol : ""), sURL, sFunc),
                             sCssBlack, sCssFormat.format("red"),
                             sCssBlack, sCssFormat.format("purple"),
                             sCssBlack, sCssFormat.format("green"),
                             sCssBlack, sCssFormat.format("blue"),
                             sCssBlack);
            }

            // If the setting permits, get rid of the two obvious debug functions (Console.debug and Console.stackTrace).
            if (Console.settings.stackTrace.ignoreDebugFuncs) {
                // In WebKit (Chrome at least), there's an extra line at the top that says "Error" so adjust for this.
                if (currentBrowser.webkit)
                    aLines.shift();
                aLines.shift();
                aLines.shift();
            }

            sLines = aLines.join(((Console.settings.stackTrace.spacing) ? "\n\n" : "\n")).trim();

            trace = typeof trace !== 'undefined' ? trace : true;
            if (typeof console !== "undefined") {
                for (var arg in args)
                    console.debug(args[arg]);

                if (Console.settings.stackTrace.enabled) {
                    var sCss = "color:red; font-weight: bold;",
                        sTitle = "%c Stack Trace" + " ".times(70);

                    if (Console.settings.stackTrace.collapsed)
                        console.groupCollapsed(sTitle, sCss);
                    else
                        console.group(sTitle, sCss);

                    console.debug("%c" + sLines, "color: #666666; font-style: italic;");

                    console.groupEnd();
                }
            }
        }
    }
    Console.stackTrace = function () {
        var err = new Error();
        return err.stack;
    }

    context.Console = Console;
})(window);

GitHub(当前为 v1.2)上查看!您可以像 Console.debug("Whatever"); 一样使用它,它会根据 Console 中的设置打印输出和堆栈跟踪(或只是简单的信息/根本没有额外的东西)。这是一个例子:

https://i.stack.imgur.com/HfgLP.png

确保使用 Console 对象中的设置!您可以在轨迹线之间添加间距并将其完全关闭。此处将 Console.trace 设置为 false

https://i.stack.imgur.com/6310K.png

您甚至可以关闭显示的第一个信息(将 Console.settings.debug.showInfo 设置为 false)或完全禁用调试(将 Console.settings.debug.enabled 设置为 false),这样您就不必再注释掉调试语句了!把它们留在里面,这将无济于事。


M
Mark Biek

我不认为有任何内置的东西可以使用,但是我确实找到了很多人自己滚动的例子。

DIY javascript 堆栈跟踪

任何浏览器中的 Javascript 堆栈跟踪


啊,谢谢——那里的第一个链接似乎可以做到(尽管缺乏递归支持可能使其无法使用)。
是的,乍一看,我没有看到任何支持递归的东西。我很想知道是否有一个好的解决方案。
我认为第二个链接应该支持 Firefox 和 Opera 的递归,因为它使用错误堆栈跟踪,而不是使用 arguments 变量手动构建一个。我很想听听您是否找到递归问题的跨浏览器解决方案(第一篇文章是我的)。 :)
Helephant:第二个在这里不起作用,因为当我捕捉到异常时,它是一个“字符串”(即,没有“e.stack”): foo = function(){ throw "Arg"; } 尝试 { foo(); } catch (e) { /* typeof e == "string" */ } 也许我错了? (开始强制性地抱怨 Javascript 教程有多愚蠢……)
尝试抛出一个对象:throw { name: 'NameOfException', message: 'He's dead, Jim' }
E
Eli Grey

您可以访问 Error 实例的 stack(Opera 中的 stacktrace)属性,即使您将其扔掉。问题是,您需要确保使用 throw new Error(string)(不要忘记 new 而不是 throw string

例子:

try {
    0++;
} catch (e) {
    var myStackTrace = e.stack || e.stacktrace || "";
}

stacktrace 在 Opera 中不起作用。我什至找不到关于它的东西。
@NV:似乎堆栈跟踪不在用户创建的错误上,所以你应该这样做:尝试 { 0++ } catch(e) { myStackTrace=e.stack || e.stacktrace }
D
David Wolever

使用 Chrome 浏览器,您可以使用 console.trace 方法:https://developer.chrome.com/devtools/docs/console-api#consoletraceobject


K
Konstantin Smolyanin

这将为现代 Chrome、Opera、Firefox 和 IE10+ 提供堆栈跟踪(作为字符串数组)

function getStackTrace () {

  var stack;

  try {
    throw new Error('');
  }
  catch (error) {
    stack = error.stack || '';
  }

  stack = stack.split('\n').map(function (line) { return line.trim(); });
  return stack.splice(stack[0] == 'Error' ? 2 : 1);
}

用法:

console.log(getStackTrace().join('\n'));

它从堆栈中排除了它自己的调用以及 Chrome 和 Firefox(但不是 IE)使用的标题“错误”。

它不应该在旧浏览器上崩溃,而只是返回空数组。如果您需要更通用的解决方案,请查看 stacktrace.js。它支持的浏览器列表确实令人印象深刻,但在我看来,它对于它的小任务来说非常大:37Kb 的缩小文本,包括所有依赖项。


P
Patrick Seymour

尤金回答的更新:必须抛出错误对象才能让 IE(特定版本?)填充 stack 属性。以下应该比他当前的示例更好,并且应该避免在 IE 中返回 undefined

function stackTrace() {
  try {
    var err = new Error();
    throw err;
  } catch (err) {
    return err.stack;
  }
}

注意 1:这种事情应该只在调试时进行,并且在上线时禁用,尤其是在频繁调用的情况下。注意 2:这可能不适用于所有浏览器,但似乎适用于 FF 和 IE 11,非常适合我的需求。


M
Miller Medeiros

在 Firebug 上获取真正的堆栈跟踪的一种方法是创建一个真正的错误,例如调用未定义的函数:

function foo(b){
  if (typeof b !== 'string'){
    // undefined Error type to get the call stack
    throw new ChuckNorrisError("Chuck Norris catches you.");
  }
}

function bar(a){
  foo(a);
}

foo(123);

或者使用 console.error() 后跟 throw 语句,因为 console.error() 显示堆栈跟踪。


P
Petr Varyagin

这个 polyfill 代码在现代(2017)浏览器(IE11、Opera、Chrome、FireFox、Yandex)中工作:

printStackTrace: function () {
    var err = new Error();
    var stack = err.stack || /*old opera*/ err.stacktrace || ( /*IE11*/ console.trace ? console.trace() : "no stack info");
    return stack;
}

其他答案:

function stackTrace() {
  var err = new Error();
  return err.stack;
}

不能在 IE 11 中工作!

使用 arguments.callee.caller - 在任何浏览器中都不能在严格模式下工作!


R
Rabih Kodeih

在 Google Chrome(版本 19.0 及更高版本)中,只需抛出异常即可完美运行。例如:

/* file: code.js, line numbers shown */

188: function fa() {
189:    console.log('executing fa...');
190:    fb();
191: }
192:
193: function fb() {
194:    console.log('executing fb...');
195:    fc()
196: }
197:
198: function fc() {
199:    console.log('executing fc...');
200:    throw 'error in fc...'
201: }
202:
203: fa();

将在浏览器的控制台输出中显示堆栈跟踪:

executing fa...                         code.js:189
executing fb...                         code.js:194
executing fc...                         cdoe.js:199
/* this is your stack trace */
Uncaught error in fc...                 code.js:200
    fc                                  code.js:200
    fb                                  code.js:195
    fa                                  code.js:190
    (anonymous function)                code.js:203

希望这有帮助。


J
JaskeyLam

功能:

function print_call_stack(err) {
    var stack = err.stack;
    console.error(stack);
}

用例:

     try{
         aaa.bbb;//error throw here
     }
     catch (err){
         print_call_stack(err); 
     }

T
Thomas Bormans
<script type="text/javascript"
src="https://rawgithub.com/stacktracejs/stacktrace.js/master/stacktrace.js"></script>
<script type="text/javascript">
    try {
        // error producing code
    } catch(e) {
        var trace = printStackTrace({e: e});
        alert('Error!\n' + 'Message: ' + e.message + '\nStack trace:\n' + trace.join('\n'));
        // do something else with error
    }
</script>

此脚本将显示错误


D
Denis Orlov
function stacktrace(){
  return (new Error()).stack.split('\n').reverse().slice(0,-2).reverse().join('\n');
}

虽然此代码可能会回答问题,但提供有关它如何和/或为什么解决问题的额外上下文将提高答案的长期价值。
C
CodeToLife

至少在 Edge 2021 中:

console.groupCollapsed('jjjjjjjjjjjjjjjjj')
    console.trace()
    try {
        throw "kuku"
    } catch(e) {
        console.log(e.stack)
    }
console.groupEnd()
traceUntillMe()

你完了,我的朋友


u
unsynchronized

有点晚了,但是,这是另一个解决方案,它自动检测 arguments.callee 是否可用,如果没有,则使用 new Error().stack。在 chrome、safari 和 firefox 中测试。

2 个变体 - stackFN(n) 为您提供远离直接调用者的函数 n 的名称,而 stackArray() 为您提供一个数组,stackArray()[0] 是直接调用者。

http://jsfiddle.net/qcP9y/6/ 试用

// returns the name of the function at caller-N
// stackFN()  = the immediate caller to stackFN
// stackFN(0) = the immediate caller to stackFN
// stackFN(1) = the caller to stackFN's caller
// stackFN(2) = and so on
// eg console.log(stackFN(),JSON.stringify(arguments),"called by",stackFN(1),"returns",retval);
function stackFN(n) {
    var r = n ? n : 0, f = arguments.callee,avail=typeof f === "function",
        s2,s = avail ? false : new Error().stack;
    if (s) {
        var tl=function(x) { s = s.substr(s.indexOf(x) + x.length);},
        tr = function (x) {s = s.substr(0, s.indexOf(x) - x.length);};
        while (r-- >= 0) {
            tl(")");
        }
        tl(" at ");
        tr("(");
        return s;
    } else {
        if (!avail) return null;
        s = "f = arguments.callee"
        while (r>=0) {
            s+=".caller";
            r--;   
        }
        eval(s);
        return f.toString().split("(")[0].trim().split(" ")[1];
    }
}
// same as stackFN() but returns an array so you can work iterate or whatever.
function stackArray() {
    var res=[],f = arguments.callee,avail=typeof f === "function",
        s2,s = avail ? false : new Error().stack;
    if (s) {
        var tl=function(x) { s = s.substr(s.indexOf(x) + x.length);},
        tr = function (x) {s = s.substr(0, s.indexOf(x) - x.length);};
        while (s.indexOf(")")>=0) {
            tl(")");
            s2= ""+s;
            tl(" at ");
            tr("(");
            res.push(s);
            s=""+s2;
        }
    } else {
        if (!avail) return null;
        s = "f = arguments.callee.caller"
        eval(s);
        while (f) {
            res.push(f.toString().split("(")[0].trim().split(" ")[1]);
            s+=".caller";
            eval(s);
        }
    }
    return res;
}


function apple_makes_stuff() {
    var retval = "iPhones";
    var stk = stackArray();

    console.log("function ",stk[0]+"() was called by",stk[1]+"()");
    console.log(stk);
    console.log(stackFN(),JSON.stringify(arguments),"called by",stackFN(1),"returns",retval);
    return retval;
}



function apple_makes (){
    return apple_makes_stuff("really nice stuff");
}

function apple () {
    return apple_makes();
}

   apple();

D
Doua Beri

您可以使用此库 http://www.stacktracejs.com/ 。这很好

从文档

您还可以传入自己的错误以获取 IE 或 Safari 5 中不可用的堆栈跟踪

<script type="text/javascript" src="https://rawgithub.com/stacktracejs/stacktrace.js/master/stacktrace.js"></script>
<script type="text/javascript">
    try {
        // error producing code
    } catch(e) {
        var trace = printStackTrace({e: e});
        alert('Error!\n' + 'Message: ' + e.message + '\nStack trace:\n' + trace.join('\n'));
        // do something else with error
    }
</script>

链接源 https://rawgithub.com/stacktracejs/stacktrace.js/master/stacktrace.js 是旧版本,最新的稳定版本(与代码片段匹配)在这里:https://raw.githubusercontent.com/stacktracejs/stacktrace.js/stable/stacktrace.js
J
Jack G

这是一个可以为您提供最大性能(IE 6+)和最大兼容性的答案。兼容IE 6!

函数堆栈跟踪(log_result){ var trace_result; // IE 6 到 9 的兼容性 // 这不是一个全面的解决方案,因为 // 参数的被调用者属性已被弃用 /*@cc_on // 这些花哨的条件使此代码仅在 IE 中运行 trace_result = (function st2(fTmp ) { // 这部分代码归功于 Eugene return !fTmp ? [] : st2(fTmp.caller).concat([fTmp.toString().split('(')[0].substring(9) + '(' + fTmp.arguments.join(',') + ')']); })(arguments.callee.caller); if (log_result) // 古老的控制台登录方式 Debug.write( trace_result ); return trace_result; @*/ console = console || Console; // 以防万一 if (!(console && console.trace) || !log_result){ // 为了在 IE 10 中获得更好的性能 var STerror=new Error (); var unformated=(STerror.stack || STerror.stacktrace); trace_result = "\u25BC console.trace" + unformated.substring(unformated.indexOf('\n',unformated.indexOf('\n')) ); } else { // IE 11+ 和其他所有人的兼容性 trace_result = console.trace(); } if (log_result) console.log( trace_result ) ;返回跟踪结果; } // 测试代码 (function testfunc(){ document.write( "

" + stacktrace( false ) + "
" ); })();


A
Anthony Zhan

试试看嘛

throw new Error('some error here')

这对 chrome 非常有效:

https://i.stack.imgur.com/6rQ5m.png


e
eyelidlessness

在 Firefox 上比在 IE 上更容易获得堆栈跟踪,但基本上这是您想要做的:

将“有问题的”代码段包装在 try/catch 块中:

try {
    // some code that doesn't work
    var t = null;
    var n = t.not_a_value;
}
    catch(e) {
}

如果您要检查“错误”对象的内容,它包含以下字段:

e.fileName :问题来自的源文件/页面 e.lineNumber :出现问题的文件/页面中的行号 e.message :描述发生什么类型的错误的简单消息 e.name :类型发生的错误,在上面的示例中应该是 'TypeError' e.stack :包含导致异常的堆栈跟踪

我希望这能够帮到你。


错误的。他正试图捕捉他的 OWN 异常。如果他抛出“asdfg”,他将得到字符串对象,而不是异常对象。他并没有试图捕捉内置异常。
k
kirilv

我不得不用 IE11 研究 smartgwt 中的无限递归,所以为了更深入地研究,我需要一个堆栈跟踪。问题是,我无法使用开发控制台,因为那样复制更加困难。在 javascript 方法中使用以下内容:

try{ null.toString(); } catch(e) { alert(e.stack); }

警报((新错误())。堆栈);
S
Simon_Weaver

哇 - 我在 6 年内没有看到一个人建议我们在使用之前先检查 stack 是否可用!您在错误处理程序中可以做的最糟糕的事情是因为调用不存在的东西而引发错误。

正如其他人所说,虽然 stack 现在可以安全使用,但 IE9 或更早版本不支持它。

我记录了我的意外错误,堆栈跟踪非常重要。为了获得最大支持,我首先检查 Error.prototype.stack 是否存在并且是一个函数。如果是这样,那么使用 error.stack 是安全的。

        window.onerror = function (message: string, filename?: string, line?: number, 
                                   col?: number, error?: Error)
        {
            // always wrap error handling in a try catch
            try 
            {
                // get the stack trace, and if not supported make our own the best we can
                var msg = (typeof Error.prototype.stack == 'function') ? error.stack : 
                          "NO-STACK " + filename + ' ' + line + ':' + col + ' + message;

                // log errors here or whatever you're planning on doing
                alert(msg);
            }
            catch (err)
            {

            }
        };

编辑:看来,由于 stack 是一个属性而不是一个方法,因此即使在较旧的浏览器上也可以安全地调用它。我仍然很困惑,因为我很确定之前检查 Error.prototype 对我有用,但现在却不行 - 所以我不确定发生了什么。


C
Christophe Roussy

使用 console.error(e.stack) Firefox 仅在日志中显示堆栈跟踪,Chrome 也会显示该消息。如果消息包含重要信息,这可能是一个糟糕的惊喜。始终记录两者。