From 103907fe4b9b5563b08ea236247c143e9ee11d61 Mon Sep 17 00:00:00 2001 From: Francesco Luzzana Date: Fri, 29 Jul 2022 21:25:21 +0200 Subject: [PATCH] ws dynamic message processor and username --- components/NuxtLogo.vue | 19 ------- components/Tutorial.vue | 122 ---------------------------------------- middleware/auth.js | 6 ++ modules/ws-server.js | 51 ++++++++++++++++- nuxt.config.js | 1 + package-lock.json | 18 +++++- package.json | 1 + pages/auth.vue | 60 ++++++++++++++++++++ pages/index.vue | 25 ++++---- pages/index_old.vue | 32 +++++++++++ store/auth.js | 13 +++++ 11 files changed, 187 insertions(+), 161 deletions(-) delete mode 100644 components/NuxtLogo.vue delete mode 100644 components/Tutorial.vue create mode 100644 middleware/auth.js create mode 100644 pages/auth.vue create mode 100644 pages/index_old.vue create mode 100644 store/auth.js diff --git a/components/NuxtLogo.vue b/components/NuxtLogo.vue deleted file mode 100644 index f038904..0000000 --- a/components/NuxtLogo.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/components/Tutorial.vue b/components/Tutorial.vue deleted file mode 100644 index c0377a8..0000000 --- a/components/Tutorial.vue +++ /dev/null @@ -1,122 +0,0 @@ - - - - diff --git a/middleware/auth.js b/middleware/auth.js new file mode 100644 index 0000000..3be0f16 --- /dev/null +++ b/middleware/auth.js @@ -0,0 +1,6 @@ +export default function ({ redirect, store }) { + const isAuthenticated = store.state.auth.user + if (!isAuthenticated) { + redirect({ name: 'auth' }) + } +} diff --git a/modules/ws-server.js b/modules/ws-server.js index 14bc1cc..1d04fdd 100644 --- a/modules/ws-server.js +++ b/modules/ws-server.js @@ -1,14 +1,61 @@ const WebSocket = require('ws') const wss = new WebSocket.Server({ noServer: true, clientTracking: true }) +let vvvv = null +const connections = new Map() + +// Dynamic message processor + +const messageProcessor = { + hello_v4: (ws, msg) => registerV4(ws), + new_user: (ws, msg) => newUser(ws, msg), + default: (ws, msg) => unknownMsg(msg), +} + +const registerV4 = (ws, msg) => { + console.log('⬛ vvvv client connected') + vvvv = ws + // if (vvvv?.readyState === WebSocket.OPEN) { + // vvvv.send(JSON.stringify(connections)) + // } +} + +const newUser = (ws, msg) => { + console.log(`👤 New user connected: ${msg.user}`) + ws.user = msg.user + connections.set(msg.id, ws) + + if (vvvv?.readyState === WebSocket.OPEN) { + vvvv.send(JSON.stringify(msg)) + } +} + +const unknownMsg = (msg) => { + console.log('❔Unknown message type...') + console.log(msg) +} + +// Websocket Events wss.on('connection', (ws) => { - console.log('Client Connected') + ws.on('message', (data) => { + let message + + try { + message = JSON.parse(data) + } catch (e) {} + + if (message) { + ;(messageProcessor[message.type] || messageProcessor.default)(ws, message) + } + }) ws.on('close', () => { - console.log('Client Disconnected') + // console.log('Client Disconnected') }) }) +// Upgrade connection + export default function () { this.nuxt.hook('listen', (server) => { server.on('upgrade', (request, socket, head) => { diff --git a/nuxt.config.js b/nuxt.config.js index 38f5fdd..2e88a92 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -46,6 +46,7 @@ export default { vueCompositionAPIFullpath, }, build: { + postcss: null, extend(config) { config.module.rules.push({ test: /\.mjs$/, diff --git a/package-lock.json b/package-lock.json index 1fa481f..8439e2f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1938,6 +1938,11 @@ "graceful-fs": "^4.1.6" } }, + "nanoid": { + "version": "3.3.4", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz", + "integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==" + }, "supports-color": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", @@ -7770,9 +7775,9 @@ "integrity": "sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==" }, "nanoid": { - "version": "3.3.4", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz", - "integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==" + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.0.0.tgz", + "integrity": "sha512-5lU+F2QpTW1JLwlXxnu2/jkpTipIuYZL3Za6TQzM16HYDzZQqlthbXYSW0H2KzZu1UQPGHDPbCl1TS3xOKfqEQ==" }, "nanomatch": { "version": "1.2.13", @@ -8483,6 +8488,13 @@ "nanoid": "^3.3.4", "picocolors": "^1.0.0", "source-map-js": "^1.0.2" + }, + "dependencies": { + "nanoid": { + "version": "3.3.4", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz", + "integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==" + } } }, "postcss-attribute-case-insensitive": { diff --git a/package.json b/package.json index 4277391..cd7b013 100644 --- a/package.json +++ b/package.json @@ -15,6 +15,7 @@ "dependencies": { "@nuxtjs/composition-api": "^0.33.0", "core-js": "^3.19.3", + "nanoid": "^3.0.0", "nuxt": "^2.15.8", "vue": "^2.6.14", "vue-server-renderer": "^2.6.14", diff --git a/pages/auth.vue b/pages/auth.vue new file mode 100644 index 0000000..92ed400 --- /dev/null +++ b/pages/auth.vue @@ -0,0 +1,60 @@ + + + + + \ No newline at end of file diff --git a/pages/index.vue b/pages/index.vue index 36423ce..9bff3a1 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -1,27 +1,22 @@ + + \ No newline at end of file diff --git a/pages/index_old.vue b/pages/index_old.vue new file mode 100644 index 0000000..7f7879f --- /dev/null +++ b/pages/index_old.vue @@ -0,0 +1,32 @@ + + + diff --git a/store/auth.js b/store/auth.js new file mode 100644 index 0000000..c9ccd3b --- /dev/null +++ b/store/auth.js @@ -0,0 +1,13 @@ +export const state = () => ({ + user: null, + id: null, +}) + +export const mutations = { + setUser(state, user) { + state.user = user + }, + setId(state, id) { + state.id = id + }, +}