10

I need to append these error in the log file on back-end. These error are not captured in angular2. How can read these error?Browser console snapshot

3
  • Possible duplicate: Capturing javascript console.log? Commented May 5, 2017 at 10:03
  • @abhishekkannojia They are overriding console.log but i don't have put console.log anywhere. What i want is on some interval i will read the full browser console then will push it to backend. Commented May 5, 2017 at 10:08
  • following post is a must-read because it point out the cross-browser issues related to window.onerror: Capture and report JavaScript errors with window.onerror Commented May 15, 2017 at 9:06

2 Answers 2

11
+25

As explained in this MDN article, you can catch Javascript runtime errors in a window.onerror event handler, and catch resource loading errors in a capturing event handler defined with window.addEventListener("error", fn, true).

A service could set these event handlers and record the errors in an array. You would send the content of the array to the server when you want. The service could look like this:

export class ErrorLogService {

    private errors = new Array<any>();

    constructor() {
        let that = this;
        window.onerror = function (msg, url, lineNo, columnNo, error) {
            let string = msg.toLowerCase();
            let substring = "script error";
            if (string.indexOf(substring) > -1) {
                console.log("Script Error: See Browser Console for Detail");
            } else {
                that.errors.push({
                    message: msg,
                    url: url,
                    line: lineNo,
                    column: columnNo,
                    error: error
                });
            }
            return false;
        };
        window.document.addEventListener("error", (event: ErrorEvent) => {
            if (event.target && (event.target as any).src) {
                let url = (event.target as any).src;
                this.errors.push({
                    message: "Resource not found",
                    url: url
                });
            } else {
                this.errors.push({
                    message: "Unknown error",
                    error: event
                });
            }
        }, true);
    }
}

The error detection mechanism can be tested in this jsfiddle.

Sign up to request clarification or add additional context in comments.

Comments

0

you can use the following code

(function(console){

console.save = function(data, filename){

if(!data) {
    console.error('Console.save: No data')
    return;
}

if(!filename) filename = 'console.json'

if(typeof data === "object"){
    data = JSON.stringify(data, undefined, 4)
}

var blob = new Blob([data], {type: 'text/json'}),
    e    = document.createEvent('MouseEvents'),
    a    = document.createElement('a')

a.download = filename
a.href = window.URL.createObjectURL(blob)
a.dataset.downloadurl =  ['text/json', a.download, a.href].join(':')
e.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, 
false, false, 0, null)
a.dispatchEvent(e)
}
})(console)

source : https://plus.google.com/u/0/+UmarHansa/posts/G3VZ9sG9SCH

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.