Có cách nào trong JavaScript để nghe sự kiện giao diện điều khiển không?

Question

Tôi đang cố viết trình xử lý cho các trường hợp ngoại lệ và cảnh báo trình duyệt trong javascript. Tất cả các lỗi và cảnh báo phải được gửi đến máy chủ để xem xét sau.

ngoại lệ Handled thể được đánh bắt và dễ dàng đăng nhập với

console.error("Error: ..."); 

hoặc

console.warn("Warning: ..."); 

Vì vậy, họ không phải là vấn đề nếu chúng được gọi là từ mã javascript, thậm chí nhiều trường hợp ngoại lệ unhandled có thể được bắt gặp với mã hòa bình này:

window.onerror = function(){ 
    // add to errors Stack trace etc. 
    }); 
} 

vì vậy ngoại lệ là cov đẹp ered nhưng tôi đã bị mắc kẹt với cảnh báo mà trình duyệt gửi đến giao diện điều khiển. Ví dụ cảnh báo xác thực bảo mật hoặc html. Ví dụ dưới đây được lấy từ google chrome console

Trang tại https://domainname.com/ chạy nội dung không an toàn từ http://domainname.com/javascripts/codex/MANIFEST.js.

Sẽ rất tuyệt nếu có một số sự kiện như window.onerror nhưng đối với cảnh báo. Có suy nghĩ gì không?

Answer 1

Bạn chỉ có thể tự mình quấn các phương pháp console. Ví dụ: để ghi lại từng cuộc gọi trong một mảng:

var logOfConsole = []; 

var _log = console.log, 
    _warn = console.warn, 
    _error = console.error; 

console.log = function() { 
    logOfConsole.push({method: 'log', arguments: arguments}); 
    return _log.apply(console, arguments); 
}; 

console.warn = function() { 
    logOfConsole.push({method: 'warn', arguments: arguments}); 
    return _warn.apply(console, arguments); 
}; 

console.error = function() { 
    logOfConsole.push({method: 'error', arguments: arguments}); 
    return _error.apply(console, arguments); 
}; 

Answer 2

Trong cùng một chức năng mà bạn đang sử dụng để thực hiện console.log(), chỉ cần đăng cùng một thông điệp tới dịch vụ web bạn đang ghi nhật ký .

Answer 3

Bạn sẽ thực hiện việc này về phía sau. Thay vì chặn khi một lỗi được đăng nhập, kích hoạt một sự kiện như là một phần của cơ chế xử lý lỗi và đăng nhập nó như là một trong những người nghe sự kiện:

try 
{ 
    //might throw an exception 
    foo(); 
} 
catch (e) 
{ 
    $(document).trigger('customerror', e); 
} 

function customErrorHandler(event, ex) 
{ 
    console.error(ex) 
} 
function customErrorHandler2(event, ex) 
{ 
    $.post(url, ex); 
} 

_{mã này sử dụng jQuery và là quá đơn giản hóa chặt chẽ để sử dụng như một ví dụ .}

Answer 4

Way More succint:

// this method will proxy your custom method with the original one 
 
function proxy(context, method, message) { 
 
    return function() { 
 
    method.apply(context, [message].concat(Array.prototype.slice.apply(arguments))) 
 
    } 
 
} 
 

 
// let's do the actual proxying over originals 
 
console.log = proxy(console, console.log, 'Log:') 
 
console.error = proxy(console, console.error, 'Error:') 
 
console.warn = proxy(console, console.warn, 'Warning:') 
 

 
// let's test 
 
console.log('im from console.log', 1, 2, 3); 
 
console.error('im from console.error', 1, 2, 3); 
 
console.warn('im from console.warn', 1, 2, 3);

Answer 5

Tôi biết đó là một bài cũ nhưng nó có thể hữu ích anyway như giải pháp khác không tương thích với các trình duyệt cũ.

Bạn có thể xác định lại hành vi của mỗi chức năng của giao diện điều khiển (và cho tất cả các trình duyệt) như thế này:

// define a new console 
var console = (function(oldCons){ 
    return { 
     log: function(text){ 
      oldCons.log(text); 
      // Your code 
     }, 
     info: function (text) { 
      oldCons.info(text); 
      // Your code 
     }, 
     warn: function (text) { 
      oldCons.warn(text); 
      // Your code 
     }, 
     error: function (text) { 
      oldCons.error(text); 
      // Your code 
     } 
    }; 
}(window.console)); 

//Then redefine the old console 
window.console = console;