'Rendering terminal output in the browser

I have a file with a bunch of terminal logs captured with the screen utility. Here's a snippet:

[A[0m[27m[24m[J[34m~[39m


(base) [38;5;242mbase[39m [35m❯[39m ]133;B[K[?1l>[?2004l

[A[0m[27m[24m[J[34m~[39m

etc etc etc.

The output is full of ANSI escape codes, \r, \n, etc. Yet my terminal manages to render it all quite nicely, and I imagine I ought to be able to as well. I have found some libraries that convert ANSI codes to HTML, but I don't think they handle any of the other escaping.

I still feel like someone must have solved this problem, somehow, before me. Is there an easy way to do this?

htmlbashloggingterminalansi


Solution 1:[1]

There're many nice answers at an old SE post Depending on your environment, you may find some other packages to

Solution 2:[2]

I have a bookmarklet using such library made for Rancher.

You can find that library inside :-)

javascript:var oReq = new XMLHttpRequest();oReq.open("GET", "https://raw.githubusercontent.com/drudru/ansi_up/master/ansi_up.js", true);oReq.onloadend = function (oEvent) {new Function(oReq.responseText)();var el=document.getElementsByTagName("PRE")[0];el.innerHTML=(new AnsiUp).ansi_to_html(el.innerText);};oReq.send();document.body.style="color:white;background-color:black";undefined

For humans also readable version ;-)

javascript:var oReq = new XMLHttpRequest();
oReq.open("GET", "https://raw.githubusercontent.com/drudru/ansi_up/master/ansi_up.js", true);
oReq.onloadend = function (oEvent) {
    new Function(oReq.responseText)();
    var el = document.getElementsByTagName("PRE")[0];
    el.innerHTML = (new AnsiUp).ansi_to_html(el.innerText);
};
oReq.send();
document.body.style = "color:white;background-color:black";
undefined

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 gildux
Solution 2

Related Questions