微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

ansiparser 前端组件

程序名称:ansiparser

授权协议: MIT

操作系统: 跨平台

开发语言: HTML/CSS

ansiparser 介绍

ansiparser是一个前端组件,用于将linux终端输出彩色日志展示到web页面。它通过解析linux终端的ansi转义字符实现彩色渲染,其渲染效果如下图。

screenshot

安装

npm install xlog-ansiparser --save

使用

<!DOCTYPE html>
<html lang="en">
<head>
    <Meta charset="UTF-8">
    <title>Title</title>
    <script src="./node_modules/jquery/dist/jquery.js"></script>
    <script src="./dist/xlog-1.0.0.js"></script>
    <link rel="stylesheet" href="./xlog.css">
    <style>
        body{
            margin: 0;
        }
    </style>
</head>
<body>
<pre id="xlog" class="dark">
</pre>
</body>
<script>
    var container = document.getElementById("xlog")
    var lexer = new XLog(container)

    $(document).ready(function (e) {
        $.ajax({
            method: "GET",
            url: "https://api.travis-ci.org/v3/job/31095019/log.txt",
            success: function (data) {
                let segs = data.split("\n");
                segs.forEach((v, i) => {
                    setTimeout(() => {
                        let substr = v;
                        if (segs.length !== i + 1) {
                            substr = substr + "\n"
                        }
                        lexer.write(substr)
                    }, 0)
                })
            }
        })
    });
</script>
</html>

源码仓库

https://github.com/duguying/ansiparser

ansiparser 官网

https://github.com/duguying/ansiparser

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐