how to log react window.onError errors to file

Question

I am trying to make it possible to log errors, and save/log it to a file on the front end side.

I have a module that handles a window.onError method,

It is called myModule.onError() on the React side. From here if their is an error, it shows up in the console.log() like this

How would i go about logging this error into a file ?

I've tried bundling multiple logging libraries(like winston, buyan, log4js, etc) with my module, and im getting errors from fs is not found, to much more errors.

Here is my window on error method, what should i do so it would be possible to log the window.onError errors into a file. How would i bundle it within my module ?

function onError(){
    const data = {};
    return window.onerror = ( msg, url,lineNo,columnNo, error) => {
        let string = msg.toLowerCase();
        let substring = 'script error';
        if (string.indexOf(substring) > -1) {
            alert('Script Error: See Browser Console for Detail');
        } 
        else {
            let message = [
                'Message: ' + msg,
                'URL: ' + url,
                'Line: ' + lineNo,
                'Column: ' + columnNo,
                'Error object: ' + JSON.stringify(error)
            ].join(' - ');
            const messageObj = {
                Message: msg,
                URL: url,
                Line: lineNo,
                Column: columnNo,
                ErrorObject: JSON.stringify(error)
            };
            const messObj = JSON.stringify(messageObj)
            console.log(messObj);
            // ourLogger.log('info',messObj);
            // maybe call an axios post passing in the error
            // axios.post('/clinet-log',{messObj} )
            //     .then( res => {
            //         res
            //     })
            console.log(messageObj);
            return messObj;
        }

   };
}

export function onErrorMain(){
    let onErrorinit = onError();
    return onErrorinit;
}

Why do you want a file on the client device? It's possible but it's very unusual. — AJcodez
– AJcodez, Commented Jul 10, 2019 at 17:44

Medet Tleukabiluly · Accepted Answer · 2019-07-10 18:03:51Z

1

You cannot use fs module in browser, as it's a node library
All you can do is: send http request from browser to server, then save file on server side using fs

Pseudo code

/*
BE - BackEnd
FE - FrontEnd

BE: create backend api, something like http://examp.le/sendError
FE: override window.onError
FE: inside window.onError send request to backend
FE: jQuery.post('http://examp.le/sendError', { errorData: 'some error' })
BE: receive the data
BE: write to file and return result
FE: show result on page

*/

edited Jul 10, 2019 at 18:03

answered Jul 10, 2019 at 17:42

Medet Tleukabiluly

12k3 gold badges38 silver badges78 bronze badges

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

1 Comment

BARNOWL Over a year ago

can you show how this would be possible, with some pseudo code maybe.

Collectives™ on Stack Overflow

how to log react window.onError errors to file

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related