From 5e6a4cc32e4c6add49715e9d24d5311585600cb8 Mon Sep 17 00:00:00 2001 From: Wenszel Date: Wed, 17 Mar 2021 19:27:57 +0100 Subject: [PATCH] added session store and restoring data after reload page --- backend/package-lock.json | 249 +++++++++++++++++++++++++++++++++++ backend/package.json | 2 + backend/server.js | 35 +++-- src/App.js | 8 +- src/components/NameInput.jsx | 1 + 5 files changed, 278 insertions(+), 17 deletions(-) diff --git a/backend/package-lock.json b/backend/package-lock.json index ff60309..89eb83c 100644 --- a/backend/package-lock.json +++ b/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", diff --git a/backend/package.json b/backend/package.json index 403ae3d..20c9568 100644 --- a/backend/package.json +++ b/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", diff --git a/backend/server.js b/backend/server.js index 616f08a..f266ebe 100644 --- a/backend/server.js +++ b/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)=>{ - res.send("ok"); +app.get('/', (req,res)=>{ + if(req.session.player){ + res.json({ + player: req.session.player, + roomId: req.session.roomId, + }) + } }) app.use('/player', playerRoutes); diff --git a/src/App.js b/src/App.js index aaec924..7b9239d 100644 --- a/src/App.js +++ b/src/App.js @@ -5,8 +5,8 @@ import NameInput from './components/NameInput'; function App() { useEffect(()=>{ - axios.post('http://localhost:3000', { - credentials: 'include', + axios.get('http://localhost:3000', { + 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', { - credentials: 'include', + axios.get('http://localhost:3000', { + withCredentials:true, mode: 'cors', headers: { "Content-Type": "application/json" }, }) diff --git a/src/components/NameInput.jsx b/src/components/NameInput.jsx index 3f8986a..f5fe5c7 100644 --- a/src/components/NameInput.jsx +++ b/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 => {