added session store and restoring data after reload page

backend/package-lock.json

@@ -6,6 +6,8 @@
     "": {
       "dependencies": {
         "body-parser": "^1.19.0",
+        "connect-mongo": "^4.4.0",
+        "connect-mongodb-session": "^2.4.1",
         "cookie-parser": "^1.4.5",
         "cors": "^2.8.5",
         "express": "^4.17.1",
@@ -47,11 +49,43 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/archetype": {
+      "version": "0.12.0",
+      "resolved": "https://registry.npmjs.org/archetype/-/archetype-0.12.0.tgz",
+      "integrity": "sha512-kSuMmbcSC69EhmUtwM3pmE1dghtjqrsv9MhgTsShtHY5zOOzT5KVeLROwVYsBeq78ELPKstNw7LyTvcXgOC/cA==",
+      "dependencies": {
+        "lodash.clonedeep": "4.x",
+        "lodash.set": "4.x",
+        "mpath": "0.5.1"
+      },
+      "engines": {
+        "node": ">= 4.0.0"
+      }
+    },
+    "node_modules/archetype/node_modules/mpath": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/mpath/-/mpath-0.5.1.tgz",
+      "integrity": "sha512-H8OVQ+QEz82sch4wbODFOz+3YQ61FYz/z3eJ5pIdbMEaUzDqA268Wd+Vt4Paw9TJfvDgVKaayC0gBzMIw2jhsg==",
+      "engines": {
+        "node": ">=4.0.0"
+      }
+    },
     "node_modules/array-flatten": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
       "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
     },
+    "node_modules/asn1.js": {
+      "version": "5.4.1",
+      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-5.4.1.tgz",
+      "integrity": "sha512-+I//4cYPccV8LdmBLiX8CYvf9Sp3vQsrqu2QNXRcrbiWvcx/UdlFiqUJJzxRQxgsZmvhXhn4cSKeSmoFjVdupA==",
+      "dependencies": {
+        "bn.js": "^4.0.0",
+        "inherits": "^2.0.1",
+        "minimalistic-assert": "^1.0.0",
+        "safer-buffer": "^2.1.0"
+      }
+    },
     "node_modules/bl": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/bl/-/bl-2.2.1.tgz",
@@ -66,6 +100,11 @@
       "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.1.tgz",
       "integrity": "sha512-MKiLiV+I1AA596t9w1sQJ8jkiSr5+ZKi0WKrYGUn6d1Fx+Ij4tIj+m2WMQSGczs5jZVxV339chE8iwk6F64wjA=="
     },
+    "node_modules/bn.js": {
+      "version": "4.12.0",
+      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
+      "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA=="
+    },
     "node_modules/body-parser": {
       "version": "1.19.0",
       "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.19.0.tgz",
@@ -102,6 +141,87 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/connect-mongo": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/connect-mongo/-/connect-mongo-4.4.0.tgz",
+      "integrity": "sha512-TTv9SUeLazm7eAvrzDfcIbiRcgeK8Dhif6XLDxnL41S3/1+EtFUgdI+kx6lcZtEdobMY/ehLWtJ6+WTXtsQDvg==",
+      "dependencies": {
+        "debug": "^4.3.1",
+        "kruptein": "^3.0.0",
+        "mongodb": "3.6.3"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/connect-mongo/node_modules/debug": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz",
+      "integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==",
+      "dependencies": {
+        "ms": "2.1.2"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/connect-mongo/node_modules/mongodb": {
+      "version": "3.6.3",
+      "resolved": "https://registry.npmjs.org/mongodb/-/mongodb-3.6.3.tgz",
+      "integrity": "sha512-rOZuR0QkodZiM+UbQE5kDsJykBqWi0CL4Ec2i1nrGrUI3KO11r6Fbxskqmq3JK2NH7aW4dcccBuUujAP0ERl5w==",
+      "dependencies": {
+        "bl": "^2.2.1",
+        "bson": "^1.1.4",
+        "denque": "^1.4.1",
+        "require_optional": "^1.0.1",
+        "safe-buffer": "^5.1.2"
+      },
+      "engines": {
+        "node": ">=4"
+      },
+      "optionalDependencies": {
+        "saslprep": "^1.0.0"
+      },
+      "peerDependenciesMeta": {
+        "aws4": {
+          "optional": true
+        },
+        "bson-ext": {
+          "optional": true
+        },
+        "kerberos": {
+          "optional": true
+        },
+        "mongodb-client-encryption": {
+          "optional": true
+        },
+        "mongodb-extjson": {
+          "optional": true
+        },
+        "snappy": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/connect-mongo/node_modules/ms": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+    },
+    "node_modules/connect-mongodb-session": {
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/connect-mongodb-session/-/connect-mongodb-session-2.4.1.tgz",
+      "integrity": "sha512-pfTy1fAVYPhE7nFS4k/MoBm4C14PIQYz008TrZc/HIGeJhsZuxfYI5fsfC+neBZezFK28sBGHhao+9iFIjOggw==",
+      "dependencies": {
+        "archetype": "0.12.x",
+        "mongodb": "3.6.x"
+      }
+    },
     "node_modules/content-disposition": {
       "version": "0.5.3",
       "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.3.tgz",
@@ -371,6 +491,27 @@
       "resolved": "https://registry.npmjs.org/kareem/-/kareem-2.3.2.tgz",
       "integrity": "sha512-STHz9P7X2L4Kwn72fA4rGyqyXdmrMSdxqHx9IXon/FXluXieaFA6KJ2upcHAHxQPQ0LeM/OjLrhFxifHewOALQ=="
     },
+    "node_modules/kruptein": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/kruptein/-/kruptein-3.0.0.tgz",
+      "integrity": "sha512-Fh5sIb+3XI9L12GsgeBQqXVRPLB1HVViKSUkqPPOcqTEX4NwoF8Z3pEfMSl3Psd1j+QlloV8Uxxwp4gk3aFBGA==",
+      "dependencies": {
+        "asn1.js": "^5.4.1"
+      },
+      "engines": {
+        "node": ">6"
+      }
+    },
+    "node_modules/lodash.clonedeep": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
+      "integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8="
+    },
+    "node_modules/lodash.set": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/lodash.set/-/lodash.set-4.3.2.tgz",
+      "integrity": "sha1-2HV7HagH3eJIFrDWqEvqGnYjCyM="
+    },
     "node_modules/media-typer": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
@@ -428,6 +569,11 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/minimalistic-assert": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz",
+      "integrity": "sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A=="
+    },
     "node_modules/mongodb": {
       "version": "3.6.4",
       "resolved": "https://registry.npmjs.org/mongodb/-/mongodb-3.6.4.tgz",
@@ -904,11 +1050,39 @@
         "negotiator": "0.6.2"
       }
     },
+    "archetype": {
+      "version": "0.12.0",
+      "resolved": "https://registry.npmjs.org/archetype/-/archetype-0.12.0.tgz",
+      "integrity": "sha512-kSuMmbcSC69EhmUtwM3pmE1dghtjqrsv9MhgTsShtHY5zOOzT5KVeLROwVYsBeq78ELPKstNw7LyTvcXgOC/cA==",
+      "requires": {
+        "lodash.clonedeep": "4.x",
+        "lodash.set": "4.x",
+        "mpath": "0.5.1"
+      },
+      "dependencies": {
+        "mpath": {
+          "version": "0.5.1",
+          "resolved": "https://registry.npmjs.org/mpath/-/mpath-0.5.1.tgz",
+          "integrity": "sha512-H8OVQ+QEz82sch4wbODFOz+3YQ61FYz/z3eJ5pIdbMEaUzDqA268Wd+Vt4Paw9TJfvDgVKaayC0gBzMIw2jhsg=="
+        }
+      }
+    },
     "array-flatten": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
       "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
     },
+    "asn1.js": {
+      "version": "5.4.1",
+      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-5.4.1.tgz",
+      "integrity": "sha512-+I//4cYPccV8LdmBLiX8CYvf9Sp3vQsrqu2QNXRcrbiWvcx/UdlFiqUJJzxRQxgsZmvhXhn4cSKeSmoFjVdupA==",
+      "requires": {
+        "bn.js": "^4.0.0",
+        "inherits": "^2.0.1",
+        "minimalistic-assert": "^1.0.0",
+        "safer-buffer": "^2.1.0"
+      }
+    },
     "bl": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/bl/-/bl-2.2.1.tgz",
@@ -923,6 +1097,11 @@
       "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.1.tgz",
       "integrity": "sha512-MKiLiV+I1AA596t9w1sQJ8jkiSr5+ZKi0WKrYGUn6d1Fx+Ij4tIj+m2WMQSGczs5jZVxV339chE8iwk6F64wjA=="
     },
+    "bn.js": {
+      "version": "4.12.0",
+      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
+      "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA=="
+    },
     "body-parser": {
       "version": "1.19.0",
       "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.19.0.tgz",
@@ -950,6 +1129,53 @@
       "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.0.tgz",
       "integrity": "sha512-zauLjrfCG+xvoyaqLoV8bLVXXNGC4JqlxFCutSDWA6fJrTo2ZuvLYTqZ7aHBLZSMOopbzwv8f+wZcVzfVTI2Dg=="
     },
+    "connect-mongo": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/connect-mongo/-/connect-mongo-4.4.0.tgz",
+      "integrity": "sha512-TTv9SUeLazm7eAvrzDfcIbiRcgeK8Dhif6XLDxnL41S3/1+EtFUgdI+kx6lcZtEdobMY/ehLWtJ6+WTXtsQDvg==",
+      "requires": {
+        "debug": "^4.3.1",
+        "kruptein": "^3.0.0",
+        "mongodb": "3.6.3"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "4.3.1",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz",
+          "integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==",
+          "requires": {
+            "ms": "2.1.2"
+          }
+        },
+        "mongodb": {
+          "version": "3.6.3",
+          "resolved": "https://registry.npmjs.org/mongodb/-/mongodb-3.6.3.tgz",
+          "integrity": "sha512-rOZuR0QkodZiM+UbQE5kDsJykBqWi0CL4Ec2i1nrGrUI3KO11r6Fbxskqmq3JK2NH7aW4dcccBuUujAP0ERl5w==",
+          "requires": {
+            "bl": "^2.2.1",
+            "bson": "^1.1.4",
+            "denque": "^1.4.1",
+            "require_optional": "^1.0.1",
+            "safe-buffer": "^5.1.2",
+            "saslprep": "^1.0.0"
+          }
+        },
+        "ms": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+          "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+        }
+      }
+    },
+    "connect-mongodb-session": {
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/connect-mongodb-session/-/connect-mongodb-session-2.4.1.tgz",
+      "integrity": "sha512-pfTy1fAVYPhE7nFS4k/MoBm4C14PIQYz008TrZc/HIGeJhsZuxfYI5fsfC+neBZezFK28sBGHhao+9iFIjOggw==",
+      "requires": {
+        "archetype": "0.12.x",
+        "mongodb": "3.6.x"
+      }
+    },
     "content-disposition": {
       "version": "0.5.3",
       "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.3.tgz",
@@ -1167,6 +1393,24 @@
       "resolved": "https://registry.npmjs.org/kareem/-/kareem-2.3.2.tgz",
       "integrity": "sha512-STHz9P7X2L4Kwn72fA4rGyqyXdmrMSdxqHx9IXon/FXluXieaFA6KJ2upcHAHxQPQ0LeM/OjLrhFxifHewOALQ=="
     },
+    "kruptein": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/kruptein/-/kruptein-3.0.0.tgz",
+      "integrity": "sha512-Fh5sIb+3XI9L12GsgeBQqXVRPLB1HVViKSUkqPPOcqTEX4NwoF8Z3pEfMSl3Psd1j+QlloV8Uxxwp4gk3aFBGA==",
+      "requires": {
+        "asn1.js": "^5.4.1"
+      }
+    },
+    "lodash.clonedeep": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
+      "integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8="
+    },
+    "lodash.set": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/lodash.set/-/lodash.set-4.3.2.tgz",
+      "integrity": "sha1-2HV7HagH3eJIFrDWqEvqGnYjCyM="
+    },
     "media-typer": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
@@ -1206,6 +1450,11 @@
         "mime-db": "1.46.0"
       }
     },
+    "minimalistic-assert": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz",
+      "integrity": "sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A=="
+    },
     "mongodb": {
       "version": "3.6.4",
       "resolved": "https://registry.npmjs.org/mongodb/-/mongodb-3.6.4.tgz",

backend/package.json

@@ -1,6 +1,8 @@
 {
   "dependencies": {
     "body-parser": "^1.19.0",
+    "connect-mongo": "^4.4.0",
+    "connect-mongodb-session": "^2.4.1",
     "cookie-parser": "^1.4.5",
     "cors": "^2.8.5",
     "express": "^4.17.1",

backend/server.js

@@ -21,17 +21,6 @@ app.use(cors({
 }))
 const PORT = 3000|| process.env.PORT;
 
-//SESSION CONFIG
-app.use(session({
-  secret: 'lalala',
-  resave: false,
-  saveUninitialized: true,
-  cookie: { 
-    httpOnly: false,
-    secure: false,},
-}));
-
-
 //DATABASE CONFIG
 const mongoose = require("mongoose");
 const CONNECTION_URI = require("./credentials.js").MONGODB_URL;
@@ -44,13 +33,33 @@ mongoose.connect(CONNECTION_URI, {
     console.log('MongoDB Connected…');
   })
 .catch(err => console.error(err));
+//SESSION CONFIG]
+var MongoDBStore = require('connect-mongodb-session')(session);
+var store = new MongoDBStore({
+  uri: CONNECTION_URI,
+  collection: 'mySessions'
+});
+app.use(session({
+  secret: 'lalala',
+  resave: true,
+  saveUninitialized: false,
+  store: store,
+  cookie: { 
+    httpOnly: false,
+    secure: false,},
+}));
 
 //ROUTES CONFIG
 const roomRoutes = require("./routes/room");
 const playerRoutes = require("./routes/player");
 
-app.post('/', (req,res)=>{
+app.get('/', (req,res)=>{
-  res.send("ok");
+  if(req.session.player){
+    res.json({
+      player: req.session.player,
+      roomId: req.session.roomId,
+    })
+  }
 })
 
 app.use('/player', playerRoutes);

src/App.js

@@ -5,8 +5,8 @@ import NameInput from './components/NameInput';
 
 function App() {
   useEffect(()=>{
-    axios.post('http://localhost:3000', {
+    axios.get('http://localhost:3000', {
-      credentials: 'include',
+      withCredentials:true,
       mode: 'cors'
     })
     .then((response)=> response.id!=null ? setRedirect(true): null);
@@ -16,8 +16,8 @@ function App() {
   const idCallback = (id)=>{
     setId(id);
     
-    axios.post('http://localhost:3000', {
+    axios.get('http://localhost:3000', {
-      credentials: 'include',
+      withCredentials:true,
       mode: 'cors',
       headers: { "Content-Type": "application/json" },
     })

src/components/NameInput.jsx

@@ -11,6 +11,7 @@ const NameInput = ({ idCallback }) => {
         axios.post('http://localhost:3000/room/add',{
             name: inputValue
         },{
+            withCredentials:true,
             "Content-Type": "application/json" 
         })
         .then(response => {