Miguel Grinberg
10 years ago
9 changed files with 166 additions and 3 deletions
@ -0,0 +1,49 @@ |
|||||
|
Engine.IO Examples |
||||
|
================== |
||||
|
|
||||
|
This directory contains example Engine.IO applications. |
||||
|
|
||||
|
app.py |
||||
|
------ |
||||
|
|
||||
|
A basic "kitchen sink" type application that allows the user to experiment |
||||
|
with most of the available features of the 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 using the default ``'threading'`` mode, create a virtual |
||||
|
environment, install the requirements and then run:: |
||||
|
|
||||
|
$ python app.py |
||||
|
|
||||
|
or:: |
||||
|
|
||||
|
$ python latency.py |
||||
|
|
||||
|
Near the top of the ``app.py`` and ``latency.py`` source files there is a |
||||
|
``async_mode`` variable that can be edited to swich to the other asynchornous |
||||
|
modes. Accepted values for ``async_mode`` are ``'threading'``, ``'eventlet'`` |
||||
|
and ``'gevent'``. |
||||
|
|
||||
|
Note 1: when using the ``'eventlet'`` mode, the eventlet package must be |
||||
|
installed in the virtual environment:: |
||||
|
|
||||
|
$ pip install eventlet |
||||
|
|
||||
|
Note 2: when using the ``'gevent'`` mode, the gevent and gevent-websocket |
||||
|
packages must be installed in the virtual environment:: |
||||
|
|
||||
|
$ pip install gevent gevent-websocket |
||||
@ -0,0 +1,46 @@ |
|||||
|
from flask import Flask, render_template |
||||
|
|
||||
|
import socketio |
||||
|
|
||||
|
# set this to 'threading', 'eventlet', or 'gevent' |
||||
|
async_mode = 'eventlet' |
||||
|
|
||||
|
sio = socketio.Server(async_mode=async_mode) |
||||
|
app = Flask(__name__) |
||||
|
app.wsgi_app = socketio.Middleware(sio, app.wsgi_app) |
||||
|
|
||||
|
|
||||
|
@app.route('/') |
||||
|
def index(): |
||||
|
return render_template('latency.html') |
||||
|
|
||||
|
|
||||
|
@sio.on('ping') |
||||
|
def ping(sid): |
||||
|
sio.emit('pong', room=sid) |
||||
|
|
||||
|
|
||||
|
if __name__ == '__main__': |
||||
|
if async_mode == 'threading': |
||||
|
# deploy with Werkzeug |
||||
|
app.run(threaded=True) |
||||
|
elif async_mode == 'eventlet': |
||||
|
# deploy with eventlet |
||||
|
import eventlet |
||||
|
from eventlet import wsgi |
||||
|
wsgi.server(eventlet.listen(('', 5000)), app) |
||||
|
elif async_mode == 'gevent': |
||||
|
# deploy with gevent |
||||
|
from gevent import pywsgi |
||||
|
try: |
||||
|
from geventwebsocket.handler import WebSocketHandler |
||||
|
websocket = True |
||||
|
except ImportError: |
||||
|
websocket = False |
||||
|
if websocket: |
||||
|
pywsgi.WSGIServer(('', 5000), app, |
||||
|
handler_class=WebSocketHandler).serve_forever() |
||||
|
else: |
||||
|
pywsgi.WSGIServer(('', 5000), app).serve_forever() |
||||
|
else: |
||||
|
print('Unknown async_mode: ' + async_mode) |
||||
@ -0,0 +1,4 @@ |
|||||
|
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; } |
||||
@ -0,0 +1,64 @@ |
|||||
|
<!doctype html> |
||||
|
<html> |
||||
|
<head> |
||||
|
<title>Socket.IO Latency</title> |
||||
|
<link rel="stylesheet" href="{{ url_for('static', filename='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', 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'); |
||||
|
$('#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> |
||||
Loading…
Reference in new issue