server & websocket adress & port added to setting

Dockerfile

@@ -1,6 +1,7 @@
 FROM node:16
 # Create app directory
 WORKDIR /usr/src/app
+ENV WEB_IP "$WEB_ADDRESS_INT"
 # Install app dependencies
 # A wildcard is used to ensure both package.json AND package-lock.json are copied
 # where available (npm@5+)

README.md

@@ -50,10 +50,10 @@ docker run -p 3100:3100 -p 8999:8999 --name ntopngglobe -d dergeorg/ntopngglobe
 {
   "location": {
     "home": {  
-      "lat": 48.1,
+      "lat": 48.1,  // must be set to lat of home wan ip  --> https://www.maxmind.com/en/locate-my-ip-address
-      "lng": 16.3
+      "lng": 16.3   // must be set to lng of home wan ip --> https://www.maxmind.com/en/locate-my-ip-address
     },
-    "precision": 0
+    "precision": 0   // how to round the decimal. 0 is no decimal
   },
   "colors": {
     "loc": {
@@ -91,8 +91,14 @@ docker run -p 3100:3100 -p 8999:8999 --name ntopngglobe -d dergeorg/ntopngglobe
     }
   },
   "timer": {
-    "del": 30,
+    "del": 30, // deletes alerts older than 30 minutes
-    "refreshTimer": 1
+    "refreshTimer": 1 // 1 --> refresh globe every 1 minute; 0 --> refresh globe on every new Data set
+  },
+  "ips": {
+    "home": "192.168.1.", //Private home adress
+    "loopback": "127.0.0.1",
+    "server": "localhost:3100", //Server adress
+    "serverws": "localhost:8999" //websocket adress
   }
 }
 ```

app.js

@@ -18,7 +18,9 @@ var usersRouter = require('./routes/users');
 // view engine setup
 app.set('views', path.join(__dirname, 'views'));
 app.set('view engine', 'jade');
-app.use(cors())
+app.use(cors({
+    origin: 'globe.dergeorg.at'
+}))
 app.use(logger('dev'));
 app.use(express.json());
 app.use(express.urlencoded({ extended: false }));

model/globedata.js

@@ -16,7 +16,7 @@ async function addArc(src, dest, uid, src_name, dest_name){
     var endLat = undefined;
     var endLng = undefined;
     if(!data.arc.some(x => x.src === src && x.dest === dest)) {
-        if (src.includes("192.168.1.") || src.includes("127.0.0.1")) {
+        if (src.includes(settings.ips.home) || src.includes("127.0.0.1")) {
             startLat = round(settings.location.home.lat, settings.location.precision)
             startLng = round(settings.location.home.lng, settings.location.precision)
         } else {

public/conf/settings.json

@@ -44,5 +44,11 @@
   "timer": {
     "del": 30,
     "refreshTimer": 1
+  },
+  "ips": {
+    "home": "192.168.1.",
+    "loopback": "127.0.0.1",
+    "server": "localhost:3100",
+    "serverws": "localhost:8999"
   }
 }

public/globe.html

@@ -80,36 +80,30 @@
             item.cli_os + " \nis_srv_vic " + item.is_srv_vic
     }
 
+
     function componentDidMount() {
+        axios.get('/conf/settings.json').then(res => {
+            const settings = res.data;
             var data = {};
             if ("WebSocket" in window) {
                 console.log("WebSocket is supported by your Browser!");
-            const ws = new WebSocket('ws://localhost:8999');
+                const ws = new WebSocket('ws://'+settings.ips.server);
-            ws.onopen = function () {
-                // Web Socket is connected, send data using send()
-                console.log("Message is sent...");
-            };
                 ws.onmessage = function (evt) {
                     var received_msg = evt.data;
-                console.log("Message is received...");
                     componentDidMount()
                 };
-            ws.onclose = function () {
-                // websocket is closed.
-                console.log("Connection is closed...");
-            };
             }else {
                 // The browser doesn't support WebSocket
                 alert("WebSocket NOT supported by your Browser! A left click on the globe will refresh the data");
             }
 
-        axios.get("http://localhost:3100/display").then(res => {
+            axios.get("http://"+settings.ips.server+"/display").then(res => {
                 data = res.data;
                 console.log(data)
                 ReactDOM.render(
                     <Globe
                         onGlobeClick={() => {
-                        axios.get("http://localhost:3100/display").then(res => {
+                            axios.get("http://"+settings.ips.server+"/display").then(res => {
                                 data = res.data;
                                 componentDidMount()
                             });
@@ -128,7 +122,7 @@
                         arcStroke={data.settings.sizes.globe.arcStroke}
                         arcLabel={(d) => generateHoverText(d.txrx)}
                         onArcClick={function (d) {
-                        axios.get("http://localhost:3100/alert/" + d.uid).then(res => {
+                            axios.get("http://"+settings.ips.server+"/alert/" + d.uid).then(res => {
                                 const resdata = res.data;
                                 alert(generateClickText(resdata))
                             })
@@ -151,6 +145,7 @@
                     document.getElementById('globeViz')
                 );
             }).catch(err => alert(err))
+        })
     }
 
     componentDidMount()