celery+redis发送异步请求，使用paramiko进行远程调用执行自动化脚本，执行过程中生成日志，需要动态读取内容显示到页面中，方便查看脚本的执行情况。
  ![image.png](https://upload-images.jianshu.io/upload_images/14459419-abc28f0305d16b61.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

image.png

html文件中相关代码：

...
                <td>
                    {% if  task.status == 1 or task.status == 3 %}
                        <a id="{{ task.id }}" href="javascript:void(0)"
                           onclick="showLogModel('{{ task.id }}')">
                            <img src="/static/svg/log.svg">查看日志
                        </a>
                    {% elif  task.status == 2 %}
                        <a id="showLogModel" href="javascript:void(0)"
                           onclick="showLogModel('{{ task.id }}')">
                            <img src="/static/svg/log.svg">查看日志
                        </a>
                        <a id='showReportModel' href="javascript:void(0)"
                           onclick="showReportModel('{{ task.id }}')">
                            <img src="/static/svg/report.svg">查看报告
                        </a>
                    {% else %}
                        暂无操作
                    {% endif %}
                </td>
...
<!--日志展示-->
<div class="modal fade" id="LogModel" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" style="max-width:1200px;">
        <div class="modal-content">
            <div class="modal-header">
                <h3 class="modal-title" id="myModalLabel">
                    <p style="font-size: medium">日志详情</p>
                </h3>
            </div>
            <div class="modal-body">
                <form role="form" method='POST' action="/auto/ui/re_ui/">
                    <div class="form-group" style="display: none">
                        <label for="id">id</label>
                        <input id="task_id_show" type="text" class=" form-control" name="task_id">
                    </div>
                    <div class="form-group">
                        <textarea id="log_text" rows="18" cols="50" type="text" class="form-control" name="log_text"
                                  placeholder="" spellcheck="false" >
                        </textarea>
                    </div>
                    <div class="modal-footer">
                        <button type="submit" class="btn layui-btn" onclick="closeLog()">
                            关闭
                        </button>
                    </div>
                    {% csrf_token %}
                </form>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
...

js部分：

   function getCookie(name) {
        var cookieValue = null;
        if (document.cookie && document.cookie != '') {
            var cookies = document.cookie.split(';');
            for (var i = 0; i < cookies.length; i++) {
                var cookie = jQuery.trim(cookies[i]);
// Does this cookie string begin with the name we want?
                if (cookie.substring(0, name.length + 1) == (name + '=')) {
                    cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                    break;
                }
            }
        }
        return cookieValue;
    }

    function csrfSafeMethod(method) {
// these HTTP methods do not require CSRF protection
        return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
    }

    //显示日志模态框
    function showLogModel(id) {
        $("#task_id_show").val(id);
        $('#LogModel').modal("show");
        showLog();
    }

    //日志展示
    function showLog() {
        var task_id = $("#task_id_show").val();
        if (task_id) {
            $.ajax({
                url: '/auto/ui/show_log/',
                type: 'POST',
                data: {'id': task_id},
                beforeSend: function (xhr, settings) {
                    var csrftoken = getCookie('csrftoken');
                    if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
                        xhr.setRequestHeader("X-CSRFToken", csrftoken);
                    }
                },
                success: function (data) {
                    var parseJson = jQuery.parseJSON(data)
                    var log_text = parseJson.log_text
                    var is_done = parseJson.is_done
                    if (is_done != 1) {
                        window.setTimeout(showLog, 1000);
                    }

                    $("#log_text").val(log_text);
                    var ta = document.getElementById('log_text');
                    ta.scrollTop = ta.scrollHeight;//定位到最后
                    return false;
                },
            });
        }

    }

views.py文件中show_log函数

# 日志展示
@login_Check
def show_log(request):
    if request.method == "POST":  # 请求方法为POST时，进行处理
        id = request.POST.get("id")
        task = AutoTask.objects.get(id=id)
        logname = task.logname
        log_text = ''
        is_done = 0
        writeLog_info('读取日志...')
        if os.path.exists(logname):
            with open(logname, 'r', encoding='UTF-8') as f:
                log_text = f.read()
        done_msg1 = 'task finish'
        done_msg2 = 'task failed'
        if (done_msg1 in log_text) or (done_msg2 in log_text):
            is_done = 1
            writeLog_info('读取结束')
        print('日志执行状态', is_done)
        return HttpResponse(json.dumps({
            "log_text": log_text,
            'is_done':is_done
        }))