Replaced socket.io with SockJS

octoprint/server.py

@@ -3,7 +3,7 @@ __author__ = "Gina Häußge <osd@foosel.net>"
 __license__ = 'GNU Affero General Public License http://www.gnu.org/licenses/agpl.html'
 
 from werkzeug.utils import secure_filename
-import tornadio2
+from sockjs.tornado import SockJSRouter, SockJSConnection
 from flask import Flask, request, render_template, jsonify, send_from_directory, url_for, current_app, session, abort, make_response
 from flask.ext.login import LoginManager, login_user, logout_user, login_required, current_user
 from flask.ext.principal import Principal, Permission, RoleNeed, Identity, identity_changed, AnonymousIdentity, identity_loaded, UserNeed
@@ -34,6 +34,7 @@ app = Flask("octoprint")
 # In order that threads don't start too early when running as a Daemon
 printer = None
 timelapse = None
+debug = False
 
 gcodeManager = None
 userManager = None
@@ -46,9 +47,9 @@ user_permission = Permission(RoleNeed("user"))
 
 #~~ Printer state
 
-class PrinterStateConnection(tornadio2.SocketConnection):
-	def __init__(self, printer, gcodeManager, userManager, eventManager, session, endpoint=None):
-		tornadio2.SocketConnection.__init__(self, session, endpoint)
+class PrinterStateConnection(SockJSConnection):
+	def __init__(self, printer, gcodeManager, userManager, eventManager, session):
+		SockJSConnection.__init__(self, session)
 
 		self._logger = logging.getLogger(__name__)
 
@@ -64,8 +65,14 @@ class PrinterStateConnection(tornadio2.SocketConnection):
 		self._userManager = userManager
 		self._eventManager = eventManager
 
+	def _getRemoteAddress(self, info):
+		forwardedFor = info.headers.get("X-Forwarded-For")
+		if forwardedFor is not None:
+			return forwardedFor.split(",")[0]
+		return info.ip
+
 	def on_open(self, info):
-		self._logger.info("New connection from client: %s" % info.ip)
+		self._logger.info("New connection from client: %s" % self._getRemoteAddress(info))
 		self._printer.registerCallback(self)
 		self._gcodeManager.registerCallback(self)
 
@@ -102,16 +109,16 @@ class PrinterStateConnection(tornadio2.SocketConnection):
 			"logs": logs,
 			"messages": messages
 		})
-		self.emit("current", data)
+		self._emit("current", data)
 
 	def sendHistoryData(self, data):
-		self.emit("history", data)
+		self._emit("history", data)
 
 	def sendUpdateTrigger(self, type):
-		self.emit("updateTrigger", type)
+		self._emit("updateTrigger", type)
 
 	def sendFeedbackCommandOutput(self, name, output):
-		self.emit("feedbackCommandOutput", {"name": name, "output": output})
+		self._emit("feedbackCommandOutput", {"name": name, "output": output})
 
 	def addLog(self, data):
 		with self._logBacklogMutex:
@@ -128,6 +135,9 @@ class PrinterStateConnection(tornadio2.SocketConnection):
 	def _onMovieDone(self, event, payload):
 		self.sendUpdateTrigger("timelapseFiles")
 
+	def _emit(self, type, payload):
+		self.send({type: payload})
+
 def restricted_access(func):
 	"""
 	If you decorate a view with this, it will ensure that first setup has been
@@ -159,6 +169,8 @@ def index():
 	except:
 		pass
 
+	global debug
+
 	return render_template(
 		"index.jinja2",
 		ajaxBaseUrl=BASEURL,
@@ -169,6 +181,7 @@ def index():
 		enableAccessControl=userManager is not None,
 		enableSdSupport=settings().get(["feature", "sdSupport"]),
 		firstRun=settings().getBoolean(["server", "firstRun"]) and (userManager is None or not userManager.hasBeenCustomized()),
+		debug=debug,
 		gitBranch=branch,
 		gitCommit=commit
 	)
@@ -928,12 +941,15 @@ class Server():
 		global userManager
 		global eventManager
 		global loginManager
+		global debug
 		
 		from tornado.wsgi import WSGIContainer
 		from tornado.httpserver import HTTPServer
 		from tornado.ioloop import IOLoop
 		from tornado.web import Application, FallbackHandler
 
+		debug = self._debug
+
 		# first initialize the settings singleton and make sure it uses given configfile and basedir if available
 		self._initSettings(self._configfile, self._basedir)
 
@@ -976,7 +992,7 @@ class Server():
 		logger.info("Listening on http://%s:%d" % (self._host, self._port))
 		app.debug = self._debug
 
-		self._router = tornadio2.TornadioRouter(self._createSocketConnection)
+		self._router = SockJSRouter(self._createSocketConnection, "/sockjs")
 
 		self._tornado_app = Application(self._router.urls + [
 			(".*", FallbackHandler, {"fallback": WSGIContainer(app)})
@@ -996,9 +1012,9 @@ class Server():
 			logger.fatal("Now that is embarrassing... Something really really went wrong here. Please report this including the stacktrace below in OctoPrint's bugtracker. Thanks!")
 			logger.exception("Stacktrace follows:")
 
-	def _createSocketConnection(self, session, endpoint=None):
+	def _createSocketConnection(self, session):
 		global printer, gcodeManager, userManager, eventManager
-		return PrinterStateConnection(printer, gcodeManager, userManager, eventManager, session, endpoint)
+		return PrinterStateConnection(printer, gcodeManager, userManager, eventManager, session)
 
 	def _checkForRoot(self):
 		if "geteuid" in dir(os) and os.geteuid() == 0:

octoprint/static/js/app/dataupdater.js

@@ -11,8 +11,32 @@ function DataUpdater(loginStateViewModel, connectionViewModel, printerStateViewM
     self.timelapseViewModel = timelapseViewModel;
     self.gcodeViewModel = gcodeViewModel;
 
-    self._socket = io.connect();
-    self._socket.on("connect", function() {
+    self._socket = undefined;
+    self._autoReconnecting = false;
+    self._autoReconnectTrial = 0;
+    self._autoReconnectTimeouts = [1, 1, 2, 3, 5, 8, 13, 20, 40, 100];
+
+    self.connect = function() {
+        var options = {};
+        if (SOCKJS_DEBUG) {
+            options["debug"] = true;
+        }
+
+        self._socket = new SockJS(SOCKJS_URI, undefined, options);
+        self._socket.onopen = self._onconnect;
+        self._socket.onclose = self._onclose;
+        self._socket.onmessage = self._onmessage;
+    }
+
+    self.reconnect = function() {
+        delete self._socket;
+        self.connect();
+    }
+
+    self._onconnect = function() {
+        self._autoReconnecting = false;
+        self._autoReconnectTrial = 0;
+
         if ($("#offline_overlay").is(":visible")) {
             $("#offline_overlay").hide();
             self.timelapseViewModel.requestData();
@@ -20,8 +44,9 @@ function DataUpdater(loginStateViewModel, connectionViewModel, printerStateViewM
             self.loginStateViewModel.requestData();
             self.gcodeFilesViewModel.requestData();
         }
-    });
-    self._socket.on("disconnect", function() {
+    }
+
+    self._onclose = function() {
         $("#offline_overlay_message").html(
             "The server appears to be offline, at least I'm not getting any response from it. I'll try to reconnect " +
                 "automatically <strong>over the next couple of minutes</strong>, however you are welcome to try a manual reconnect " +
@@ -29,45 +54,66 @@ function DataUpdater(loginStateViewModel, connectionViewModel, printerStateViewM
         );
         if (!$("#offline_overlay").is(":visible"))
             $("#offline_overlay").show();
-    });
-    self._socket.on("reconnect_failed", function() {
+
+        if (self._autoReconnectTrial < self._autoReconnectTimeouts.length) {
+            var timeout = self._autoReconnectTimeouts[self._autoReconnectTrial];
+            console.log("Reconnect trial #" + self._autoReconnectTrial + ", waiting " + timeout + "s");
+            setTimeout(self.reconnect, timeout * 1000);
+            self._autoReconnectTrial++;
+        } else {
+            self._onreconnectfailed();
+        }
+    }
+
+    self._onreconnectfailed = function() {
         $("#offline_overlay_message").html(
             "The server appears to be offline, at least I'm not getting any response from it. I <strong>could not reconnect automatically</strong>, " +
                 "but you may try a manual reconnect using the button below."
         );
-    });
-    self._socket.on("history", function(data) {
-        self.connectionViewModel.fromHistoryData(data);
-        self.printerStateViewModel.fromHistoryData(data);
-        self.temperatureViewModel.fromHistoryData(data);
-        self.controlViewModel.fromHistoryData(data);
-        self.terminalViewModel.fromHistoryData(data);
-        self.timelapseViewModel.fromHistoryData(data);
-        self.gcodeViewModel.fromHistoryData(data);
-        self.gcodeFilesViewModel.fromCurrentData(data);
-    });
-    self._socket.on("current", function(data) {
-        self.connectionViewModel.fromCurrentData(data);
-        self.printerStateViewModel.fromCurrentData(data);
-        self.temperatureViewModel.fromCurrentData(data);
-        self.controlViewModel.fromCurrentData(data);
-        self.terminalViewModel.fromCurrentData(data);
-        self.timelapseViewModel.fromCurrentData(data);
-        self.gcodeViewModel.fromCurrentData(data);
-        self.gcodeFilesViewModel.fromCurrentData(data);
-    });
-    self._socket.on("updateTrigger", function(type) {
-        if (type == "gcodeFiles") {
-            gcodeFilesViewModel.requestData();
-        } else if (type == "timelapseFiles") {
-            timelapseViewModel.requestData();
-        }
-    });
-    self._socket.on("feedbackCommandOutput", function(data) {
-        self.controlViewModel.fromFeedbackCommandData(data);
-    });
-
-    self.reconnect = function() {
-        self._socket.socket.connect();
     }
+
+    self._onmessage = function(e) {
+        for (var prop in e.data) {
+            var payload = e.data[prop];
+
+            switch (prop) {
+                case "history": {
+                    self.connectionViewModel.fromHistoryData(payload);
+                    self.printerStateViewModel.fromHistoryData(payload);
+                    self.temperatureViewModel.fromHistoryData(payload);
+                    self.controlViewModel.fromHistoryData(payload);
+                    self.terminalViewModel.fromHistoryData(payload);
+                    self.timelapseViewModel.fromHistoryData(payload);
+                    self.gcodeViewModel.fromHistoryData(payload);
+                    self.gcodeFilesViewModel.fromCurrentData(payload);
+                    break;
+                }
+                case "current": {
+                    self.connectionViewModel.fromCurrentData(payload);
+                    self.printerStateViewModel.fromCurrentData(payload);
+                    self.temperatureViewModel.fromCurrentData(payload);
+                    self.controlViewModel.fromCurrentData(payload);
+                    self.terminalViewModel.fromCurrentData(payload);
+                    self.timelapseViewModel.fromCurrentData(payload);
+                    self.gcodeViewModel.fromCurrentData(payload);
+                    self.gcodeFilesViewModel.fromCurrentData(payload);
+                    break;
+                }
+                case "updateTrigger": {
+                    if (payload == "gcodeFiles") {
+                        gcodeFilesViewModel.requestData();
+                    } else if (payload == "timelapseFiles") {
+                        timelapseViewModel.requestData();
+                    }
+                    break;
+                }
+                case "feedbackCommandOutput": {
+                    self.controlViewModel.fromFeedbackCommandData(payload);
+                    break
+                }
+            }
+        }
+    }
+
+    self.connect();
 }

octoprint/templates/index.jinja2

@@ -27,8 +27,8 @@
             var CONFIG_SD_SUPPORT = {% if enableSdSupport -%} true; {% else %} false; {%- endif %}
             var CONFIG_FIRST_RUN = {%  if firstRun -%} true; {% else %} false; {%- endif %}
 
-            var WEB_SOCKET_SWF_LOCATION = "{{ url_for('static', filename='js/socket.io/WebSocketMain.swf') }}";
-            var WEB_SOCKET_DEBUG = true;
+            var SOCKJS_URI = window.location.protocol.slice(0, -1) + "://" + (window.document ? window.document.domain : window.location.hostname) + ":" + window.location.port + "/sockjs";
+            var SOCKJS_DEBUG = {%  if debug -%} true; {% else %} false; {%- endif %}
         </script>
         <script src="{{ url_for('static', filename='js/lib/less-1.3.3.min.js') }}" type="text/javascript"></script>
     </head>
@@ -619,7 +619,7 @@
         <script type="text/javascript" src="{{ url_for('static', filename='js/lib/jquery/jquery.flot.js') }}"></script>
         <script type="text/javascript" src="{{ url_for('static', filename='js/lib/jquery/jquery.iframe-transport.js') }}"></script>
         <script type="text/javascript" src="{{ url_for('static', filename='js/lib/jquery/jquery.fileupload.js') }}"></script>
-        <script type="text/javascript" src="{{ url_for('static', filename='js/lib/socket.io/socket.io.js') }}"></script>
+        <script type="text/javascript" src="{{ url_for('static', filename='js/lib/sockjs-0.3.4.min.js') }}"></script>
 
         <!-- Include OctoPrint files -->
         <!-- TODO: merge/minimize in the future -->

requirements-bbb.txt

@@ -1,7 +1,7 @@
 flask==0.9
 werkzeug==0.8.3
 tornado==3.0.2
-tornadio2==0.0.4
+sockjs-tornado>=1.0.0
 PyYAML==3.10
 Flask-Login==0.2.2
 Flask-Principal==0.3.5

requirements.txt

@@ -1,7 +1,7 @@
 flask==0.9
 werkzeug==0.8.3
 tornado==3.0.2
-tornadio2==0.0.4
+sockjs-tornado>=1.0.0
 PyYAML==3.10
 Flask-Login==0.2.2
 Flask-Principal==0.3.5