Flask SocketIO 实时显示 Ping 命令输出

本示例展示如何使用 Flask 和 SocketIO 创建一个简单的 Web 应用，实时显示 Ping 命令的输出。

后端代码

import subprocess
from flask import Flask, render_template, request, jsonify, make_response
from flask_socketio import SocketIO, emit

app = Flask(__name__, template_folder='C:\Users\zh\PycharmProjects\webping\')
socketio = SocketIO(app, async_mode='eventlet')  # 添加async_mode参数
process = None

@app.route('/')
def index():
    return render_template('index.html')

@app.route('/execute', methods=['POST'])
def execute():
    global process
    if request.form['action'] == 'start':
        if process is not None and process.poll() is None:
            return jsonify({'output': '进程正在运行，请先停止'})
        process = subprocess.Popen(['ping', '1.1.1.1', '-t'], stdout=subprocess.PIPE, stderr=subprocess.PIPE)
        while True:
            output = process.stdout.readline()
            if output == b'' and process.poll() is not None:
                break
            if output:
                output_text = output.decode('gbk').strip()
                print(output_text)
                emit('ping_output', {'output': output_text})
        return jsonify({'output': '命令已执行'})
    elif request.form['action'] == 'stop':
        if process is not None and process.poll() is None:
            process.terminate()
            process.wait()
            process = None
        return jsonify({'output': '进程已停止'})
    else:
        return make_response(jsonify({'error': '无效的动作'}), 400)

if __name__ == '__main__':
    # socketio.run(app, debug=True)
    socketio.run(app, debug=True,allow_unsafe_werkzeug=True)

前端代码

<!DOCTYPE html>
<html>
<head>
    <title>Ping 实时输出</title>
    <script src='//cdnjs.cloudflare.com/ajax/libs/socket.io/1.7.3/socket.io.min.js'></script>
</head>
<body>
<div id='output'></div>
<script>
    var socket = io.connect('http://' + document.domain + ':' + location.port);

    socket.on('ping_output', function(data) {
        var outputDiv = document.getElementById('output');
        outputDiv.innerText += data.output + '\n';
    });
</script>
</body>
</html>

运行步骤

确保已安装 Flask 和 Flask-SocketIO：

pip install Flask Flask-SocketIO

2.  运行后端代码。
3.  在浏览器中访问 `http://localhost:5000`。
4.  点击“开始”按钮，即可开始 Ping 命令，输出将实时显示在页面上。
5.  点击“停止”按钮，即可停止 Ping 命令。

### 注意事项

*   确保 `template_folder` 路径指向正确的模板文件目录。
*   `async_mode` 参数必须设置为 `eventlet` 或其他支持异步的模式。
*   `allow_unsafe_werkzeug` 参数为 True，因为此处使用了 `socketio.run(app)`。
*   本示例使用 `ping 1.1.1.1 -t` 命令进行 Ping 测试，可以根据需要修改目标 IP 地址和命令参数。
*   前端代码需要使用 SocketIO 库监听 `ping_output` 事件，并将输出显示在页面上。

### 总结

通过使用 Flask 和 SocketIO，我们可以轻松地实现实时显示 Ping 命令输出的功能，这在网络监测等场景中非常有用。