From 821a1dda41ceecf09d73ad147421108db17527ce Mon Sep 17 00:00:00 2001 From: Kheang Kimang Date: Wed, 27 Dec 2023 15:49:07 +0700 Subject: [PATCH 1/9] Add github, google strategies --- .env.example | 10 +++ components/commons/social-sign.vue | 99 +++++++++++++++++++++++++++ components/modals/login-modal.vue | 4 ++ nuxt.config.js | 44 ++++++++++-- package.json | 3 +- pages/index.vue | 1 + plugins/axios.js | 106 ++++++++++++++--------------- yarn.lock | 96 +++++++++++++++++++++----- 8 files changed, 287 insertions(+), 76 deletions(-) create mode 100644 components/commons/social-sign.vue diff --git a/.env.example b/.env.example index c364d03..25dbfc4 100644 --- a/.env.example +++ b/.env.example @@ -24,3 +24,13 @@ GEETEST_ID_RESET=your-gee-test-id GEETEST_KEY_RESET=your-geetest-key PUSHER_API_KEY= PUSHER_API_CLUSTER= + +#SSO +GOOGLE_CLIENT_ID= +GOOGLE_CALLBACK_URL=http://localhost/v1/auth/google/callback + +FACEBOOK_APP_ID= +FACEBOOK_CALLBACK_URL=http://localhost/v1/auth/facebook/callback + +GITHUB_CLIENT_ID= +GITHUB_CALLBACK_URL=http://localhost/v1/auth/github/callback diff --git a/components/commons/social-sign.vue b/components/commons/social-sign.vue new file mode 100644 index 0000000..ba8adea --- /dev/null +++ b/components/commons/social-sign.vue @@ -0,0 +1,99 @@ + + diff --git a/components/modals/login-modal.vue b/components/modals/login-modal.vue index d88871b..48a76ae 100644 --- a/components/modals/login-modal.vue +++ b/components/modals/login-modal.vue @@ -55,6 +55,7 @@ + @@ -95,8 +96,11 @@ import GeneralLoading from "~/components/loadings/general-loading"; import { ValidationObserver } from "vee-validate"; import BasicInput from "~/components/inputs/basic-input"; import { mapGetters } from "vuex"; +import SocialSign from "~/components/commons/social-sign.vue"; + export default { components: { + SocialSign, BasicInput, ValidationObserver, GeneralLoading, diff --git a/nuxt.config.js b/nuxt.config.js index fa06a13..f48af3b 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -21,8 +21,7 @@ export default { link: [{ rel: "icon", type: "image/x-icon", href: "/favicon.ico" }], }, server: { - host: "0.0.0.0", - port: 7000, + port: 3000, }, // Global CSS: https://go.nuxtjs.dev/config-css @@ -152,7 +151,7 @@ export default { "@nuxtjs/sitemap", "@nuxtjs/axios", "@nuxtjs/toast", - "@nuxtjs/auth-next", + "@yashx/nuxt-auth-popup", // [ // "@nuxtjs/google-adsense", // { @@ -288,6 +287,43 @@ export default { }, autoLogout: true, }, + google: { + clientId: process.env.GOOGLE_CLIENT_ID, + redirectUri: process.env.GOOGLE_CALLBACK_URL, + token: { + property: "accessToken", + type: "Bearer", + }, + refreshToken: { + property: "refreshToken", + }, + codeChallengeMethod: "", + responseType: "code", + accessType: "offline", + endpoints: { + token: `${process.env.BASE_URL}/v1/auth/google/callback/`, + userInfo: `${process.env.BASE_URL}/v1/auth/me/`, + }, + }, + github: { + clientId: process.env.GITHUB_CLIENT_ID, + // clientSecret: process.env.GITHUB_CLIENT_SECRET, + redirectUri: process.env.GITHUB_CALLBACK_URL, + token: { + property: "accessToken", + required: true, + type: "Bearer", + global: true, + }, + refreshToken: { + property: "refreshToken", + data: "refreshToken", + }, + endpoints: { + token: `${process.env.BASE_URL}/v1/auth/github/callback`, + userInfo: `${process.env.BASE_URL}/v1/auth/me/`, + }, + }, }, }, @@ -312,7 +348,7 @@ export default { // Build Configuration: https://go.nuxtjs.dev/config-build build: { - analyze: true, + // analyze: true, // Add exception transpile: ["vee-validate/dist/rules"], html: { diff --git a/package.json b/package.json index 522ad77..8331660 100644 --- a/package.json +++ b/package.json @@ -11,13 +11,14 @@ "dependencies": { "@nestjsx/crud-request": "^5.0.0-alpha.3", "@nuxt/content": "^1.15.1", - "@nuxtjs/auth-next": "5.0.0-1624817847.21691f1", + "@nuxtjs/auth-next": "5.0.0-1667386184.dfbbb54", "@nuxtjs/axios": "^5.13.6", "@nuxtjs/feed": "^2.0.0", "@nuxtjs/sitemap": "^2.4.0", "@nuxtjs/toast": "^3.3.1", "@tailwindcss/forms": "^0.5.0", "@tailwindcss/typography": "^0.5.2", + "@yashx/nuxt-auth-popup": "^6.0.1", "axios": "^0.27.2", "cookie-universal-nuxt": "^2.1.5", "core-js": "^3.19.3", diff --git a/pages/index.vue b/pages/index.vue index e8ed447..b762c79 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -23,6 +23,7 @@ diff --git a/pages/login.vue b/pages/login.vue index e69de29..d9351e4 100644 --- a/pages/login.vue +++ b/pages/login.vue @@ -0,0 +1,8 @@ + + diff --git a/plugins/axios.js b/plugins/axios.js index d08e792..58a4efd 100644 --- a/plugins/axios.js +++ b/plugins/axios.js @@ -3,6 +3,27 @@ export default ({ app, store, $axios, redirect }) => { config.headers.common["Accept-Language"] = app.i18n.locale; // console.log(app.$auth.$storage.getState("_token.local")); }); + $axios.onError((error) => { + const code = parseInt(error.response && error.response.status); + + if (code === 400) { + const previousRegistration = store.getters["setting/getLoginType"]; + const prefer = error.response.data.message; + setTimeout(() => { + app.router.push( + app.localePath( + `/integration?previous=${previousRegistration}&prefer=${prefer}` + ) + ); + }); + } + // console.log(prefer); + // console.log(code); + // console.log(originalRequest.url); + // console.log(redirect); + // console.log(previousRegistration); + // console.log(app); + }); /** * Refresh Token Upon Error */ diff --git a/plugins/vuex-persist.client.js b/plugins/vuex-persist.client.js index 972fcbd..bc53e83 100644 --- a/plugins/vuex-persist.client.js +++ b/plugins/vuex-persist.client.js @@ -4,6 +4,6 @@ import VuexPersistence from "vuex-persist"; export default ({ store }) => { new VuexPersistence({ /* your options */ - modules: ["auth"], + modules: ["auth", "setting"], }).plugin(store); }; diff --git a/store/setting/getters.js b/store/setting/getters.js index f5d9f96..423ac49 100644 --- a/store/setting/getters.js +++ b/store/setting/getters.js @@ -1,3 +1,4 @@ export default { getBannerCookie: (state) => state.cookieBanner, + getLoginType: (state) => state.loginType, }; diff --git a/store/setting/mutations.js b/store/setting/mutations.js index cf7f4dd..b836074 100644 --- a/store/setting/mutations.js +++ b/store/setting/mutations.js @@ -2,4 +2,7 @@ export default { SET_BANNER_SETTING(state, cookie) { state.cookieBanner = cookie; }, + SET_LOGIN_TYPE(state, type) { + state.loginType = type; + }, }; diff --git a/store/setting/state.js b/store/setting/state.js index 533649e..7b24f4c 100644 --- a/store/setting/state.js +++ b/store/setting/state.js @@ -1,3 +1,4 @@ export default () => ({ cookieBanner: true, + loginType: "", }); diff --git a/yarn.lock b/yarn.lock index 4bd93c2..16126f8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1518,10 +1518,10 @@ webpack-node-externals "^3.0.0" webpackbar "^4.0.0" -"@nuxtjs/auth-next@5.0.0-1667386184.dfbbb54": - version "5.0.0-1667386184.dfbbb54" - resolved "https://registry.yarnpkg.com/@nuxtjs/auth-next/-/auth-next-5.0.0-1667386184.dfbbb54.tgz#54404436adda39bf2fe751e799551b2cf626b7c1" - integrity sha512-ODUw/y7oTRGvzOQbtoJg7yqOiJ1XuPecmtdSnZukx1x942HL5dRNIarfjdsANP8B3zsyjZ3qyzmo/dzhsJYD6g== +"@nuxtjs/auth-next@5.0.0-1648802546.c9880dc": + version "5.0.0-1648802546.c9880dc" + resolved "https://registry.yarnpkg.com/@nuxtjs/auth-next/-/auth-next-5.0.0-1648802546.c9880dc.tgz#fe01e44c9ccbcfa876a19104e0c977f42ac69be3" + integrity sha512-L4IxKQDEP2Z85TZRyz+jNl9lWFjj/AmPWMwKjJLrcGz3Ubh1dGV4aXGfmtqeZmwGSr4vOqSd7MYCYwXTbk1cPA== dependencies: "@nuxtjs/axios" "^5.13.6" axios "^0.26.1" From bf805640ca76ec070d683cafb6827016d67b1321 Mon Sep 17 00:00:00 2001 From: KK_Mac_16 Date: Thu, 28 Dec 2023 20:41:15 +0700 Subject: [PATCH 4/9] Add integration page --- components/buttons/social-button-large.vue | 50 +++++++++ locales/en-US.js | 5 + locales/kh-KH.js | 6 + middleware/check-params.js | 12 ++ pages/integration.vue | 124 ++++++++++++++++++++- plugins/axios.js | 9 +- 6 files changed, 200 insertions(+), 6 deletions(-) create mode 100644 components/buttons/social-button-large.vue create mode 100644 middleware/check-params.js diff --git a/components/buttons/social-button-large.vue b/components/buttons/social-button-large.vue new file mode 100644 index 0000000..486e78f --- /dev/null +++ b/components/buttons/social-button-large.vue @@ -0,0 +1,50 @@ + + diff --git a/locales/en-US.js b/locales/en-US.js index 46dc922..ef72646 100644 --- a/locales/en-US.js +++ b/locales/en-US.js @@ -139,6 +139,11 @@ const messages = { purchase_confirmation_done: "Purchase is Confirmed", or_sign_in_with: "or sign in with", continue_with: "Continue with", + hey: "Hey", + we_found_that_your_email: "We found that your email address", + already_registered_using: "is already registered using", + please_sign_using: "Please sign in using", + then_you_can_link: "then you can link to account with other social services.", fields: { firstname: "Firstname", lastname: "Lastname", diff --git a/locales/kh-KH.js b/locales/kh-KH.js index dc8d8a6..18213b5 100644 --- a/locales/kh-KH.js +++ b/locales/kh-KH.js @@ -141,6 +141,12 @@ const messages = { purchase_confirmation_done: "ការបញ្ជាក់រួចរាល់", or_sign_in_with: "រឺ ចូលជាមួយ", continue_with: "បន្តជាមួយ", + hey: "សួស្តី", + we_found_that_your_email: "យើងរកឃើញថាអ៉ីមែលរបស់អ្នក", + already_registered_using: "ត្រូវបានយកទៅចុះឈ្មោះម្តងហើយដោយប្រើ", + please_sign_using: "សូមចូលដោយប្រើ", + then_you_can_link: + "បន្ទាប់មកអ្នកអាចភ្ជាប់គណនីរបស់អ្នកទៅកាន់សេវាផ្សេងៗទៀតតាមក្រោយ។", fields: { firstname: "ឈ្មោះ", lastname: "ត្រកូល", diff --git a/middleware/check-params.js b/middleware/check-params.js new file mode 100644 index 0000000..6e7ae17 --- /dev/null +++ b/middleware/check-params.js @@ -0,0 +1,12 @@ +export default function ({ query, redirect }) { + // Check if multiple query parameters are present + const requiredParams = ["previous", "prefer", "name", "email"]; + + // Check if any required parameter is missing + const missingParams = requiredParams.filter((param) => !query[param]); + + if (missingParams.length > 0) { + // Redirect to the home page + redirect("/"); + } +} diff --git a/pages/integration.vue b/pages/integration.vue index d9351e4..f24a5d7 100644 --- a/pages/integration.vue +++ b/pages/integration.vue @@ -1,8 +1,126 @@ diff --git a/plugins/axios.js b/plugins/axios.js index 58a4efd..dab9c38 100644 --- a/plugins/axios.js +++ b/plugins/axios.js @@ -7,12 +7,15 @@ export default ({ app, store, $axios, redirect }) => { const code = parseInt(error.response && error.response.status); if (code === 400) { - const previousRegistration = store.getters["setting/getLoginType"]; - const prefer = error.response.data.message; + const prefer = store.getters["setting/getLoginType"]; + const previousRegistration = + error.response.data.integration[0].provider.toLowerCase(); + const name = error.response.data.user.firstname; + const email = error.response.data.user.email; setTimeout(() => { app.router.push( app.localePath( - `/integration?previous=${previousRegistration}&prefer=${prefer}` + `/integration?previous=${previousRegistration}&prefer=${prefer}&name=${name}&email=${email}` ) ); }); From 1500f038d225337f3c47fe5e33aa9a7869940b0f Mon Sep 17 00:00:00 2001 From: Kheang Kimang Date: Thu, 28 Dec 2023 21:42:57 +0700 Subject: [PATCH 5/9] Update middleware/check-params.js Co-authored-by: tfd-ed --- middleware/check-params.js | 5 ----- 1 file changed, 5 deletions(-) diff --git a/middleware/check-params.js b/middleware/check-params.js index 6e7ae17..347bc58 100644 --- a/middleware/check-params.js +++ b/middleware/check-params.js @@ -1,12 +1,7 @@ export default function ({ query, redirect }) { - // Check if multiple query parameters are present const requiredParams = ["previous", "prefer", "name", "email"]; - - // Check if any required parameter is missing const missingParams = requiredParams.filter((param) => !query[param]); - if (missingParams.length > 0) { - // Redirect to the home page redirect("/"); } } From 26a60aa80699ab6b9f42bbbc1421b32fe7e00565 Mon Sep 17 00:00:00 2001 From: Kheang Kimang Date: Thu, 28 Dec 2023 21:48:49 +0700 Subject: [PATCH 6/9] Update pages/login.vue Remove empty script Co-authored-by: tfd-ed --- pages/login.vue | 3 --- 1 file changed, 3 deletions(-) diff --git a/pages/login.vue b/pages/login.vue index d9351e4..0b79969 100644 --- a/pages/login.vue +++ b/pages/login.vue @@ -3,6 +3,3 @@ - From 5e2d19c1d2a103b3c3434c0eda6db33bb6e0cfe4 Mon Sep 17 00:00:00 2001 From: KK_Mac_16 Date: Mon, 22 Jan 2024 16:42:51 +0700 Subject: [PATCH 7/9] Integration list --- components/modals/integration-info.vue | 98 +++++++++++++++++++ layouts/default.vue | 3 + locales/en-US.js | 3 + locales/kh-KH.js | 3 + nuxt.config.js | 1 + pages/user/index.vue | 130 ++++++++++++++++++++++++- plugins/axios.js | 12 ++- store/integration/actions.js | 8 ++ store/integration/getters.js | 4 + store/integration/mutations.js | 8 ++ store/integration/state.js | 5 + 11 files changed, 272 insertions(+), 3 deletions(-) create mode 100644 components/modals/integration-info.vue create mode 100644 store/integration/actions.js create mode 100644 store/integration/getters.js create mode 100644 store/integration/mutations.js create mode 100644 store/integration/state.js diff --git a/components/modals/integration-info.vue b/components/modals/integration-info.vue new file mode 100644 index 0000000..412707a --- /dev/null +++ b/components/modals/integration-info.vue @@ -0,0 +1,98 @@ + + diff --git a/layouts/default.vue b/layouts/default.vue index e705dc7..f14e617 100644 --- a/layouts/default.vue +++ b/layouts/default.vue @@ -17,6 +17,7 @@ +