diff options
Diffstat (limited to 'front-end/src/views/Login')
-rw-r--r-- | front-end/src/views/Login/components/Social.vue | 12 | ||||
-rw-r--r-- | front-end/src/views/Login/index.vue | 41 | ||||
-rw-r--r-- | front-end/src/views/Login/pki/index.vue | 22 | ||||
-rw-r--r-- | front-end/src/views/Login/social/[type].vue | 2 |
4 files changed, 33 insertions, 44 deletions
diff --git a/front-end/src/views/Login/components/Social.vue b/front-end/src/views/Login/components/Social.vue index 6eb65e7..5824226 100644 --- a/front-end/src/views/Login/components/Social.vue +++ b/front-end/src/views/Login/components/Social.vue @@ -17,18 +17,18 @@ </template> <script setup lang="ts"> -import { apiCall, useWait, useSession, useSessionUtils, WebMessage } from '@vnuge/vnlib.browser' +import { apiCall, useWait, useSessionUtils, WebMessage, useUser } from '@vnuge/vnlib.browser' const { waiting } = useWait() -const { browserId, publicKey } = useSession() const { KeyStore } = useSessionUtils() +const { prepareLogin } = useUser() const SocalLogin = async (url:string) => { await apiCall(async ({ axios }) => { - const { data } = await axios.put<WebMessage<string>>(url, { - browser_id: browserId.value, - public_key: publicKey.value - }) + + //Prepare the login claim + const claim = await prepareLogin() + const { data } = await axios.put<WebMessage<string>>(url, claim) const encDat = data.getResultOrThrow() // Decrypt the result which should be a redirect url diff --git a/front-end/src/views/Login/index.vue b/front-end/src/views/Login/index.vue index 7c30047..fea02d4 100644 --- a/front-end/src/views/Login/index.vue +++ b/front-end/src/views/Login/index.vue @@ -52,7 +52,7 @@ import { useMfaLogin, totpMfaProcessor, IMfaFlowContinuiation, MfaMethod, apiCall, useMessage, useWait, useUser, useSession, useLastPage, useTitle, debugLog } from '@vnuge/vnlib.browser' -import { useTimeoutFn } from '@vueuse/shared' +import { useTimeoutFn } from '@vueuse/core' import { isNil } from 'lodash-es' useTitle('Login') @@ -74,7 +74,13 @@ const { gotoLastPage } = useLastPage() useTimeoutFn(() => loggedIn.value ? gotoLastPage() : null, 500) const mfaUpgrade = ref<IMfaFlowContinuiation>(); -const mfaTimer = ref<{stop:() => void}>(); +const mfaTimeout = ref<number>(600 * 1000); +const { start, stop } = useTimeoutFn(() => { + //Clear upgrade message + mfaUpgrade.value = undefined; + setMessage('Your TOTP request has expired') +}, mfaTimeout, { immediate: false }) + const showTotp = computed(() => mfaUpgrade.value?.type === MfaMethod.TOTP) const submitLogout = async () => { @@ -96,9 +102,14 @@ const submitLogin = async ({username, password} : { username: string, password:s // Run login in an apicall wrapper await apiCall(async ({ toaster }) => { // Attempt to login - const response = await login(username, password) + const response = await login(username, password); - debugLog('Mfa-login',response) + debugLog('Mfa-login', response) + + if(response.success == false){ + setMessage(response.result) + return; + } //Try to get response as a flow continuation const mfa = response as IMfaFlowContinuiation @@ -108,16 +119,9 @@ const submitLogin = async ({username, password} : { username: string, password:s //Store the upgrade message mfaUpgrade.value = mfa; - - // Set timeout to reset the form when totp expires - mfaTimer.value = useTimeoutFn(() => { - - //Clear upgrade message - mfaUpgrade.value = undefined; - - setMessage('Your TOTP request has expired') - - }, mfa.expires! * 1000) + //Setup timeout timer + mfaTimeout.value = mfa.expires! * 1000; + start(); } //If login without mfa was successful else if (response.success) { @@ -126,8 +130,6 @@ const submitLogin = async ({username, password} : { username: string, password:s title: 'Success', text: 'You have been logged in', }) - - return; } }) } @@ -135,15 +137,16 @@ const submitLogin = async ({username, password} : { username: string, password:s const totpSubmit = ({ code } : {code:number}) =>{ apiCall(async ({ toaster }) =>{ - if (!mfaUpgrade.value) + if (!mfaUpgrade.value){ return; + } //Submit totp code const res = await mfaUpgrade.value.submit({ code }) res.getResultOrThrow() - //Clear timer - mfaTimer.value?.stop() + //Clear timer + stop(); //Clear upgrade message mfaUpgrade.value = undefined; diff --git a/front-end/src/views/Login/pki/index.vue b/front-end/src/views/Login/pki/index.vue index 4e56151..cd0113e 100644 --- a/front-end/src/views/Login/pki/index.vue +++ b/front-end/src/views/Login/pki/index.vue @@ -33,23 +33,20 @@ <script setup lang="ts"> import { isEmpty } from 'lodash-es'; -import { apiCall, debugLog, useUser, useMessage } from '@vnuge/vnlib.browser'; -import { ITokenResponse } from '@vnuge/vnlib.browser/dist/session'; +import { apiCall, debugLog, useMessage, usePkiAuth } from '@vnuge/vnlib.browser'; import { ref } from 'vue' import { decodeJwt } from 'jose' import { useRouter } from 'vue-router'; const otp = ref('') -const pkiEndpoint = import.meta.env.VITE_PKI_ENDPOINT - -const { prepareLogin } = useUser() const { setMessage } = useMessage() const { push } = useRouter() +const { login } = usePkiAuth(import.meta.env.VITE_PKI_ENDPOINT) const submit = () =>{ - apiCall(async ({ axios }) =>{ + apiCall(async () =>{ if(isEmpty(otp.value)){ setMessage('Please enter your OTP') return @@ -59,18 +56,7 @@ const submit = () =>{ const jwt = decodeJwt(otp.value) debugLog(jwt) - //Prepare a login message - const loginMessage = prepareLogin() - - //Set the 'login' field to the otp - loginMessage.login = otp.value - - const { data } = await axios.post<ITokenResponse>(pkiEndpoint, loginMessage) - - data.getResultOrThrow() - - //Finalize the login - await loginMessage.finalize(data); + await login(otp.value) //Go back to login page push({ name: 'Login' }) diff --git a/front-end/src/views/Login/social/[type].vue b/front-end/src/views/Login/social/[type].vue index da1aa25..217e89c 100644 --- a/front-end/src/views/Login/social/[type].vue +++ b/front-end/src/views/Login/social/[type].vue @@ -80,7 +80,7 @@ const run = async () => { // If nonce is set, then we can proceed with finalization await apiCall(async ({ axios }) => { - const preppedLogin = prepareLogin() + const preppedLogin = await prepareLogin() // Send the login request const { data } = await axios.post<ITokenResponse>(loginUrl, { nonce: nonce.value }) |