[英]Quart & websocket: how to send data to selected users only (private message)
[英]Quart python : send websocket broadcast message from curl and display it
我是這樣編輯的:
我的 curl 命令是:
curl -d '{"key1":"value1", "key2":"value2"}' -H "Content-Type: application/json" -X POST http://localhost:5000/telepath
我想在每個客戶端上顯示此發布的數據。 我抓住了我可以在文檔中找到的東西,但這對我來說並不容易。
這是我的腳本:
from quart import Quart, render_template, websocket
from functools import partial, wraps
from quart import request, redirect, url_for, copy_current_websocket_context
import asyncio
app = Quart(__name__)
connected_websockets = set()
def collect_websocket(func):
@wraps(func)
async def wrapper(*args, **kwargs):
global connected_websockets
queue = asyncio.Queue()
connected_websockets.add(queue)
try:
return await func(queue, *args, **kwargs)
finally:
connected_websockets.remove(queue)
return wrapper
async def broadcast(message):
for queue in connected_websockets:
await queue.put(message)
@app.route('/')
async def index():
return await render_template('index.html')
@app.websocket('/ws')
@collect_websocket
async def ws(queue):
print("$ $ $",queue)
while True:
data = await websocket.receive()
print("\n {}".format(data))
await websocket.send(f"echo {data}")
@app.route('/telepath', methods=['POST'])
async def telepath():
global connected_websockets
data = await request.get_json()
for queue in connected_websockets:
await queue.put(data["key1"])
return "\n Request Processed.\n"
if __name__ == '__main__':
app.run(port=5000)
和模板:
<!doctype html>
<html>
<head>
<title>My TEST</title>
</head>
<body>
<input type="text" id="message">
<button>Send</button>
<ul></ul>
<script type="text/javascript">
var ws = new WebSocket('ws://' + document.domain + ':' + location.port + '/ws');
ws.onmessage = function (event) {
var messages_dom = document.getElementsByTagName('ul')[0];
var message_dom = document.createElement('li');
var content_dom = document.createTextNode('Received: ' + event.data);
message_dom.appendChild(content_dom);
messages_dom.appendChild(message_dom);
};
var button = document.getElementsByTagName('button')[0];
button.onclick = function() {
var content = document.getElementsByTagName('input')[0].value;
ws.send(content);
};
document.addEventListener('DOMContentLoaded', function() {
var es = new EventSource('/telepath');
es.onmessage = function (event) {
var messages_dom = document.getElementsByTagName('ul')[0];
var message_dom = document.createElement('li');
var content_dom = document.createTextNode('Received: ' + event.data);
message_dom.appendChild(content_dom);
messages_dom.appendChild(message_dom);
};
});
let socket = new WebSocket("ws://localhost:5000/ws");
socket.onmessage = function(event) {
alert(`Data received: ${event.data}`);
};
</script>
</body>
</html>
我的最終目標是身份驗證,並針對可以從服務器接收私人消息的人。
無法在 mozilla 或 chrome 客戶端上通過 curl 傳輸發布的數據。
在您的collect_websocket
裝飾器中,您將queue
參數傳遞給 websocket 處理程序( return await func(queue, *args, **kwargs)
),而您的 websocket 處理程序不接受任何參數( async def ws()
)。 這會導致您看到的錯誤。
看起來您的ws_v2
websocket 處理程序設置為與collect_websocket
裝飾器( async def ws_v2(queue)
)一起使用,所以我認為您可以切換到使用它並像這樣重寫心靈感應,
@app.route('/telepath', methods=['POST'])
async def telepath():
global connected_websockets
data = await request.get_json()
for queue in connected_websockets:
await queue.put(data["key1"])
return {}
請注意,您不需要在/telepath
路由中創建任何隊列,因為這是由collect_websocket
裝飾器完成的,並且每個 websocket 連接都需要一個隊列。 您也不需要等待ws_v2
處理程序,它會在有新的 websocket 連接時被調用。
對於身份驗證,我建議您從Quart-Auth開始(我是該庫的作者)。
編輯:按要求提供完整代碼,
import asyncio
from functools import partial, wraps
from quart import (
copy_current_websocket_context, Quart, render_template,
request, websocket
)
app = Quart(__name__)
connected_websockets = set()
def collect_websocket(func):
@wraps(func)
async def wrapper(*args, **kwargs):
global connected_websockets
queue = asyncio.Queue()
connected_websockets.add(queue)
try:
return await func(queue, *args, **kwargs)
finally:
connected_websockets.remove(queue)
return wrapper
async def broadcast(message):
global connected_websockets
for queue in connected_websockets:
await queue.put(message)
@app.route('/')
async def index():
return await render_template('index.html')
@app.websocket('/ws')
@collect_websocket
async def ws(queue):
await websocket.accept()
while True:
data = await queue.get()
await websocket.send_json(data)
@app.route('/telepath', methods=['POST'])
async def telepath():
data = await request.get_json()
await broadcast(data)
return {}
if __name__ == '__main__':
app.run(port=5000)
和模板,
<!doctype html>
<html>
<head>
<title>My TEST</title>
</head>
<body>
<ul></ul>
<script type="text/javascript">
var ws = new WebSocket('ws://' + document.domain + ':' + location.port + '/ws');
ws.onmessage = function (event) {
const messagesDOM = document.getElementsByTagName('ul')[0];
const messageDOM = document.createElement('li');
const message = JSON.parse(event.data).message;
const contentDOM = document.createTextNode('Received: ' + message);
messageDOM.appendChild(contentDOM);
messagesDOM.appendChild(messageDOM);
};
</script>
</body>
</html>
然后與 curl 一起使用,
curl -H "content-type: application/json" -d '{"message": "Hello"}' localhost:5000/telepath
請注意,服務器會將收到的所有 JSON 數據發送給客戶端,但客戶端僅使用message
密鑰。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.