7 changed files with 29 additions and 298 deletions
@ -1,42 +0,0 @@ |
|||||
Socket.IO sanic Examples |
|
||||
======================== |
|
||||
|
|
||||
This directory contains example Socket.IO applications that are compatible with |
|
||||
asyncio and the sanic framework. These applications require Python 3.5 or |
|
||||
later. |
|
||||
|
|
||||
Note that Sanic versions older than 0.4.0 do not support the WebSocket |
|
||||
protocol, so on those versions the only available transport is long-polling. |
|
||||
|
|
||||
app.py |
|
||||
------ |
|
||||
|
|
||||
A basic "kitchen sink" type application that allows the user to experiment |
|
||||
with most of the available features of the Socket.IO server. |
|
||||
|
|
||||
latency.py |
|
||||
---------- |
|
||||
|
|
||||
A port of the latency application included in the official Engine.IO |
|
||||
Javascript server. In this application the client sends *ping* messages to |
|
||||
the server, which are responded by the server with a *pong*. The client |
|
||||
measures the time it takes for each of these exchanges and plots these in real |
|
||||
time to the page. |
|
||||
|
|
||||
This is an ideal application to measure the performance of the different |
|
||||
asynchronous modes supported by the Socket.IO server. |
|
||||
|
|
||||
Running the Examples |
|
||||
-------------------- |
|
||||
|
|
||||
To run these examples, create a virtual environment, install the requirements |
|
||||
and then run:: |
|
||||
|
|
||||
$ python app.py |
|
||||
|
|
||||
or:: |
|
||||
|
|
||||
$ python latency.py |
|
||||
|
|
||||
You can then access the application from your web browser at |
|
||||
``http://localhost:8000``. |
|
@ -1,91 +0,0 @@ |
|||||
<!DOCTYPE HTML> |
|
||||
<html> |
|
||||
<head> |
|
||||
<title>Flask-SocketIO Test</title> |
|
||||
<script type="text/javascript" src="//code.jquery.com/jquery-2.1.4.min.js"></script> |
|
||||
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.5/socket.io.min.js"></script> |
|
||||
<script type="text/javascript" charset="utf-8"> |
|
||||
$(document).ready(function(){ |
|
||||
namespace = '/test'; |
|
||||
var socket = io.connect('http://' + document.domain + ':' + location.port + namespace); |
|
||||
|
|
||||
socket.on('connect', function() { |
|
||||
socket.emit('my event', {data: 'I\'m connected!'}); |
|
||||
}); |
|
||||
socket.on('disconnect', function() { |
|
||||
$('#log').append('<br>Disconnected'); |
|
||||
}); |
|
||||
socket.on('my response', function(msg) { |
|
||||
$('#log').append('<br>Received: ' + msg.data); |
|
||||
}); |
|
||||
|
|
||||
// event handler for server sent data |
|
||||
// the data is displayed in the "Received" section of the page |
|
||||
// handlers for the different forms in the page |
|
||||
// these send data to the server in a variety of ways |
|
||||
$('form#emit').submit(function(event) { |
|
||||
socket.emit('my event', {data: $('#emit_data').val()}); |
|
||||
return false; |
|
||||
}); |
|
||||
$('form#broadcast').submit(function(event) { |
|
||||
socket.emit('my broadcast event', {data: $('#broadcast_data').val()}); |
|
||||
return false; |
|
||||
}); |
|
||||
$('form#join').submit(function(event) { |
|
||||
socket.emit('join', {room: $('#join_room').val()}); |
|
||||
return false; |
|
||||
}); |
|
||||
$('form#leave').submit(function(event) { |
|
||||
socket.emit('leave', {room: $('#leave_room').val()}); |
|
||||
return false; |
|
||||
}); |
|
||||
$('form#send_room').submit(function(event) { |
|
||||
socket.emit('my room event', {room: $('#room_name').val(), data: $('#room_data').val()}); |
|
||||
return false; |
|
||||
}); |
|
||||
$('form#close').submit(function(event) { |
|
||||
socket.emit('close room', {room: $('#close_room').val()}); |
|
||||
return false; |
|
||||
}); |
|
||||
$('form#disconnect').submit(function(event) { |
|
||||
socket.emit('disconnect request'); |
|
||||
return false; |
|
||||
}); |
|
||||
}); |
|
||||
</script> |
|
||||
</head> |
|
||||
<body> |
|
||||
<h1>Flask-SocketIO Test</h1> |
|
||||
<h2>Send:</h2> |
|
||||
<form id="emit" method="POST" action='#'> |
|
||||
<input type="text" name="emit_data" id="emit_data" placeholder="Message"> |
|
||||
<input type="submit" value="Echo"> |
|
||||
</form> |
|
||||
<form id="broadcast" method="POST" action='#'> |
|
||||
<input type="text" name="broadcast_data" id="broadcast_data" placeholder="Message"> |
|
||||
<input type="submit" value="Broadcast"> |
|
||||
</form> |
|
||||
<form id="join" method="POST" action='#'> |
|
||||
<input type="text" name="join_room" id="join_room" placeholder="Room Name"> |
|
||||
<input type="submit" value="Join Room"> |
|
||||
</form> |
|
||||
<form id="leave" method="POST" action='#'> |
|
||||
<input type="text" name="leave_room" id="leave_room" placeholder="Room Name"> |
|
||||
<input type="submit" value="Leave Room"> |
|
||||
</form> |
|
||||
<form id="send_room" method="POST" action='#'> |
|
||||
<input type="text" name="room_name" id="room_name" placeholder="Room Name"> |
|
||||
<input type="text" name="room_data" id="room_data" placeholder="Message"> |
|
||||
<input type="submit" value="Send to Room"> |
|
||||
</form> |
|
||||
<form id="close" method="POST" action="#"> |
|
||||
<input type="text" name="close_room" id="close_room" placeholder="Room Name"> |
|
||||
<input type="submit" value="Close Room"> |
|
||||
</form> |
|
||||
<form id="disconnect" method="POST" action="#"> |
|
||||
<input type="submit" value="Disconnect"> |
|
||||
</form> |
|
||||
<h2>Receive:</h2> |
|
||||
<div><p id="log"></p></div> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,93 +1,43 @@ |
|||||
import asyncio |
#! /usr/bin/env python |
||||
|
# -*- coding: utf-8 -*- |
||||
|
""" |
||||
|
@author: xuyaoqiang |
||||
|
@contact: xuyaoqiang@gmail.com |
||||
|
@date: 2017-07-28 15:29 |
||||
|
@version: 0.0.0 |
||||
|
@license: |
||||
|
@copyright: |
||||
|
|
||||
|
""" |
||||
|
|
||||
from sanic import Sanic |
from sanic import Sanic |
||||
from sanic.response import html |
from sanic.response import html |
||||
|
|
||||
import socketio |
import socketio |
||||
|
|
||||
|
|
||||
sio = socketio.AsyncServer(async_mode='sanic') |
sio = socketio.AsyncServer(async_mode='sanic') |
||||
app = Sanic() |
app = Sanic() |
||||
sio.attach(app) |
sio.attach(app) |
||||
|
|
||||
|
|
||||
async def background_task(): |
class TestNamespace(socketio.AsyncNamespace): |
||||
"""Example of how to send server generated events to clients.""" |
|
||||
count = 0 |
|
||||
while True: |
|
||||
await sio.sleep(10) |
|
||||
count += 1 |
|
||||
await sio.emit('my response', {'data': 'Server generated event'}, |
|
||||
namespace='/test') |
|
||||
|
|
||||
|
def on_connect(self, sid, environ): |
||||
|
pass |
||||
|
|
||||
@app.listener('before_server_start') |
def on_disconnect(self, sid): |
||||
def before_server_start(sanic, loop): |
pass |
||||
sio.start_background_task(background_task) |
|
||||
|
|
||||
|
|
||||
@app.route('/') |
@app.route('/') |
||||
async def index(request): |
async def index(request): |
||||
with open('app.html') as f: |
with open('index.html') as f: |
||||
return html(f.read()) |
return html(f.read()) |
||||
|
|
||||
|
|
||||
@sio.on('my event', namespace='/test') |
sio.register_namespace(TestNamespace('/test')) |
||||
async def test_message(sid, message): |
|
||||
await sio.emit('my response', {'data': message['data']}, room=sid, |
|
||||
namespace='/test') |
|
||||
|
|
||||
|
|
||||
@sio.on('my broadcast event', namespace='/test') |
|
||||
async def test_broadcast_message(sid, message): |
|
||||
await sio.emit('my response', {'data': message['data']}, namespace='/test') |
|
||||
|
|
||||
|
|
||||
@sio.on('join', namespace='/test') |
|
||||
async def join(sid, message): |
|
||||
sio.enter_room(sid, message['room'], namespace='/test') |
|
||||
await sio.emit('my response', {'data': 'Entered room: ' + message['room']}, |
|
||||
room=sid, namespace='/test') |
|
||||
|
|
||||
|
|
||||
@sio.on('leave', namespace='/test') |
|
||||
async def leave(sid, message): |
|
||||
sio.leave_room(sid, message['room'], namespace='/test') |
|
||||
await sio.emit('my response', {'data': 'Left room: ' + message['room']}, |
|
||||
room=sid, namespace='/test') |
|
||||
|
|
||||
|
|
||||
@sio.on('close room', namespace='/test') |
|
||||
async def close(sid, message): |
|
||||
await sio.emit('my response', |
|
||||
{'data': 'Room ' + message['room'] + ' is closing.'}, |
|
||||
room=message['room'], namespace='/test') |
|
||||
await sio.close_room(message['room'], namespace='/test') |
|
||||
|
|
||||
|
|
||||
@sio.on('my room event', namespace='/test') |
|
||||
async def send_room_message(sid, message): |
|
||||
await sio.emit('my response', {'data': message['data']}, |
|
||||
room=message['room'], namespace='/test') |
|
||||
|
|
||||
|
|
||||
@sio.on('disconnect request', namespace='/test') |
|
||||
async def disconnect_request(sid): |
|
||||
await sio.disconnect(sid, namespace='/test') |
|
||||
|
|
||||
|
|
||||
@sio.on('connect', namespace='/test') |
|
||||
async def test_connect(sid, environ): |
|
||||
await sio.emit('my response', {'data': 'Connected', 'count': 0}, room=sid, |
|
||||
namespace='/test') |
|
||||
|
|
||||
|
|
||||
@sio.on('disconnect', namespace='/test') |
|
||||
def test_disconnect(sid): |
|
||||
print('Client disconnected') |
|
||||
|
|
||||
|
|
||||
app.static('/static', './static') |
|
||||
|
|
||||
|
|
||||
if __name__ == '__main__': |
if __name__ == '__main__': |
||||
app.run() |
app.run(port=8001, debug=True) |
||||
|
|
||||
|
@ -0,0 +1,7 @@ |
|||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.3/socket.io.js"></script> |
||||
|
<script> |
||||
|
var socket = io('/test',{ |
||||
|
query: {'token': 'abc'} |
||||
|
}); |
||||
|
</script> |
||||
|
|
@ -1,64 +0,0 @@ |
|||||
<!doctype html> |
|
||||
<html> |
|
||||
<head> |
|
||||
<title>Socket.IO Latency</title> |
|
||||
<link rel="stylesheet" href="/static/style.css" /> |
|
||||
</head> |
|
||||
<body> |
|
||||
<h1>Socket.IO Latency <span id="latency"></span></h1> |
|
||||
<h2 id="transport">(connecting)</h2> |
|
||||
<canvas id="chart" height="200"></canvas> |
|
||||
|
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"></script> |
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/smoothie/1.27.0/smoothie.js"></script> |
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.6/socket.io.min.js"></script> |
|
||||
<script> |
|
||||
// socket |
|
||||
var socket = io.connect('http://' + document.domain + ':' + location.port); |
|
||||
var char = $('chart').get(0); |
|
||||
socket.on('connect', function() { |
|
||||
if (chart.getContext) { |
|
||||
render(); |
|
||||
window.onresize = render; |
|
||||
} |
|
||||
send(); |
|
||||
}); |
|
||||
socket.on('pong_from_server', function() { |
|
||||
var latency = new Date - last; |
|
||||
$('#latency').text(latency + 'ms'); |
|
||||
if (time) |
|
||||
time.append(+new Date, latency); |
|
||||
setTimeout(send, 100); |
|
||||
}); |
|
||||
socket.on('disconnect', function() { |
|
||||
if (smoothie) |
|
||||
smoothie.stop(); |
|
||||
$('#transport').text('(disconnected)'); |
|
||||
}); |
|
||||
|
|
||||
var last; |
|
||||
function send() { |
|
||||
last = new Date; |
|
||||
socket.emit('ping_from_client'); |
|
||||
$('#transport').text(socket.io.engine.transport.name); |
|
||||
} |
|
||||
|
|
||||
// chart |
|
||||
var smoothie; |
|
||||
var time; |
|
||||
function render() { |
|
||||
if (smoothie) |
|
||||
smoothie.stop(); |
|
||||
chart.width = document.body.clientWidth; |
|
||||
smoothie = new SmoothieChart(); |
|
||||
smoothie.streamTo(chart, 1000); |
|
||||
time = new TimeSeries(); |
|
||||
smoothie.addTimeSeries(time, { |
|
||||
strokeStyle: 'rgb(255, 0, 0)', |
|
||||
fillStyle: 'rgba(255, 0, 0, 0.4)', |
|
||||
lineWidth: 2 |
|
||||
}); |
|
||||
} |
|
||||
</script> |
|
||||
</body> |
|
||||
</html> |
|
@ -1,25 +0,0 @@ |
|||||
from sanic import Sanic |
|
||||
from sanic.response import html |
|
||||
|
|
||||
import socketio |
|
||||
|
|
||||
sio = socketio.AsyncServer(async_mode='sanic') |
|
||||
app = Sanic() |
|
||||
sio.attach(app) |
|
||||
|
|
||||
|
|
||||
@app.route('/') |
|
||||
def index(request): |
|
||||
with open('latency.html') as f: |
|
||||
return html(f.read()) |
|
||||
|
|
||||
|
|
||||
@sio.on('ping_from_client') |
|
||||
async def ping(sid): |
|
||||
await sio.emit('pong_from_server', room=sid) |
|
||||
|
|
||||
app.static('/static', './static') |
|
||||
|
|
||||
|
|
||||
if __name__ == '__main__': |
|
||||
app.run() |
|
@ -1,4 +0,0 @@ |
|||||
body { margin: 0; padding: 0; font-family: Helvetica Neue; } |
|
||||
h1 { margin: 100px 100px 10px; } |
|
||||
h2 { color: #999; margin: 0 100px 30px; font-weight: normal; } |
|
||||
#latency { color: red; } |
|
Loading…
Reference in new issue