Created
October 1, 2019 14:43
-
-
Save abhijitmamarde/56f975bb0259b99b8fd29860e0c28e44 to your computer and use it in GitHub Desktop.
server side events using flask
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
# ref: https://stackoverflow.com/questions/12232304/how-to-implement-server-push-in-flask-framework | |
import datetime | |
import time | |
import json | |
from flask import Flask, Response | |
app = Flask(__name__) | |
def event_stream(): | |
while True: | |
yield "data: {}\n\n".format(str(datetime.datetime.now())) | |
time.sleep(1) | |
def event_stream2(): | |
while True: | |
n = datetime.datetime.now() | |
yield "data: {}\n\n".format(json.dumps({ | |
"datetime": str(n), | |
"timestamp": n.timestamp() | |
})) | |
time.sleep(1) | |
@app.route('/') | |
def root(): | |
return 'Hello World from Python Flask!' | |
@app.route('/test') | |
def test(): | |
return """ | |
<html> | |
<body> | |
<h3>Evensource based notifications - Test 1</h3> | |
<p>check the console logs!</p> | |
<ul></ul> | |
<script type="text/javascript"> | |
var source = new EventSource('/stream'); | |
var eventList = document.querySelector('ul'); | |
source.onmessage = function (e) { | |
console.log(e); | |
var newElement = document.createElement("li"); | |
newElement.textContent = "received message: " + e.data; | |
eventList.appendChild(newElement); | |
}; | |
source.onopen = function (e) { | |
console.log("opening eventsource connection"); | |
console.log(e); | |
var newElement = document.createElement("li"); | |
newElement.textContent = "opening eventsource connection"; | |
eventList.appendChild(newElement); | |
}; | |
</script> | |
</body> | |
</html> | |
""" | |
@app.route('/test2') | |
def test2(): | |
return """ | |
<html> | |
<body> | |
<h3>Evensource based notifications - Test 2</h3> | |
<p>check the console logs!</p> | |
<ul></ul> | |
<script type="text/javascript"> | |
var source = new EventSource('/stream2'); | |
var eventList = document.querySelector('ul'); | |
source.onmessage = function (e) { | |
console.log(e); | |
data = JSON.parse(e.data); | |
var newElement = document.createElement("li"); | |
newElement.textContent = "received message: " + data.timestamp; | |
eventList.appendChild(newElement); | |
}; | |
source.onopen = function (e) { | |
console.log("opening eventsource connection"); | |
console.log(e); | |
var newElement = document.createElement("li"); | |
newElement.textContent = "opening eventsource connection"; | |
eventList.appendChild(newElement); | |
}; | |
</script> | |
</body> | |
</html> | |
""" | |
@app.route('/stream') | |
def stream(): | |
return Response(event_stream(), mimetype="text/event-stream") | |
@app.route('/stream2') | |
def stream2(): | |
return Response(event_stream2(), mimetype="text/event-stream") | |
if __name__ == '__main__': | |
app.debug = True | |
# app.run(port=8085, threaded=True) | |
app.run(port=8085) # threaded is True by default since flask version 1.0 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
/test -> simple string data
/test2 -> sends json string data, and parse as json in javascript (see usage in line 77: JSON.parse)