count console.log ऑब्जेक्ट्स

Question

नीचे दिया गया कोड कंसोल लॉग को पृष्ठ पर प्रिंट करता है।

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> 

Answer 1

तुम सिर्फ 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; 
} 

Answer 2

आपका प्रश्न पूरी तरह से मेरे लिए स्पष्ट नहीं है, लेकिन मैं क्या समझ से है कि आप प्रत्येक खुला 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; 
     }); 
} 

उपरोक्त उदाहरण ढांचे वास्तविक http अनुरोध प्रदर्शन करने के लिए के रूप में कोणीय का उपयोग करता है, लेकिन यह सिर्फ एक रूप में अच्छी तरह jQuery पर काम करेगा या कोई अन्य ढांचा।

Answer 3

आप PerformanceObserverentryTypes"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"] 
});