replace own xss prevention with DOMPurify

server.js

@@ -4,6 +4,12 @@ var accessToken = ""; //Can be set here or as start parameter (node server.js --
 fs = require("fs-extra");
 var express = require('express');
 var formidable = require('formidable'); //form upload processing
+
+const createDOMPurify = require('dompurify'); //Prevent xss
+const { JSDOM } = require('jsdom');
+const window = (new JSDOM('')).window;
+const DOMPurify = createDOMPurify(window);
+
 var s_whiteboard = require("./s_whiteboard.js");
 
 var app = express();
@@ -11,24 +17,24 @@ app.use(express.static(__dirname + '/public'));
 var server = require('http').Server(app);
 server.listen(PORT);
 var io = require('socket.io')(server);
-console.log("Webserver & socketserver running on port:"+PORT);
+console.log("Webserver & socketserver running on port:" + PORT);
 
-if(process.env.accesstoken) {
+if (process.env.accesstoken) {
     accessToken = process.env.accesstoken;
 }
 
-var startArgs = getArgs ();
-if(startArgs["accesstoken"]) {
+var startArgs = getArgs();
+if (startArgs["accesstoken"]) {
     accessToken = startArgs["accesstoken"];
 }
-if(accessToken!=="") {
-    console.log("AccessToken set to: "+accessToken);
+if (accessToken !== "") {
+    console.log("AccessToken set to: " + accessToken);
 }
 
-app.get('/loadwhiteboard', function(req, res) {
+app.get('/loadwhiteboard', function (req, res) {
     var wid = req["query"]["wid"];
     var at = req["query"]["at"]; //accesstoken
-    if(accessToken==="" || accessToken==at) {
+    if (accessToken === "" || accessToken == at) {
         var ret = s_whiteboard.loadStoredData(wid);
         res.send(ret);
         res.end();
@@ -38,27 +44,27 @@ app.get('/loadwhiteboard', function(req, res) {
     }
 });
 
-app.post('/upload', function(req, res) { //File upload
+app.post('/upload', function (req, res) { //File upload
     var form = new formidable.IncomingForm(); //Receive form
     var formData = {
-        files : {},
-        fields : {}
+        files: {},
+        fields: {}
     }
 
-    form.on('file', function(name, file) {
-        formData["files"][file.name] = file;      
+    form.on('file', function (name, file) {
+        formData["files"][file.name] = file;
     });
 
-    form.on('field', function(name, value) {
+    form.on('field', function (name, value) {
         formData["fields"][name] = value;
     });
 
-    form.on('error', function(err) {
-      console.log('File uplaod Error!');
+    form.on('error', function (err) {
+        console.log('File uplaod Error!');
     });
 
-    form.on('end', function() {
-        if(accessToken==="" || accessToken==formData["fields"]["at"]) {
+    form.on('end', function () {
+        if (accessToken === "" || accessToken == formData["fields"]["at"]) {
             progressUploadFormData(formData);
             res.send("done");
         } else {
@@ -78,19 +84,19 @@ function progressUploadFormData(formData) {
 
     var name = fields["name"] || "";
     var date = fields["date"] || (+new Date());
-    var filename = whiteboardId+"_"+date+".png";
+    var filename = whiteboardId + "_" + date + ".png";
 
-    fs.ensureDir("./public/uploads", function(err) {
-        if(err) {
+    fs.ensureDir("./public/uploads", function (err) {
+        if (err) {
             console.log("Could not create upload folder!", err);
             return;
         }
         var imagedata = fields["imagedata"];
-        if(imagedata && imagedata != "") { //Save from base64 data
+        if (imagedata && imagedata != "") { //Save from base64 data
             imagedata = imagedata.replace(/^data:image\/png;base64,/, "").replace(/^data:image\/jpeg;base64,/, "");
             console.log(filename, "uploaded");
-            fs.writeFile('./public/uploads/'+filename, imagedata, 'base64', function(err) {
-                if(err) {
+            fs.writeFile('./public/uploads/' + filename, imagedata, 'base64', function (err) {
+                if (err) {
                     console.log("error", err);
                 }
             });
@@ -98,25 +104,25 @@ function progressUploadFormData(formData) {
     });
 }
 
-io.on('connection', function(socket){
+io.on('connection', function (socket) {
 
     socket.on('disconnect', function () {
         socket.broadcast.emit('refreshUserBadges', null); //Removes old user Badges
     });
 
-    socket.on('drawToWhiteboard', function(content) {
+    socket.on('drawToWhiteboard', function (content) {
         content = escapeAllContentStrings(content);
-        if(accessToken==="" || accessToken==content["at"]) {
+        if (accessToken === "" || accessToken == content["at"]) {
             socket.broadcast.to(content["wid"]).emit('drawToWhiteboard', content); //Send to all users in the room (not own socket)
             s_whiteboard.handleEventsAndData(content); //save whiteboardchanges on the server
         } else {
             socket.emit('wrongAccessToken', true);
-        }     
+        }
     });
 
-    socket.on('joinWhiteboard', function(content) {
+    socket.on('joinWhiteboard', function (content) {
         content = escapeAllContentStrings(content);
-        if(accessToken==="" || accessToken==content["at"]) {
+        if (accessToken === "" || accessToken == content["at"]) {
             socket.join(content["wid"]); //Joins room name=wid
         } else {
             socket.emit('wrongAccessToken', true);
@@ -124,41 +130,41 @@ io.on('connection', function(socket){
     });
 });
 
-//Prevent cross site scripting
+//Prevent cross site scripting (xss)
 function escapeAllContentStrings(content, cnt) {
-    if(!cnt)
+    if (!cnt)
         cnt = 0;
 
-    if(typeof(content)=="string") {
-        return content.replace(/<\/?[^>]+(>|$)/g, "");
+    if (typeof (content) === "string") {
+        return DOMPurify.sanitize(content);
     }
-    for(var i in content) {
-        if(typeof(content[i])=="string") {
-            content[i] = content[i].replace(/<\/?[^>]+(>|$)/g, "");
-        } if(typeof(content[i])=="object" && cnt < 10) {
+    for (var i in content) {
+        if (typeof (content[i]) === "string") {
+            content[i] = DOMPurify.sanitize(content[i]);
+        } if (typeof (content[i]) === "object" && cnt < 10) {
             content[i] = escapeAllContentStrings(content[i], ++cnt);
         }
     }
     return content;
 }
 
-function getArgs () {
+function getArgs() {
     const args = {}
     process.argv
-      .slice(2, process.argv.length)
-      .forEach( arg => {
-        // long arg
-        if (arg.slice(0,2) === '--') {
-          const longArg = arg.split('=')
-          args[longArg[0].slice(2,longArg[0].length)] = longArg[1]
-        }
-       // flags
-        else if (arg[0] === '-') {
-          const flags = arg.slice(1,arg.length).split('')
-          flags.forEach(flag => {
-            args[flag] = true
-          })
-        }
-      })
+        .slice(2, process.argv.length)
+        .forEach(arg => {
+            // long arg
+            if (arg.slice(0, 2) === '--') {
+                const longArg = arg.split('=')
+                args[longArg[0].slice(2, longArg[0].length)] = longArg[1]
+            }
+            // flags
+            else if (arg[0] === '-') {
+                const flags = arg.slice(1, arg.length).split('')
+                flags.forEach(flag => {
+                    args[flag] = true
+                })
+            }
+        })
     return args
-  }
+}