实现 Python 服务在执行完毕后主动向前端发送信息，以便前端（例如 Vue.js 应用）可以更新显示

可以通过多种方法实现 Python 服务在执行完毕后主动向前端发送信息，以便前端（例如 Vue.js 应用）可以更新显示。下面介绍几种常见的方法：

1. 使用 WebSockets

WebSockets 是一种在客户端和服务器之间建立持久连接的通信协议，适用于实时更新。可以使用 websockets 库在 Python 中实现 WebSocket 服务器。

Python 服务器代码示例：

import asyncio
import websocketsasync def handler(websocket, path):while True:# 等待客户端请求message = await websocket.recv()print(f"Received message: {message}")# 执行某些操作...# 发送更新通知给前端await websocket.send("Update completed")start_server = websockets.serve(handler, "localhost", 6789)asyncio.get_event_loop().run_until_complete(start_server)
asyncio.get_event_loop().run_forever()

Vue.js 前端代码示例：

<template><div><p>{{ message }}</p></div>
</template><script>
export default {data() {return {message: 'Waiting for update...'};},created() {this.connectWebSocket();},methods: {connectWebSocket() {const socket = new WebSocket('ws://localhost:6789');socket.onmessage = (event) => {this.message = event.data;};}}
};
</script>

2. 使用 HTTP Polling

HTTP Polling 是一种客户端定期向服务器发送请求以检查是否有新数据的技术。虽然不如 WebSockets 实时，但实现简单且兼容性好。

Python 服务器代码示例：

from flask import Flask, jsonify
import timeapp = Flask(__name__)@app.route('/check_update', methods=['GET'])
def check_update():# 模拟一些处理time.sleep(5)return jsonify({'status': 'Update completed'})if __name__ == '__main__':app.run(debug=True)

Vue.js 前端代码示例：

<template><div><p>{{ message }}</p></div>
</template><script>
export default {data() {return {message: 'Waiting for update...'};},created() {this.checkForUpdate();},methods: {checkForUpdate() {setInterval(() => {fetch('/check_update').then(response => response.json()).then(data => {this.message = data.status;});}, 5000); // 每5秒检查一次}}
};
</script>

3. 使用 Server-Sent Events (SSE)

SSE 允许服务器主动推送消息到客户端。它基于 HTTP 协议，适用于需要频繁更新但不需要双向通信的场景。

Python 服务器代码示例：

from flask import Flask, Response
import timeapp = Flask(__name__)@app.route('/stream')
def stream():def event_stream():while True:time.sleep(1)yield f'data: Update completed\n\n'return Response(event_stream(), content_type='text/event-stream')if __name__ == '__main__':app.run(debug=True)

Vue.js 前端代码示例：

<template><div><p>{{ message }}</p></div>
</template><script>
export default {data() {return {message: 'Waiting for update...'};},created() {this.connectSSE();},methods: {connectSSE() {const eventSource = new EventSource('/stream');eventSource.onmessage = (event) => {this.message = event.data;};}}
};
</script>