MLDMoritz posted a new question
auth-module •
Hey,
to support a RESTful way it should be possible to supply a user parameter.
endpoints: {
login: { url: '/token/generate', method: 'post' },
refresh: { url: '/token/refresh', method: 'post' },
user: {
url: '/users/{user.id}', <-------------------------------------------
method: 'get'
},
logout: { url: '/token/logout', method: 'post' }
}
Whiled0S posted a new bug report
auth-module •
https://github.com/nuxt-community/auth-module
Nuxt auth module will make a request ON SERVER SIDE and BEFORE RENDER CONTENT set variable loggenIn to appropriate value.
Nuxt auth module makes authentication request on client side and re-renders page, it leads to problems with ssr.
I don't know why, but when I build application and deploy it to production – everything works fine and I don't see any client-side requests, but only in dev mode on my laptop (osx) I have this annoying trouble – it makes my development painful. I also want to provide my project stack and difference between production machine and local. Project stack – symfony as backend api and nuxt as frontend. Symfony and database are working in docker and it's too slow (popular issue on macOS – https://github.com/docker/for-mac/issues/2707). On my production machine I'm using ubuntu, symfony and database are working without docker.
My nuxt config for auth module:
auth: {
strategies: {
local: {
endpoints: {
login: {
url: '/userapi/authenticate',
method: 'post'
},
user: {
url: '/userapi/authenticated_user',
method: 'get',
propertyName: 'email'
},
logout: {
url: '/userapi/logout',
method: 'delete'
}
},
tokenRequired: false,
tokenType: false
}
},
watchLoggedIn: false,
redirect: false
},
Request that is sent on initial loading (reload page, already has valid cookie for authentication):
Errors which I have in console:
imansuparman posted a new question
auth-module •
Sorry it's my first time to ask something in public repository.
How to implement Basic Auth in this module?
cardaddy posted a new question
auth-module •
I'm using the authorization_code grant and I'm wondering how to handle logins when end users go directly to the authorization page external to my nuxt app?
My nuxt application sits behind a gateway utilizing the same hostname for both my nuxt app and my authorization server. If the user bookmarks or navigates directly to the authorization server login page and authenticates, a session cookie is created and stored with the domain. When the user navigates back to the nuxt app, they are not logged in due to the fact the authorization_code grant hasn't been executed from nuxt.
What is the recommended way of handling this use case? Is there an auto login function I could add to the nuxt login page forcing the authorization_code grant to execute on page load?
matamune94 posted a new question
auth-module •
i have 2 node for 2 domain , ex: 127.0.0.1:3000 vs 127.0.0.1:3001
WikiWookie posted a new bug report
auth-module •
https://jsfiddle.net/e7mdn0to/
Create basic project with create nuxt app. Set up auth module. Add simple secure route page. Add the social config to the nuxt config in the jsfiddle. Log in with your google account.
Redirect to secure route.
Redirect to main page becuase loggedIn property is false.
Tried debugging with debugger to see why loggedIn isn't set to true, but can't pinpoint the problem or where vuex initializes the auth object upon initial load.
frenchrabbit posted a new bug report
auth-module •
1) Install auth-module in Nuxt project with vue, use following config:
auth: {
watchLoggedIn: true,
resetOnError: true,
cookie: false, // <--- no cookie, only localStorage, '/personal' section of site wich need authorization runs with serverMiddleware setting mode: 'spa'
redirect: false,
strategies: {
local: {
endpoints: {
login: { url: '/api/login/', method: 'post', propertyName: 'token' },
logout: false,
user: {
url: '/api/user/',
method: 'get',
propertyName: 'user',
}
},
tokenRequired: true,
tokenName: 'Authorization',
tokenType: 'Bearer'
}
}
},
note that in documentation: vuex.namespace option is set to 'auth' by default…
2) run $auth.login() then do $router.push('/personal')
3) in /pages/personal/index.vue mounted we have:
console.log('USER', this.$auth.user, this.$auth.loggedIn, this.$store.state.auth.user, this.$store.state.auth.loggedIn)
this.$auth.user, this.$auth.loggedIn to show real value equal to this.$store.state.auth.loggedIn, this.$store.state.auth.user
token is used, /api/user/ and all other endpoints with checks for token is returning data correctly.
this.$user.getToken() also seems to work.
however console.log('USER', this.$auth.user, this.$auth.loggedIn, this.$store.state.auth.user, this.$store.state.auth.loggedIn)
gives me:
USER null false {…} true
adding
async asyncData({ $axios, store, redirect, $auth }) {
await $auth.fetchUserOnce()
}
shows correct request but nothing changed.
Looks like storage engine (lib/core/storage.js) works incorrect. Stores data to my vuex store, but can't read from state directly.
While token seems to be stored using setUniversal/getUniversal, and is correctly setted in nuxt-axios instance headers.
if I add console log in lib/core/auth.js setUser
and get user ()
I see following after call login:
> setUser false
> setUser {_id: "5dd65ff098711f313c3be6e6", email: "...",…} // several times in between goes my route push
> get user() this.$state
loggedIn: false
strategy: "local"
user: null
> get user () this.$storage._useVuex.state.auth // storage.js this._useVuex = this.options.vuex && this.ctx.store leaves store there....
busy: false
loggedIn: true
strategy: "local"
user: Object
after refreshing page Cmd+R data reveals correctly.
DjustinK posted a new bug report
auth-module •
https://github.com/nuxt-community/auth-module
Setup nuxt with typescript.
Install auth module @nuxtjs/auth @nuxtjs/axios @types/nuxtjs__auth
Configure auth0 provider https://auth.nuxtjs.org/providers/auth0.html
Setup login and callback routes.
Generate static.
Run http-server ./ in the dist folder.
Open browser and login (localhost:3000)
The user should be authenticated after auth0 redirects to the callback.
Auth0 redirects to /callback, but the user is not authenticated.
Running the application normally (without static) works.
Setting mode to universal
or spa
has no effect.
ThatKawaiiSam posted a new feature request
auth-module •
I have had an abundance of success adding Google, GitHub, and Facebook support to my user authentication system. I was having difficulties hooking into Twitter's authentication flow myself and was wondering if there will be any official support for Twitter logins and authorisation.
JohannesLichtenberger posted a new question
auth-module •
Hi,
I currently have to following Configuration:
auth: {
strategies: {
keycloak: {
_scheme: 'oauth2',
authorization_endpoint: 'http://localhost:8080/auth/realms/sirixdb/protocol/openid-connect/auth',
userinfo_endpoint: false,
access_type: 'offline',
access_token_endpoint: 'http://localhost:8080/auth/realms/sirixdb/protocol/openid-connect/token',
response_type: 'code',
token_type: 'Bearer',
token_key: 'access_token',
client_secret: '2e54cfdf-909b-47ca-b385-4c44886f04f0',
client_id: 'sirix',
grant_type: 'refresh_token'
},
},
redirect: {
login: '/login',
callback: '/callback',
home: '/'
},
},
Now my problem is that only confidential clients should be allowed to communicate with Keycloak. So, the token-endpoint needs the client_secret, but it's not sent with the standard OAuth2 schema of Nuxt.js. How can I override this behavior? I'm really new to front-end webdev and if I'm using a Vert.x API backend as an indirection I got everything up and running, but not with Node.js directly communicating with Keycloak. However the Vert.x based REST-API only needs the generated JWT-tokens, to check authentication. It would have to be added here:
Just as for the other providers :-) Or we could add a Keycloak provider?
arjusmoon posted a new question
auth-module •
HI,
I was trying to integrate facebook login using nuxt facebook auth module. But even after following the steps mentioned in the documentation of nuxt , i'm getting an error saying that
TypeError: Cannot read property 'loginWith' of undefined
at VueComponent.fbAuth
My nuxt.config.js file looks like this
auth: {
strategies: {
facebook: {
clientid: '*',
userinfoendpoint: 'https://graph.facebook.com/v2.12/me?fields=about,name,picture{url},email,birthday',
scope: ['publicprofile', 'email', 'userbirthday'],
redirect_uri: 'http://localhost:3000/callback'
},
}
}
And I'm calling the this.$auth.loginWith("facebook") on a button click
Please help. Thanks
johnmcguin posted a new question
auth-module •
I have an issue where I am having a hard time proxying requests with this module. In my vue component, if I call this.$auth.loginWith('local', payload), the network request issues a POST to localhost:3000/api/auth/login, while I am looking for the request to be made to localhost:3333/v1/auth/login. I am at a loss as to how to debug this, so any help is greatly appreciated 🙏. Below are some key components of the nuxt config:
modules: [
'@nuxtjs/axios',
'@nuxtjs/pwa',
'@nuxtjs/auth',
'@nuxtjs/proxy'
],
axios: {
proxy: true
},
proxy: {
'/api/': {
target: process.env.API_PREFIX || 'http://localhost:3333/v1',
pathRewrite: { '^/api/': '' }
}
},
auth: {
strategies: {
local: {
endpoints: {
login: {
url: '/api/auth/login',
method: 'post',
propertyName: 'accessToken'
}
}
}
}
},
kevintechie posted a new bug report
auth-module •
https://github.com/nuxt-community/auth-module/tree/dev/examples/demo
token_key
to id_token
access_token
from local storage in the browser dev toolstoken_use
attribute is set to "access"When configured for id_token
, the auth module should store the id_token
. This can be verified by decoding the stored JWT and checking the token_use
attribute. The token_use
attribute should be set to "id".
When auth module is configured for id_token
, the access_token
is stored.
The problem is on line 166 on the master branch:
if (data.access_token) {
token = data.access_toke
}
The if statement should use the value of token_key
to select which key to store. For example:
const token_key = this.options.token_key || 'access_token'
if (data[token_key] {
token = data[token_key]
}
token_key
could be set to access_token
in options defaults.
vanderb posted a new question
auth-module •
Hi,
is there a way to add a silent-login-method without redirecting to login-page?
Example:
Thanks,
vanderb
rodrigoo-csantos posted a new question
auth-module •
Some way to implement password grant type of Laravel passport support ??
atymic posted a new bug report
auth-module •
Visit a protected route by clicking a nuxt-link
, and it loads correctly.
Then refresh the page
Protected page loads
Redirect to login
Hi!
I'm a bit confused as to why this is happening. I'm using a pretty basic set up (local scheme, universal storage).
As soon as I refresh the page, I'm redirected (302 from nuxt) to the login page. I did a bit of debugging and this seems to be because loggedIn
isn't set in the cookie state.
All of the other cookies are there, but i'm still redirected :(
I'll do some more digging and try find some more info & a repro
JohannesLichtenberger posted a new question
auth-module •
Here's my branch:
https://github.com/sirixdb/sirix-web-frontend/tree/oauth2-auth
Now I'm having trouble with Chrome, Nuxt.js, Keycloak and CORS. It says that Origin null is not allowed, but "Web Origins" in Keycloak is set to http://127.0.0.1
My journey so far:
lromor posted a new question
auth-module •
Hi,
after the user properly logs in say with google/facebook, how would you start a session with your backend?
Thank you,
-l
jpbamberg1993 posted a new question
auth-module •
When I login using auth0 everything works fine.
In my Vuex state there is an object named auth
that contains loggedIn: true
and user: userobject
and other good information.
It however does not contain the jwt access_token
. Which I need authenticate against my api.
How do I go about adding this access token to the the auth
object?
Am I looking at this completely wrong?
vakrolme posted a new bug report
auth-module •
I have a cookie-based flow, where Rails API (jwt_sessions) sends out an access token in a httpOnly cookie and a CSRF token in the response body. When access token expires, it can be sent to /refresh
endpoint, which responds with new cookie and tokens. This is made possible by a tweaked local strategy:
const DEFAULTS = {
tokenRequired: true,
tokenType: false,
globalToken: true,
tokenName: 'X-CSRF-TOKEN'
}
And a plugin for auth module:
$axios.onResponseError(async error => {
var response = error.response
if(process.client && $auth.$state.loggedIn && response.status === 401 && response.request._retry != true) {
const originalRequest = response.config
originalRequest._retry = true
const newToken = await $axios.post('/refresh')
if(newToken.data.csrf) {
$auth.setUserToken(newToken.data.csrf)
originalRequest.headers['X-CSRF-TOKEN'] = newToken.data.csrf
return $axios(originalRequest)
} else {
redirect(301, '/login')
}
} else {
return Promise.reject(error)
}
});
This works in SPA mode, but I also need to recover session on the server when the app is reloaded after access token expires. I want to get old expired tokens from the request cookie, refresh them, fetch the user on server side, and finally pass new tokens to the client. To do this I wrote the following code in strategy:
mounted () {
if (this.options.tokenRequired) {
const token = this.$auth.syncToken(this.name)
console.log("synced token is "+token);
this._setToken(token)
if (process.server){
const access = this.$auth.ctx.app.$cookies.get('jwt_access')
const csrf = this.$auth.ctx.app.$cookies.get('auth._token.jwtSessions')
if (access && csrf) {
// setting up retrieved CSRF token
this.$auth.setToken(this.name, csrf)
this._setToken(csrf)
// setting up one-time header with access token
this.$auth.ctx.app.$axios.setHeader('Authorization', access)
// fetching user
this.$auth.ctx.app.$axios.get('/me').then(me_response=>{
this.$auth.setUser(me_response.data)
}).catch(err=>{
// requesting new tokens
this.$auth.ctx.app.$axios.post('/refresh').then(response=>{
// setting new tokens to response cookie to be sent to the browser
this.$auth.ctx.app.$cookies.set('jwt_access', response.data.access, { httpOnly: true, maxAge: 64800, secure: false })
// setting up csrf token & header
// this.$auth.setToken(this.name, response.data.csrf) // uncommenting this results in "Cannot set headers after they are sent"
this._setToken(response.data.csrf)
// setting up one-time access token as a header (trying to rely on cookies resulted in old token being sent)
this.$auth.ctx.app.$axios.setHeader('Authorization', response.data.access)
// fetching user with new tokens
this.$auth.ctx.app.$axios.get('/me').then(new_response => {
console.log(new_response.data); // returns user when $cookie.set is commented out
this.$auth.setUser(new_response.data)
}).catch(err=>{
console.error(err);
})
})
})
}
} else {
return this.$auth.fetchUserOnce()
}
}
}
Server response is modified to hold a cookie with a new access token.
When $cookies.set
is commented out, $axios sends refreshed tokens to the /me
endpoint and returns the correct user.
But when I uncomment the $cookies.set
line, it errors:
ERROR Cannot set headers after they are sent to the client
at ServerResponse.setHeader (_http_outgoing.js:485:11)
at p (node_modules/cookie-universal/dist/cookie-universal-common.js:1:1399)
at Object.set (node_modules/cookie-universal/dist/cookie-universal-common.js:1:1836)
at node_modules/cookie-universal/dist/cookie-universal-common.js:1:2103
at Array.forEach (<anonymous>)
at Object.setAll (node_modules/cookie-universal/dist/cookie-universal-common.js:1:1987)
at server.js:955:43
at runMicrotasks (<anonymous>)
at processTicksAndRejections (internal/process/task_queues.js:93:5)
Cookie is not set.
Also tried this.app.ctx.res.setHeader('Set-Cookie', ['jwt_access='+response.data.access+' HttpOnly;']);
— similar result.