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