计算console.log对象

下面的代码将控制台日志打印到页面上。 它记录来自服务器的获取和响应，如：

14:15:17 GMT+0000 (GMT Standard Time) Submitting HTTP GET request to http...
14:15:22 GMT+0000 (GMT Standard Time) Received HTTP response: {..
14:15:17 GMT+0000 (GMT Standard Time) Submitting HTTP GET request to http...
14:15:22 GMT+0000 (GMT Standard Time) Received HTTP response: {..

我不想将这些显示在页面上，而是想要统计每个响应和请求，以便您看到从1开始到结束时的数字，可以是任何数字。 这是为了向用户显示发生的事情，而不会显示所有的响应和获取数据。

        function logHttpResponse(response) {
        var now = new Date();
        var logger = document.getElementById('log');
        var logMessage = now.toTimeString() + " Received HTTP response: " + JSON.stringify(response);
        console.log = function (logMessage) {
            if (typeof logMessage == 'object') {
                logger.innerHTML += (JSON && JSON.stringify ? JSON.stringify(logMessage) : String(logMessage)) + '<br />';
            } else {
                logger.innerHTML += logMessage + '<br />';
            }
        }
    }

和html：

<div id="log"></div>

---

如果您只是想重写console.log以打印响应计数，则应该这样做，但这会增加任何console.log调用的计数。

var logCount = 0

console.log = function (logMessage) {
    var logger = document.getElementById('log');
    logCount++;
    logger.innerHTML = logCount;
}

如果你想依靠回应而不是所有的控制台日志，使用类似这样的东西

var logCount = 0

function logHttpResponse(response) {
    var logger = document.getElementById('log');
    logCount++;
    logger.innerHTML = logCount;
}

---

你的问题对我来说并不完全清楚，但从我所了解的是你试图报告每个打开的http请求的状态。 我建议你用一个函数来包装你的请求，像这样计数：

var globalCounter = 1;
function performHttpRequest(requestUrl) {
    // Store a local copy of the counter for this request
    var currentCounter = globalCounter++;

    // Log to the user in whatever way you see fit
    // Could also for instance be with an array of status objects
    logger.innerHTML += 'now starting request ' + currentCounter + '</br>';

    // Perform the async request using the framework you prefer
    return $http.get(requestUrl)
        .then(function(result) {
            // When the async request finishes, update the log with the counter
            // we saved earlier
            logger.innerHTML += 'request ' + currentCounter + ' finished</br>';

            // Make sure to return the result of the action to the calling
            // function.
            return result;
        });
}

上面的例子使用Angular作为框架来执行实际的http请求，但它也只是在jQuery或任何其他框架上工作。

---

您可以使用PerformanceObserver并将entryTypes设置为"resource" 。 在回调函数PerformanceObserverEntryList第一个参数上调用.getEntries() ，使用for..of循环迭代条目对象。 在入口对象上调用.toJSON() ，将对象传递给Object.entries()以迭代嵌套的for..of循环内的当前入口对象的每个属性值。

const observer = new PerformanceObserver((list, obj) => {
  for (let entry of list.getEntries()) {
    for (let [key, prop] of Object.entries(entry.toJSON())) {
      logger.innerHTML += ` ${key}:${prop} `;
    }
  }
});

observer.observe({
  entryTypes: ["resource"]
});

链接地址: http://www.djcxy.com/p/94269.html

上一篇: Count console.log objects

下一篇: Why Would Dependencies Be Included Only In Release Builds?