Python Flask框架开发之运用SocketIO实现WebSSH方法详解

更新时间：2022年10月08日 16:27:35 作者：LyShark 孤风洗剑

Socket.IO本是一个面向实时web应用的JavaScript库，现在已成为拥有众多语言支持的Web即时通讯应用的框架。这篇文章主要介绍了Python 运用SocketIO实现WebSSH方法

Flask 框架中如果想要实现WebSocket功能有许多种方式，运用SocketIO库来实现无疑是最简单的一种方式，Flask中封装了一个flask_socketio库该库可以直接通过pip仓库安装，如下内容将重点简述SocketIO库在Flask框架中是如何被应用的，最终实现WebSSH命令行终端功能，其可用于在Web浏览器内实现SSH命令行执行。

首先我们先来看一下SocketIO库是如何进行通信的，对于前端部分需要引入socket.io这个框架，然后就是利用该框架内提供的各类函数实现创建WS通道，如下代码：

代码中通过调用io.connect来连接后端，socket.emit则是用于向后端推送一条消息，而socket.on则是一个回调函数，一旦有数据被传出则第一时间执行回调函数内的代码。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script type="text/javascript" src="https://cdn.lyshark.com/javascript/jquery/3.5.1/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdn.lyshark.com/javascript/socket.io/socket.io.min.js"></script>
</head>
<body>
<script type="text/javascript" charset="UTF-8">
    $(document).ready(function() {
        namespace = '/Socket';
        var socket = io.connect("http://" + document.domain + ":" + location.port + namespace);
        // 初始化完成后,发送一条消息
        socket.emit("message",{"data":"hello lyshark"});
        // 收到数据后,执行输出
        socket.on('response', function(recv) {
            console.log('hello lyshark ' + recv.Data)
        });
    });
</script>
</body>
</html>

接着就是后端，后端部分代码如下所示，代码中app.config['SECRET_KEY']是配置一个安全密钥这里可以随意填写，通过socketio = SocketIO(app)初始化一个SOCKET对象，当有消息出现时SocketIO会自动执行相应的处理函数，常见的处理方法也就如下这三种。

message 出现消息后,率先执行此处
connect 当websocket连接成功时,自动触发connect默认方法
disconnect 当websocket连接失败时,自动触发disconnect默认方法

from flask import Flask,render_template,request
from flask_socketio import SocketIO
async_mode = None
app = Flask(import_name=__name__,
            static_url_path='/python',   # 配置静态文件的访问url前缀
            static_folder='static',      # 配置静态文件的文件夹
            template_folder='templates') # 配置模板文件的文件夹
app.config['SECRET_KEY'] = "lyshark"
socketio = SocketIO(app)
@app.route("/")
def index():
    return render_template("index.html")
# 出现消息后,率先执行此处
@socketio.on("message",namespace="/Socket")
def socket(message):
    print("接收到消息:",message['data'])
    for i in range(1,100):
        socketio.sleep(1)
        socketio.emit("response",           # 绑定通信
                      {"Data":i},           # 返回socket数据
                      namespace="/Socket")
# 当websocket连接成功时,自动触发connect默认方法
@socketio.on("connect",namespace="/Socket")
def connect():
    print("链接建立成功..")
# 当websocket连接失败时,自动触发disconnect默认方法
@socketio.on("disconnect",namespace="/Socket")
def disconnect():
    print("链接建立失败..")
if __name__ == '__main__':
    socketio.run(app,debug=True,host="0.0.0.0")

如上就是前后端所有的代码，当我们运行Flask后端时，打开前端页面并查看控制台，可以看到效果，后台会每隔一段时间自动向前端推送一个消息此时这个通道也算是建立成功了。

原理明白了以后，再去实现一个WebSSH终端就会变得很容易，WebSSH终端我们需要xterm这个前端库来实现，其原理就是当后台有数据输出或前台有输入时第一时间传递给SSH模块执行然后返回结果，我们先来看前端部分是如何实现这段功能的。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script type="text/javascript" src="https://cdn.lyshark.com/javascript/jquery/3.5.1/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdn.lyshark.com/javascript/socket.io/socket.io.min.js"></script>
    <link rel="stylesheet" href="https://cdn.lyshark.com/javascript/bootstrap/3.3.7/css/bootstrap.min.css" rel="external nofollow"  />
    <link rel="stylesheet" href="https://cdn.lyshark.com/javascript/xterm/xterm.css" rel="external nofollow"  />
    <script type="text/javascript" src="https://cdn.lyshark.com/javascript/xterm/xterm.js"></script>
</head>
<body>
    <div id="terminal"></div>
    <script>
      var window_width = $(window).width();
      var window_height = $(window).height();
      var term = new Terminal(
            {
                cols: Math.floor(window_width/9),
                rows: Math.floor(window_height/20),
                useStyle:false,
                convertEol: true,
                cursorBlink:true,
                cursorStyle:null,
            });
        console.log("高度" + window_height + "宽度" + window_width);
        $(document).ready(function() {
            namespace = '/Socket';
            var socket = io.connect("http://" + document.domain + ":" + location.port + namespace);
            socket.on("connect",function(){
                term.open(document.getElementById('terminal'));
            });
            // 接受后端数据,并写到控制台
            socket.on("response",function(recv){
                term.write(recv.Data);
            });
            // 发送消息到对端
            term.on("data",function(data){
               socket.send(data);
               //socket.emit("message",{"data":data});
            });
        });
</script>
</body>
</html>

上方代码中当链接SOCKET成功后，则socket.on("response",function(recv)用于接收后台的输出，一旦后台有输出数据则直接调用term.write(recv.Data);将该数据写出到控制台，而term.on则是xterm中提供的接收方法，其作用是接收用户的输入并将该输入传递给后台来处理。

那后台是如何处理的呢，其实后端只是使用paramiko模块建立一个SSH隧道，并在message函数内处理发送接收数据。

from flask import Flask,render_template,request
from flask_socketio import SocketIO
import paramiko
async_mode = None
app = Flask(import_name=__name__,
            static_url_path='/python',   # 配置静态文件的访问url前缀
            static_folder='static',      # 配置静态文件的文件夹
            template_folder='templates') # 配置模板文件的文件夹
app.config['SECRET_KEY'] = "lyshark"
socketio = SocketIO(app)
def ssh_cmd():
    tran = paramiko.Transport(('192.168.150.129', 22,))
    tran.start_client()
    tran.auth_password('root', '1233')
    chan = tran.open_session()
    chan.get_pty(height=492,width=1312)
    chan.invoke_shell()
    return chan
sessions = ssh_cmd()
@app.route("/")
def index():
    return render_template("index.html")
# 出现消息后,率先执行此处
@socketio.on("message",namespace="/Socket")
def socket(message):
    print("接收到消息:",message)
    sessions.send(message)
    ret = sessions.recv(4096)
    socketio.emit("response", {"Data": ret.decode("utf-8")}, namespace="/Socket")
    print(message)
# 当websocket连接成功时,自动触发connect默认方法
@socketio.on("connect",namespace="/Socket")
def connect():
    ret = sessions.recv(4096)
    socketio.emit("response", {"Data": ret.decode("utf-8")}, namespace="/Socket")
    print("链接建立成功..")
# 当websocket连接失败时,自动触发disconnect默认方法
@socketio.on("disconnect",namespace="/Socket")
def disconnect():
    print("链接建立失败..")
if __name__ == '__main__':
    socketio.run(app,debug=True,host="0.0.0.0")

代码运行后我们访问Web页面，即可成功登录到Linux主机，并执行任意命令。

当执行输出目录时也是带有颜色的，颜色的上色部分是xterm中自带的并不需要自己去配置。

到此这篇关于Python Flask框架开发之运用SocketIO实现WebSSH方法详解的文章就介绍到这了,更多相关Python SocketIO实现WebSSH内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

理解python多线程（python多线程简明教程）
这篇文章主要介绍了理解python多线程,一个快速理解python多线程的简明教程,需要的朋友可以参考下
2014-06-06
Python函数装饰器常见使用方法实例详解
这篇文章主要介绍了Python函数装饰器常见使用方法,结合实例形式分析了Python函数装饰器的概念、原理、用法及相关操作注意事项,需要的朋友可以参考下
2019-03-03
python flask web服务实现更换默认端口和IP的方法
今天小编就为大家分享一篇python flask web服务实现更换默认端口和IP的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2019-07-07
Python字典 dict几种遍历方式
这篇文章主要给大家分享的是Python字典 dict几种遍历方式，文章主要介绍使用 for key in dict遍历字典、使用for key in dict.keys () 遍历字典的键等内容,需要的朋友可以参考一下，希望对你有所帮助
2021-11-11
Spy++的使用方法及下载教程
这篇文章主要介绍了Spy++的使用方法及下载教程,本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
2021-01-01
Python爬虫之Selenium鼠标事件的实现
这篇文章主要介绍了Python爬虫之Selenium鼠标事件的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2020-12-12
python基于Node2Vec实现节点分类及其可视化示例详解
这篇文章主要为大家介绍了python基于Node2Vec实现节点分类及其可视化示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2023-04-04
python的函数和方法(中)
这篇文章主要为大家详细介绍了python的函数和方法，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2021-11-11
python中用ctypes模拟点击的实例讲解
在本篇文章里小编给各位整理了一篇关于python中用ctypes模拟点击的实例讲解内容，需要的朋友可以参考学习下。
2020-11-11
python之no module named xxxx以及虚拟环境配置过程
在Python开发过程中,经常会遇到环境配置和包管理的问题,主要原因包括未安装所需包或使用虚拟环境导致的,通过pip install命令安装缺失的包是解决问题的一种方式,此外,使用虚拟环境,例如PyCharm支持的Virtualenv,可以为每个项目创建独立的运行环境
2024-10-10

Python Flask框架开发之运用SocketIO实现WebSSH方法详解

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具