Piszę sobie pewna aplikację webową (dla sensnode) i potrzebuję, aby dane pojawiały się natychmiast bez odświeżania przeglądarki. W tym celu postanowiłem wykorzystać pewna cześć HTML5 - Server-Sent Events oraz świetny lekki web framework – bottlepy. Oto przykład(poszczególne pliki umieszczone w tym samym katalogu):
es.js
var source = new EventSource('/event');
source.onmessage = function(e) {
document.body.innerHTML += e.data + '<br>';
}
websse.tpl
<html>
<head>
<title>{{title}}</title>
<script src="/websse/es.js"></script>
<head>
</body>
</body>
</html>
I na końcu aplikacja w bottlepy:
websse.py
#!/usr/bin/python2
# -*- coding: utf-8 -*-
import time
import datetime
from bottle import *
@route('/')
def home():
title = 'Event'
return template('websse', title=title)
@route('/event')
def event():
response.headers['content-type'] = 'text/event-stream\n\n'
time = datetime.datetime.now()
return 'data:' + str(time)
@route('/websse/:filename#.*#')
def static_js(filename):
return static_file(filename, root='/home/artek/bottle/')
run(host='0.0.0.0', port=5000, reloader=True)
Ostatecznie uruchamiamy aplikacje (./websse.py) i przechodzimy na http://<ip maszyny>:5000 i widzimy, że czas pokazuje się w kolejnych linijkach, bez odświeżania przeglądarki.
Testowane na Chrome dev.