Nuxt Auth redirects (login/logout/home) not working #437
Comments
ghost
added
the
|
I have the same issue. In my case I have |
|
To be honest... that issue led me to abandon vue / nuxt totally !! On simple things like that not working and no signs that it'll be fixed... when using passport js is just so simple... out of nuxt I moved to Angular ... good luck guys |
|
I understand your struggle. Actually, I didn't know that there is a separate auth module in Nuxt and initially I wrote my own middleware where I was detecting the requested path and redirecting to the root path if my authenticated user was not allowed to see that specific page. But when I found this module, I started to use its interface and everything worked perfectly until I deployed my app to production and encountered this issue. Maybe you should've given more chances to Nuxt. |
This comment has been minimized.
This comment has been minimized.
|
Is there something like Nuxt / Next built on top of Angular? |
|
Le 15 sept. 2019 à 11:52, Mahram ***@***.***> a écrit :
Is there something like Nuxt / Next built on top of Angular?
there is much more... but universal angular amongst others :)
|
|
Maybe it is late according to the previous comments but I had some problems with the logout redirect too. I was able to redirect and avoid this problem calling the auth logout method
|
|
I had this behavior in my app and in my case the reason was something you also have in your sandbox in |
|
thanks vakrolme but this doesn't fix the problem of letting access to pages that shouldn't let you in as wen one clicks on |
When I looked at the doc back then, it said that you had to specify auth: false; |
|
But as I said earlier... 4h after switching to Angular I had all this working like a charm... and was further in my app then in 1 week with nuxt... |
|
I've been struggling the same problem and after taking a look into the source of auth-module I have figure out the configuration and it works, you can take a look here https://codesandbox.io/s/nuxt-starter-n4b6v-n4b6v |
|
I've achieved
const path = this.$auth.$storage.getUniversal('redirect') || '/';
this.$auth.$storage.setUniversal('redirect', null);
this.$router.push(path);Note that this feature is not tested enough and so buggy. We need to improve it. |
|
Line 58 in 8546634 The problem is with this line. It check whether current page enable When I remove https://auth.nuxtjs.org/api/options.html#redirect
Maybe it could be an option to disable this behavior. The problem when login, on the other hand, is weird. It make sense to think you would have to disable Can any person of the core team explain why this check is necessary while login or it's a bug? If the check is necessary, maybe add a note to the docs about you can't disable |
|
Nice job to have figured this out.
But how about ditching all that crap and just have something like nuxt-community/passport
It could be more useful... and probably a complet rewrite could give it a chance to get somewhere useable a bit further than just to get "what I need write now to work, the rest we'll see later"... Isn't it wordpress world philosophy?
How many dev contributing to nuxt are actually in search of a wordprout alternative?
It's impossible to think out of the box from within the box...
I think working with angular could open the box for many nuxt dev...
It's what happened to me, and since, each time I have to deal with nuxt, it just reminds me of wordpress...
I think you made a good analysis of the problem, so you have to be pretty smart to have worked this out and perhaps your time is too precious to continue bother with nuxt :)
Regards
… Le 6 févr. 2020 à 02:50, jasonlyu123 ***@***.***> a écrit :
https://github.com/nuxt-community/auth-module/blob/85466345311bf882ae2f603ba43ef1dc638d2cdb/lib/core/auth.js#L58 <https://github.com/nuxt-community/auth-module/blob/85466345311bf882ae2f603ba43ef1dc638d2cdb/lib/core/auth.js#L58>
The problem is with this line. It check whether current page enable auth middleware to see has right to stay on current page when logout. But I can't figure out the point of this check when login.
When I remove auth: false, or use auth: 'guest' the redirect works.
https://auth.nuxtjs.org/api/options.html#redirect <https://auth.nuxtjs.org/api/options.html#redirect>
The problem origin post encounter is actually specified in the docs. you'll only be redirect when
after logout, current route is protected.
Maybe it could be an option to disable this behavior.
The problem when login, on the other hand, is weird. It make sense to think you would have to disable auth middleware to prevent infinite redirect on login page. But you actually don't have to do that. When you disable it, it'll prevent the redirect. It not a straightforward behavior.
Can any person of the core team explain why this check is necessary while login or it's a bug?
If the check is necessary, maybe add a note to the docs about you can't disable auth middleware in login page. If it's a bug. How to fix it is a problem, just disable the check in login would result in different redirect page if the fallback redirect dev added after login is different.
—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub <#437?email_source=notifications&email_token=AA7DNJLC6SL46D3FDNKB7ULRBOQKVA5CNFSM4IR2HXA2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEK6ASBI#issuecomment-582748421>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AA7DNJJRB73GHJ6ST22YH23RBOQKVANCNFSM4IR2HXAQ>.
|
|
woa dude alm down its not an nuxt issue.. I fixed it like and then in my login method its not 100% working maybe you can add check on mounted/created and redirect |
|
how is anybody suppose to guess such a trick ?
And altho it's not a nuxt issue, it's common in all the nuxt eco-system.
I got more done by 3rd day working with angular than after 3 month fighting with nuxt...
It's just an advice I gave you...
If you want to waist energy on hacking a framework to get it to do such an exotic thing as using auth :-/
But for anyone reading here... lets not lead them into heal.
To be honest, nuxt has some nice sides, but don't believe one second it's easier than angular.
And if you need auth in your app, using nuxt, be prepared to go threw hell.. unless you don't care auth feeling very bugus.
At some point, who cares, if you rely on api auth to handle the real security, it's just the interface that will behave bugus.
Then one can hack it to feel better, and what happens when nuxt will overcome thos issue, need to unhack it? In a few years, it'll be fun to remember what the story was...
… Le 6 févr. 2020 à 12:19, Marko Bolliger ***@***.***> a écrit :
woa dude alm down its not an nuxt issue..
I fixed it like
redirect: {
home: false
},
and then in my login method
await this.$auth.loginWith('local', {
data: this.login
})
this.$router.push(this.localePath({ name: 'dashboard' }))
—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub <#437?email_source=notifications&email_token=AA7DNJLL6K6ACVYT4Q7HISLRBQS7FA5CNFSM4IR2HXA2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEK7S2JY#issuecomment-582954279>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AA7DNJNVCT74SBI74VOOTVDRBQS7FANCNFSM4IR2HXAQ>.
|
|
Now it's my personal opinion and advice for new arrivers to nuxt... move on to angular, you'll save your time, your nerves and your energy... Edit: |
|
@cantoute Your comment is very dangerous, you are selecting and encouraging a technology, it is based on your inexperience or frustration. If you come from Wordpress, the thought of installing and using is hurting you and if you say that you did it faster in Angular, it is because capable your previous way of working adapted to that, and I understand the frustration you have hate towards a technology, but one knows that it has matured when it leaves that hatred back and returns to keep learning. About your issue:
|
|
@cantoute I do like angular's robustness and appreciate the featureful ecosystem Google and angular's team has provided. I personally would prefer to do my own project in angular. |
|
I am facing an error where, after I am successfully logged in, I should get redirected to /my-account. But I get redirected to /logged-out, then shortly after, I get redirected to /my-account. |
|
I believe I so far solved most of my problems with the auth module. Would be nice to be able to handle redirects and middleware yourself though, for ultimate control. Anyhow, I figured after changing certain settings, I had to shutdown development server and boot it up again for changes to take effect. |
|
I am still facing this error. After successful login once I refresh a secured page, I get redirected to login page. Is there a workaround for this problem? |
|
@HappyStore Are you using ssr? I have a maybe similar problem with ssr mode but it's not related to this topic. The problem is that auth module make a request on server to fetch user data and the request got rejected due to self-signed ssl certificate and no error is thrown. |
Hmm, once I removed "user" endpoint it worked as expected. Could be SSR problem you mentioned. Thank you! |
I never have that problem, can you make a repo with the code and example of the response of your api.. |
|
I have same problem. Make sure user endpoint gets the user object correctly. If your user api responds the whole user object set the propertyName to false to tell Nuxt to directly use API response. |
|
Came here to find a way to redirect my users only to find angular spam. To the issue: |
This comment has been minimized.
This comment has been minimized.
|
@cantoute @mjzarrin @la-jamesh I made this video to test the module and see all normal. If your have some config to test or fix, send me here or in private @MrJmpl3 in Twitter, to made another video https://www.youtube.com/watch?v=uYZBoCDMZ4I&feature=youtu.be |
|
This is not a good idea, but it works for me: |
|
Guys, this is most likely because your user routes are not defined correctly. Auth does not work if user object is not fetched correctly. If you don't need user object, you have to set user route to false. And you, mister Angular, in your codesandbox I don't see any routes defined. |
|
cool :)
just it took so long I gave up...
And I continue following this thread as solving this will help many avoiding same disaster I had to go threw.
And perhaps when this is solved I'll consider using nuxt on other projects :)
… Le 3 mai 2020 à 09:11, Fyroman ***@***.***> a écrit :
Guys, this is most likely because your user routes are not defined correctly. Auth does not work if user object is not fetched correctly. If you don't need user object, you have to set user route to false.
And you, mister Angular, in your codesandbox I don't see any routes defined.
—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub <#437 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AA7DNJILDHZRMW6RLCPL6T3RPVUO5ANCNFSM4IR2HXAQ>.
|
🤔 I made a video and all was correct, nobody make a comment about my video 😥 |
This comment has been minimized.
This comment has been minimized.
|
Please, don't fight, If this report don't help to fix the bug or the reporters don't want to help to fix, I recommend close, maybe another people create new report with more info or with more expectations in helping. |
|
revisiting this it looks like I'm only having issues when deployed to AWS via serverless/fastify. Running locally through |
|
Thanks for all helps. Closing as there are enough answers to the original question. Let's keep nuxt community a friendly place ❤️ v5 branch is also under heavy development and improvements including a more stable loggedIn state (#620) and many more improvements by @JoaoPedroAS51. Please open a new issue with proper reporo in case you had similar issues :) |
|
for me all suggestion didn't work. The login was succeeding, everything set to local storage but no redirection to the correct page. Checked all I could and didn't work. Then I remembered one other project I worked with nuxt and found the solution and here I share it my backend was sending back something like async login () {
try {
const response = await this.$auth.loginWith('local', {
data: {
username: this.username,
password: this.password
}
})
if (response.data.success === true) {
this.$auth.setUserToken(response.data.token)
}
} catch (err) {
console.log(err)
}
} |
|
@mtangoo What does your configuration look like? |
|
Here we go! |
|
I think it's because of autoFetchUser: false. Might as well set user endpoint to "false" since it seems like you don't really use it. If you have user endpoint defined, from what I understand nuxt-auth expects user to be fetched and only after that does it set the "loggedIn" state. If that doesn't happen, it won't consider you logged in and will not proceed with redirects. So if you don't need the user object, just set the endpoint to "false" and it will not expect it to be called. |
No I use it. But it was annoying that when login failed it would request user anyway (My login endpoint is return always 200 with login status in JSON reponse) So I had to turn it off for automatic but I use it |
But why does refresh work? |
Hi @mtangoo! I believe one solution would be creating a custom scheme that extends Before creating the custom scheme, you will need to add
build: {
transpile: ['@nuxtjs/auth']
}With this set up, you can create your scheme file.
import LocalScheme from '@nuxtjs/auth/lib/schemes/local'
export default class CustomLocalScheme extends LocalScheme {
// Override `login` method of `local` scheme
async login (endpoint) {
if (!this.options.endpoints.login) {
return
}
// Ditch any leftover local tokens before attempting to log in
await this.$auth.reset()
const { response, result } = await this.$auth.request(
endpoint,
this.options.endpoints.login,
true
)
// If not succeeded, bail
if (!response.data.success) {
return
}
// Set token if `tokenRequired` is enabled
if (this.options.tokenRequired) {
const token = this.options.tokenType
? this.options.tokenType + ' ' + result
: result
this.$auth.setToken(this.name, token)
this._setToken(token)
}
// Fetch user if `autoFetchUser` is enabled
if (this.options.autoFetchUser) {
await this.fetchUser()
}
return response
}
}Then set your new scheme in the auth config.
auth: {
strategies: {
local: {
_scheme: '~/schemes/customLocalScheme',
/* ... */
}
}
} |
|
I will try that one. Makes life easy sharing with projects |
|
For those who like me got stuck on why their own redirection was going through home page even with the home: false await this.$auth.loginWith("local", { data: { email, password } })
// i get a specific URL to redirect to from my user response
const url = this.$auth.user.url
this.$router.push(`/${url}`)Switching to logout: false instead made the job (makes no sense but it's working for now). My auth config : auth: {
redirect: {
login: "/login",
logout: false
},
strategies: {
local: {
endpoints: {
login: {
url: "/users/login/token",
method: "post",
propertyName: "token"
},
user: { url: "/users/login/me", method: "get", propertyName: "user" },
logout: { url: "/api/auth/logout", method: "post" },
}
}
}
} |
Also, I want to note that the "auth" option must be used on layouts, not on pages ( I was doing it wrong ) for this to work. |
|
Yeah. I tried to submit a PR to update the doc but not been accepted. Maybe you can try it. |
|
I had a similar problem. I had to redirect the user depending on the Role (User or admin), so, the solution of just writing one common redirection did not work for me. I did the following, I have created a vue page called redirect.vue and there I wrote a middleware that checks the role of the user in order to redirect to the correct page (getting the users info from the vuex store), this solution may not be the best one but works. I hope this help someone! redirect.vue (page): redirect_middleware.js (middleware) Note: For this to work, make sure that in the users table is a field called "role" auth object inside nuxt.config.js From Colombia to the world! :) |
|
I get 'this page could not be found` This shit is annoying |
Create the page that is not found, under /pages directory. If you need any help. just reply! |
Hi, I found out it is due to What i did on 'nuxt-i18n' was to disable the However, im having issues with the module as it continually says the local strategy is not defined Ive been trying to play with the options to try and get it to work and have had no luck. |
|
In my company we develop large-scale apps in Angular and React and our customers are public sectors of countries. I tell you now: Angular is a MESS/HELL of observables, subscriptions. services, modules etc Nuxt.j is GREAT and saves you a lot of time when developing large applications |
|
@cantoute could have a more positive and collaborative approach. That said, I used Nuxt.js for the first time in 2017, have been using it since from time to time, and I kinda understand the frustration: authencation was as much a pain 3 years ago as it is now in Nuxt.js. It still needs hours of debugging / figuring out / is not robust, reliable or flexible. It's such a pain that this is the main reason I hear for ruling nuxt out of a project. In the end, this is a big show of lack of maturity.... And this is too bad because Nuxt deserves love for so many other reasons ! @Atinux @pi0 @JoaoPedroAS51 I'm only suggesting here, but IMHO, it'd deserve much much more attention from Nuxt core team. This might seem like a nice2have module for Nuxt, but it's as much a complex subject for beginners/the community as it is a VERY VERY basic need for most project. Also, with the insanely growing usage of GraphQL, some synergy with apollo-module would make sense |
|
Dear @syffs indeed auth module deserved much more attention in the past and specially @JoaoPedroAS51 helped a LOT for upcoming v5. Unfortunately still majority of code-base is legacy and accepting new PRs based open usually made more new regressions. Anyway i apology on behalf of nuxt team we couldn't allocate enough time so far and that certainly needs improvements. (and locking issue since it is known issue) |
and others
Version
v4.8.1
Reproduction link
https://codesandbox.io/s/codesandbox-nuxt-0vhpu
Steps to reproduce
On bare simple setup
empty store.js
nuxt.config.js
but seems only
loginredirect works... and in some rare caseslogoutbutlogout()can leave you on current page even if it required auth (when at worse it should at least take you back to login...)if redirect.logout or redirect.callback points to a page that has
middleware: ['auth']then those pages can then be opened without requiring authcouldn't get
rewriteRedirectsto work either... tried all combinations watchLoggedIn/rewriteRedirectsWhat is expected ?
short version that redirects work...
when
auth.watchLoggedIn === trueafter login() that user is redirected to
auth: redirect.homeafter logout that it kicks you out if you where on a require auth page
in codesandbox fiddle logout() from /app takes you back home... this is not happening in my project where it lets you on /app route giving the "Oupps"
(could it be i've got a slow old computer? I actually have issues too of
npm run devfreezing and this doesn't happen on faster machines)when
auth.rewriteRedirects == truethat user is sent back to page he asked in first place
What is actually happening?
sometimes logout redirects (only when called from a page that didn't require auth... which isn't the common case)
lets logged out users open the current
auth requiredpageroutes mentioned as
auth.redirect.logoutorauth.redirect.callbackbecomes open to everybody no mater if had required auth.The text was updated successfully, but these errors were encountered: