django使用websocket实时打印日志

参考：https://www.cnblogs.com/baijinshuo/p/10550484.html

1、创建app 

      python manager.py startapp websocketapp

2、为app添加路由

    path('websocketapp/', include('websocketapp.urls')),

3、配置app

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'websocketapp',
]

4、templates 配置

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [
            os.path.join(BASE_DIR, 'websocketapp/templates'),
        ],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

5、websocketapp 中添加模板templates/html

6、websocketapp 中新建路由 urls.py

from django.contrib import admin
from django.urls import path, include

from django.contrib.staticfiles.urls import staticfiles_urlpatterns
from websocketapp import views as v

urlpatterns = [
    path('autolog', v.autolog, name="autolog"),
    path('autolog_echo', v.autolog_echo),
]

urlpatterns += staticfiles_urlpatterns()

7、websocketapp 中添加视图方法autolog, autolog_echo

from django.shortcuts import render

# Create your views here.
from django.shortcuts import render
from dwebsocket.decorators import accept_websocket, require_websocket
from django.http import HttpResponse

import threading
import time
import subprocess, sys
import os, json

from .server import runserver # 引入多线程服务器

def autolog(request):
    return render(request, 'html/autolog.html')


@accept_websocket
def autolog_echo(request):
    if not request.is_websocket():  # 判断是不是websocket连接
        try:  # 如果是普通的http方法
            message = request.GET['message']
            return HttpResponse(message)
        except:
            return render(request, 'html/autolog.html')
    else:
        for message in request.websocket:
            if b'runserver' == message:
                IS_WIN32 = 'win32' in str(sys.platform).lower()
                if IS_WIN32:
                    runserver("127.0.0.1", 50007, request)
            elif b'closedserver' == message:
                request.websocket.send('closedserver')

8、创建多线程服务器server.py

# Create your views here.
import socket
import threading
import os, json
from .log import Logger

log = Logger('all.log', level='debug')


# 多线程服务器
def handle_conn(log, sock, address, request1):
    t = threading.Thread(target=process_conn, args=(sock, address, request1))
    t.start()


def process_conn(sock, address, request1):
    print(threading.current_thread())
    data = "hello " + str(address)
    sock.send(data.encode("utf-8"))
    request1.websocket.send(json.dumps(data))

    while True:  # 多次为一个客户端服务
        try:
            recv_data = sock.recv(1024).decode("gbk", 'ignore')
            # 如果 recv 解堵塞，客户端有两种方式 1. 发送了数据 2. 关闭了连接
            if recv_data:
                try:
                    request1.websocket.send(json.dumps(recv_data.strip()))
                except Exception as e:
                    log.logger.log(e)
                log.logger.info(recv_data)
        except Exception as e:
            request1.websocket.send(json.dumps(("close socket.. %s ") % (e)))
            sock.close()
            break


def runserver(ip, port, request1):
    # 1. create socket
    tcp_server_socket = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
    # 2. bind local information
    tcp_server_socket.bind((ip, port))
    # 3.
    tcp_server_socket.listen()
    # 4. accept connection from client
    # 类似你在等待别人的电话到来
    # 元组解包
    while True:
        request1.websocket.send("waitting for client ........")
        new_client_socket, client_addr = tcp_server_socket.accept()
        handle_conn(log, new_client_socket, client_addr, request1)

9、websocketapp 的模板templates添加autolog.html

{% extends 'html/index.html' %}
{% block JSLink %}
    <script type="text/javascript">
        function reconvert(str) {
            str = str.replace(/(\\u)(\w{1,4})/gi, function ($0) {
                return (String.fromCharCode(parseInt((escape($0).replace(/(%5Cu)(\w{1,4})/g, "$2")), 16)));
            });
            str = str.replace(/(&#x)(\w{1,4});/gi, function ($0) {
                return String.fromCharCode(parseInt(escape($0).replace(/(%26%23x)(\w{1,4})(%3B)/g, "$2"), 16));
            });
            str = str.replace(/(&#)(\d{1,6});/gi, function ($0) {
                return String.fromCharCode(parseInt(escape($0).replace(/(%26%23)(\d{1,6})(%3B)/g, "$2")));
            });
            return str;
        }

        //<![CDATA[
        $(function () {
            var socket = new WebSocket("ws://" + window.location.host + "/websocketapp/autolog_echo");  // websocket接口
            if (window.s) {
                window.s.close()
            }
            /*创建socket连接*/
            socket.onopen = function () {
                console.log('WebSocket open');//成功连接上Websocket
                {#    发送执行脚本 #}

            };
            // Call onopen directly if socket is already open
            if (socket.readyState == WebSocket.OPEN) socket.onopen();

            window.s = socket;

            socket.onmessage = function (e) {
                $('#messagecontainer').prepend('<p>' + reconvert(e.data) + '</p>');  //日志显示
            };

            $('#connect_websocket').click(function () {
                window.s.send("runserver");
            });

            $('#close_websocket').click(function () {
                if (window.s) {
                    window.s.send("closedserver");
                    window.s.close();//关闭websocket
                    console.log('websocket已关闭');
                }
            });
        });
        //]]></script>
{% endblock %}

{% block ContainsPageContentr %}
    {% load static %}
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <div class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1 class="m-0">实时日志</h1>
                    </div><!-- /.col -->
                    <div class="col-sm-6">
                        <ol class="breadcrumb float-sm-right">
                            <li class="breadcrumb-item"><a href="{% url 'index' %}">Home</a></li>
                            <li class="breadcrumb-item active">实时日志</li>
                        </ol>
                    </div><!-- /.col -->
                </div><!-- /.row -->
            </div><!-- /.container-fluid -->
        </div>
        <!-- /.content-header -->

        <!-- Main content -->
        <div class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-12" id="autolog">
                        <button type="button" id="connect_websocket">开启服务</button>
                        <button type="button" id="close_websocket">结束服务</button>
                        <div id="messagecontainer" style="overflow: hidden;font-size:12px">
                        </div>
                    </div>
                </div>
                <!-- /.row -->
            </div><!-- /.container-fluid -->
        </div>
        <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->
{% endblock %}

 

 

 

 

问题：

    页面被刷新后，websocket断开，重新链接后，日志不被打印？？？