SSL for web socket connection

4 files changed, 36 insertions, 15 deletions

diff --git a/gitautodeploy/gitautodeploy.py b/gitautodeploy/gitautodeploy.py
index 49526e8..1856581 100644
--- a/gitautodeploy/gitautodeploy.py
+++ b/gitautodeploy/gitautodeploy.py
@@ -339,9 +339,9 @@ class GitAutoDeploy(object):
             return
 
         try:
-            import sys
+            import os
             from autobahn.websocket import WebSocketServerProtocol, WebSocketServerFactory
-            from twisted.internet import reactor
+            from twisted.internet import reactor, ssl
             from twisted.internet.error import BindError
 
             # Create a WebSocketClientHandler instance
@@ -353,9 +353,15 @@ class GitAutoDeploy(object):
             # factory.setProtocolOptions(maxConnections=2)
 
             # note to self: if using putChild, the child must be bytes...
-            self._ws_server_port = reactor.listenTCP(self._config['web-ui-web-socket-port'], factory)
+            if 'ssl' in self._config and self._config['ssl'] and os.path.isfile(self._config['ssl-cert']):
+                contextFactory = ssl.DefaultOpenSSLContextFactory(privateKeyFileName=self._config['ssl-key'], certificateFileName=self._config['ssl-cert'])
+                self._ws_server_port = reactor.listenSSL(self._config['web-ui-web-socket-port'], factory, contextFactory)
+                protocol = "SSL"
+            else:
+                self._ws_server_port = reactor.listenTCP(self._config['web-ui-web-socket-port'], factory)
+                protocol = "TCP"
 
-            self._startup_event.log_info("Listening for web socket connections on %s port %s" % (self._config['web-ui-web-socket-host'], self._config['web-ui-web-socket-port']))
+            self._startup_event.log_info("Listening for web socket connections over %s on %s port %s" % (protocol, self._config['web-ui-web-socket-host'], self._config['web-ui-web-socket-port']))
             self._startup_event.ws_address = self._config['web-ui-web-socket-host']
             self._startup_event.ws_port = self._config['web-ui-web-socket-port']
             self._startup_event.set_ws_started(True)
diff --git a/webui/src/App.js b/webui/src/App.js
index bfe1d6b..fd9e711 100644
--- a/webui/src/App.js
+++ b/webui/src/App.js
@@ -4,15 +4,16 @@ import Timeline from './Timeline';
 import Navigation from './Navigation';
 
 class App extends Component {
-  constructor(props) {
-    super(props);
+  render() {
 
-    this.state = {
-      events: []
-    };
-  }
+    if(window.location.protocol !== "https:" && process.env.NODE_ENV !== 'development') {
+      return (
+        <div className="App">
+          <div className="insecure-scheme">The Web UI is not available over HTTP. To use it; enable SSL, restart GAD and browse to this page using HTTPS.</div>
+        </div>
+      );
+    }
 
-  render() {
     return (
       <div className="App">
         <Navigation />
diff --git a/webui/src/App.scss b/webui/src/App.scss
index ce141ed..30ff87a 100644
--- a/webui/src/App.scss
+++ b/webui/src/App.scss
@@ -11,4 +11,16 @@
         width: 100%;
         max-width: 450px;
     }
+
+    .insecure-scheme {
+        width: 100%;
+        text-align: center;
+        margin: 0 auto;
+        font-family: 'Lato', sans-serif;
+        font-weight: 300;
+        position: absolute;
+        top: 40%;
+        margin-top: -1rem;
+        
+    }
 }
diff --git a/webui/src/Timeline.js b/webui/src/Timeline.js
index 80c9d98..7f25093 100644
--- a/webui/src/Timeline.js
+++ b/webui/src/Timeline.js
@@ -20,12 +20,11 @@ class Timeline extends Component {
     this.wsSocket = null;
     this.wsIsOpen = false;
     this.wsIsRecovering = false;
-    this.wsPort = 9000;
+    this.wsPort = undefined;
   }
 
   componentDidMount() {
     this.fetchEventList();
-    this.initWebsocketConnection();
     this.initUserNotification();
   }
 
@@ -87,7 +86,7 @@ class Timeline extends Component {
     var url = '/api/status';
 
     if (process.env.NODE_ENV === 'development') {
-      url = 'http://10.0.0.1:8001/api/status';
+      url = 'https://10.0.0.1:8001/api/status';
     }
 
     axios.get(url)
@@ -95,6 +94,9 @@ class Timeline extends Component {
         const events = res.data.events.map(obj =>  new Event(obj));
         this.wsPort = res.data['web-socket-port'];
         this.setState({ events: events, loaded: true });
+
+        // Once we get to know the web socket port, we can make the web socket connection
+        this.initWebsocketConnection();
       })
       .catch(err => {
         this.setState({loaded: false});
@@ -179,7 +181,7 @@ class Timeline extends Component {
 
   getWebsocketURI() {
     if (process.env.NODE_ENV === "development") {
-      return "ws://10.0.0.1:" + this.wsPort;
+      return "wss://10.0.0.1:" + this.wsPort;
     }
     var scheme = window.location.protocol === "https" ? "wss" : "ws";
     return scheme + "://" + window.location.hostname + ":" + this.wsPort;