How to fetch get all console log , error , warning in text file if i click i a button

Question

I have a project which produces some warning, logs, error if anything goes wrong so I want to give the user a button where they can click and download console.log and save in text file. I can use extension I want to do in JavaScript and jQuery any of these ways.

I want to get all this in a text file

score 2 · Answer 1 · answered Mar 29 '19 at 09:37

2

You could create replacements for console.log, console.error, etc. and append the messages in a variable:

var log = "";
var myConsole = {};
myConsole.log = function(txt) {
  log += txt + "\n";
  console.log(txt);
}

Then you can create a downlodable file whose content is the log variable. Check Create a file in memory for user to download, not through server for different ideas of how to do this.

answered Mar 29 '19 at 09:37

ordago

377
3
20

bt their are multiple files . should i have to do this in complete application and also i have api code which i can't modify , i have to fetch the current console data – app_dev Mar 29 '19 at 09:49

score 2 · Answer 2 · answered Mar 29 '19 at 09:56

two steps are required to answer your question:

read console.log output into a variable
saving the variable to a text file

step 1 - listen console logging events

it can by done by replacing the console object with self-made interface:

var consoleText = ""
// define a new console
window.console = (function(console){
    return {
        log: function(text){
            console.log(text);
            consoleText += text;
        },
        info: function (text) {
            console.info(text);
            consoleText += text;
        },
        warn: function (text) {
            console.warn(text);
            consoleText += text;
        },
        error: function (text) {
            console.error(text);
            consoleText += text;
        }
    };
}(window.console));

and for unhandled exceptions:

window.addEventListener('error', function(event) {
    consoleText += event.message;
})

step 2 - save the log file

based on DevonTaig answer in Writing html form data to a txt file without the use of a webserver:

function download(filename, text) {
  var pom = document.createElement('a');
  pom.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
  pom.setAttribute('download', filename);
  document.body.appendChild(pom);
  pom.click();
  document.body.removeChild(pom);
}

download("log.txt", consoleText)

should i create separate js file for step 1 and add it main.js — app_dev, Mar 29 '19 at 11:46
it's not necessary, but I strongly recommend separating it to a file separate from your main program — noam gaash, Mar 29 '19 at 14:45

Code Korenge · Answer 3 · 2019-03-29T10:38:54.480

Found out there is library written by someone here.

Added some code to demo:

<html>
    <script type="text/javascript" src="./FileSaver.js"></script>
<body>
<h1>Log download</h1>
<script>
    // Store logs in memory for writing to file ater.
    let logList = [];

    function downloadLogs() {
    var blob = new Blob([logList.toString()], {type: "text/plain;charset=utf-8"});
    saveAs(blob, "logFile.log");
    }

    function createLogMessage(){
        logList.push('log message....');
    }
</script>
    <button type="button" onclick="downloadLogs()">Create Log!</button>
    <button type="button" onclick="createLogMessage()">Write Log!</button>
</body>
</html>

How to fetch get all console log , error , warning in text file if i click i a button

3 Answers3

step 1 - listen console logging events

step 2 - save the log file