Wrong login-attempt is redirecting the user to "/"

[ahoiroman]

Environment

- Operating System: `Darwin`
- Node Version:     `v18.9.0`
- Nuxt Version:     `3.0.0-rc.12`
- Nitro Version:    `0.6.0`
- Package Manager:  `npm@8.19.1`
- Builder:          `vite`
- User Config:      `experimental`, `build`, `buildModules`, `modules`, `publicRuntimeConfig`, `privateRuntimeConfig`, `globalName`, `app`, `intlify`, `http`, `proxy`, `auth`, `tailwindcss`, `googleFonts`, `content`
- Runtime Modules:  `@nuxtjs-alt/auth@2.0.20`, `@nuxtjs-alt/http@1.3.18`, `@nuxtjs-alt/proxy@1.3.5`, `@nuxt/content@2.2.0`, `@nuxtjs/tailwindcss@5.3.5`, `@nuxtjs/google-fonts@3.0.0-0`, `@intlify/nuxt3@0.2.4`, `@pinia/nuxt@0.4.3`
- Build Modules:    `@intlify/nuxt3@0.2.4`

Reproduction

Create a login function like:

$auth.login({
        body: {
            name: form.value.name,
            email: form.value.email,
            secret: form.value.secret
        }
    })
        .then(() => {
            console.log("Logged in!")
        })
        .catch((e) => {
            console.log("Can't log in");
            actions.setFieldError('form.email', 'This email is not valid');
            actions.setFieldError('form.secret', 'This secret is not valid');
        });

If I now log in using wrong credentials and the API returns HTTP 401, the user is being redirected to / instead of remaining on the login-page. The console.log("Can't log in"); fires.

This issue was introduced in 2.0.19 and is also present in 2.0.20. Using 2.0.18 it works as expected.

Describe the bug

User is being redirected when entering wrong credentials instead of remaining on the login page.

Additional context

No response

Logs

No response

[Denoder]

try 2.0.21

[ahoiroman]

2.0.21 has the same problem.

[Denoder]

what scheme are you using?

[ahoiroman]

auth: {
    globalMiddleware: true,
    redirect: {
        home: '/dashboard',
        logout: '/',
        login: '/auth/signin',
        callback: '/backend/login',
    },
    strategies: {
        // @ts-ignore
        api: {
            provider: 'laravel/sanctum',
            url: process.env.NUXT_PUBLIC_APP_URL,
            cookie: {
                server: true,
                name: 'XSRF-TOKEN',
            },
            endpoints: {
                csrf: {
                    url: '/backend/sanctum/csrf-cookie'
                },
                login: {
                    url: '/backend/login'
                },
                logout: {
                    url: '/backend/logout'
                },
                user: {
                    url: '/backend/api/auth/me'
                }
            },
            user: {
                property: {
                    client: false,
                    server: false
                },
                autoFetch: true
            }
        },
    }
},

Update: For testing purposes I also removed all custom middleware, which is redirecting the user in some cases. But removing all custom middleware and restarting npm run dev did not solve this issue.

As I said before: It worked in versions < 2.0.19

[Denoder]

Im not getting the redirects

[ahoiroman]

I will build a reproducer (if I can) within the next days.

[ahoiroman]

What I found so far:

If the credentials are not valid, the Laravel-Backend sends:

FetchError: 401 Unauthorized (http://web.example.test/backend/login)
FetchError — ohmyfetch.fb8dc89e.mjs:6
createFetchError — ohmyfetch.fb8dc89e.mjs:18
onError — ohmyfetch.fb8dc89e.mjs:96
asyncFunctionResume
(anonyme Funktion)
promiseReactionJobWithoutPromise
promiseReactionJob

Now within the Nuxt-auth module, the init-function is being triggered.

[Log] Logging in (auth.mjs, line 109)
[Log] Redirecting in init method (auth.mjs, line 72)
[Log] Redirecting to – {name: "logout"} (auth.mjs, line 250)
[Error] Failed to load resource: the server responded with a status of 401 (Unauthorized) (login, line 0)
[Log] error -> this.callOnError (auth.mjs, line 121)
[Log] FetchError: 401 Unauthorized (http://web.example.test/backend/login) (auth.mjs, line 122)
[Log] Promise.reject(error) (auth.mjs, line 124)

So for some reason, on a login attempt with wrong credentials, this part is triggered: https://github.com/Teranode/nuxt-module-alternatives/blob/master/%40nuxtjs-alt/auth/src/runtime/core/auth.ts#L113

[Denoder]

try the update i pushed

[ahoiroman]

Hm, no... I am not sure what changed, as I don't see the changes here in the repo atm.

[sumitkolhe]

@Teranode v2.0.22 doesn't seem to solve it

[Denoder]

one more time 2.0.23 I think it has to do with the routeOption util so I'm hoping this fixes it.

[sumitkolhe]

@Teranode unfortunately, doesnt work with v2.0.23 too

[Denoder]

@ahoiroman what does your login page template look like?

[ahoiroman]

The 2.0.23 does not solve the problem here.

My login page is pretty condensed to

<template>
    <div class="flex min-h-screen p-8">
        <div class="space-y-6">
            <div>
                <label>Email</label>
                <div class="mt-1">
                    <input v-model="form.email" name="form.email"/>
                </div>
            </div>
            <div class="space-y-1">
                <label class="block text-heading-base text-sm text-gray-800" for="form.secret">
                    Secret
                </label>
                <div class="mt-1">
                    <input v-model="form.secret" name="form.secret"/>
                </div>
            </div>
            <button @click="onSubmit">SignIn</button>
        </div>
    </div>
</template>
<script setup>
definePageMeta({
    auth: 'guest',
    title: 'Sign In',
    layout: 'blank'
});

const {$auth} = useNuxtApp();

const form = ref({
    name: null,
    email: "",
    secret: null
});

function onSubmit() {
    $auth.login({
        body: {
            name: form.value.name,
            email: form.value.email,
            secret: form.value.secret
        }
    })
    .catch((e) => {
        console.log(e)
    });
}
</script>

I removed all other components, validations etc. that could possibly interfere with nuxt-alt/auth.

[Denoder]

Im really not reproducing the issues you are having.

[Denoder]

I've updtaed github with the changes so far.

[ahoiroman]

@sumitkolhe you had the same problem? I will try to create a reproducer this weekend, but I can't promise.

[sumitkolhe]

@ahoiroman yes, on wrong credentials it takes to the path specified in logout route, for me, even on right credentials it does the same but once the server returns with 200 response, it redirects properly.

so, if login page : /auth/login and logout url : /auth then on wrong creds, it will redirect to /auth,

while for right creds : /auth/login -> /auth -> /dashboard

no matter right/wrong creds it initially redirects to the logout route

[Denoder]

@ahoiroman add middleware: ['auth'] to definePageMeta?

Nvm realised you are using globalMiddleware

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.