基于Django实现WebSSH的简单示例详解

沿途有光

发布时间：2026-10-13 | 6人浏览过

原创

本文介绍了一个基于Django和Channels库实现的WebSSH简单示例。内容涵盖项目结构搭建、依赖安装（包括channels-redis和Twisted）、Redis服务启动配置，以及consumers.py中的WebSocket通信逻辑。通过解析ASGI配置、路由设置及前端HTML交互，帮助开发者快速理解如何在Django中集成实时终端功能。

本文详细介绍了一个基于Django框架实现的WebSSH简易示例，旨在为读者提供清晰的实践参考。

说明

首先，需要创建一个新的Django项目，在本例中项目名称设定为chain。

此处提供的仅为基础示例，实际生产环境中应根据具体平台需求进行相应的调整与优化。

用户访问首页后，需输入数字1以触发后台登录主机的操作，随后系统将返回登录结果。

在正规项目中，通常采用POST方法提交主机信息和登录账户，后台据此进行权限验证，读取存储的账户密码并完成登录流程。

Django后台配置

在开始之前，需安装必要的Python模块。

安装完成后可能会出现版本号相关的报错信息，但这不影响功能的正常使用。

channels==2.0.2
channels-redis==2.1.0
amqp==1.4.9
anyjson==0.3.3
asgi-redis==1.4.3
asgiref==2.3.0
async-timeout==2.0.0
attrs==17.4.0

cd /tmp/
wget https://files.pythonhosted.org/packages/12/2a/e9e4fb2e6b2f7a75577e0614926819a472934b0b85f205ba5d5d2add54d0/Twisted-18.4.0.tar.bz2
tar xf Twisted-18.4.0.tar.bz2
cd Twisted-18.4.0
python3 setup.py install

此外，还需确保Redis服务已启动，以支持Channels的异步通信需求。

目录结构

chain/
    chain/
       settings.py
       asgi.py
       consumers.py
       routing.py
  templates/
      index.html

settings.py配置

# django-channels配置
CHANNEL_LAYERS = {
  "default": {
    "BACKEND": "channels_redis.core.RedisChannelLayer",
    "CONFIG": {
      "hosts": [("127.0.0.1", 6379)],
    },
  },
}

# 配置ASGI
ASGI_APPLICATION = "chain.routing.application"

consumers.py逻辑

from asgiref.sync import async_to_sync
from channels.generic.websocket import WebsocketConsumer

import paramiko
import threading
import time

from channels.layers import get_channel_layer
channel_layer = get_channel_layer()

class MyThread(threading.Thread):
  def __init__(self, id, chan):
    threading.Thread.__init__(self)
    self.chan = chan

  def run(self):
    while not self.chan.chan.exit_status_ready():
      time.sleep(0.1)
      try:
        data = self.chan.chan.recv(1024)
        async_to_sync(self.chan.channel_layer.group_send)(
          self.chan.scope['user'].username,
          {
            "type": "user.message",
            "text": bytes.decode(data)
          },
        )
      except Exception as ex:
        print(str(ex))
    self.chan.sshclient.close()
    return False

class EchoConsumer(WebsocketConsumer):

  def connect(self):
    # 创建channels group， 命名为：用户名，并使用channel_layer写入到redis
    async_to_sync(self.channel_layer.group_add)(self.scope['user'].username, self.channel_name)
    # 返回给receive方法处理
    self.accept()

  def receive(self, text_data):

    if text_data == '1':
      self.sshclient = paramiko.SSHClient()
      self.sshclient.load_system_host_keys()
      self.sshclient.set_missing_host_key_policy(paramiko.AutoAddPolicy())
      self.sshclient.connect('47.104.140.38', 22, 'root', '123456')
      self.chan = self.sshclient.invoke_shell(term='xterm')
      self.chan.settimeout(0)
      t1 = MyThread(999, self)
      t1.setDaemon(True)
      t1.start()
    else:
      try:
        self.chan.send(text_data)
      except Exception as ex:
        print(str(ex))

  def user_message(self, event):
    # 消费
    self.send(text_data=event["text"])

  def disconnect(self, close_code):
    async_to_sync(self.channel_layer.group_discard)(self.scope['user'].username, self.channel_name)

asgi.py入口

import os
import django
from channels.routing import get_default_application

os.environ.setdefault("DJANGO_SETTINGS_MODULE", "chain.settings")
django.setup()
application = get_default_application()
routing.py
from channels.auth import AuthMiddlewareStack
from channels.routing import URLRouter, ProtocolTypeRouter
from django.urls import path

from .consumers import EchoConsumer

application = ProtocolTypeRouter({
  "websocket": AuthMiddlewareStack(
    URLRouter([
      path(r"ws/", EchoConsumer),
      # path(r"stats/", StatsConsumer),
    ])
  )
})

网页前端设置

index.html模板

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>django webssh 例子</title>

  <link href="/static/css/plugins/ztree/awesomeStyle/awesome.css" rel="external nofollow" rel="stylesheet">

  <link href="/static/webssh_static/css/xterm.min.css" rel="external nofollow" rel="stylesheet" type="text/css"/>
  <style>
    body {
      padding-bottom: 30px;
    }

    .terminal {
      border: #000 solid 5px;
      font-family: cursive;
    {#        font-family: Arial, Helvetica, Tahoma ,"Monaco", "DejaVu Sans Mono", "Liberation Mono", sans-serif;#}{#        font-family: Tahoma, Helvetica, Arial, sans-serif;#}{#        font-family: "\5B8B\4F53","","Monaco", "DejaVu Sans Mono", "Liberation Mono", "Microsoft YaHei", monospace;#} font-size: 15px;
    {#        color: #f0f0f0;#} background: #000;
    {#        width: 893px;#}{#        height: 550px;#} box-shadow: rgba(0, 0, 0, 0.8) 2px 2px 20px;
    }

    .reverse-video {
      color: #000;
      background: #f0f0f0;
    }
  </style>
</head>
<body>

<div id="terms"></div>
</body>

<script src="/static/webssh_static/js/xterm.min.js"></script>
<script>
  var socket = new WebSocket('ws://' + window.location.host + '/ws/');

  socket.onopen = function () {

    var term = new Terminal();
    term.open(document.getElementById('terms'));

    term.on('data', function (data) {
      console.log(data);
      socket.send(data);
    });

    socket.onmessage = function (msg) {
      console.log(msg);
      console.log(msg.data);
      term.write(msg.data);
    };
    socket.onerror = function (e) {
      console.log(e);
    };

    socket.onclose = function (e) {
      console.log(e);
      term.destroy();
    };
  };

</script>
</html>

以上就是本文的全部内容，希望这对大家的学习有所启发，同时也欢迎大家继续支持本站获取更多技术资源。