I'm trying to connect a Nuxt PWA with Django REST framework with Bearer auth.
I need to change the keyword "Bearer" for "token" on Nuxt.
Nuxt Auth v4 gives me:
Authorization: Bearer ba0bd40f588e...
I need
Authorization: token ba0bd40f588e...
My nuxt config:
auth: {
strategies: {
local: {
endpoints: {
login: { url: 'api-token-auth/', method: 'post', propertyName: 'token' },
user: { url: 'user', method: 'get', propertyName: false },
logout: false,
},
},
},
resetOnError: true,
scopeKey: 'groups',
},
I already tried:
token: {
property: 'token',
type: 'token',
name: 'token'
},
I remember this was possible, please help
Related
i work hard in implement #nuxt/auth-next with refreshToken ,i wrote with docs. It didn't work. Here is my nuxt.config.js
local2: {
scheme: 'local',
user: {
property: 'user',
autoFetch: true,
},
refreshToken: {
property: 'refresh_token',
data: 'refresh_token',
required: true,
},
endpoints: {
login: {
url: '/user/login/',
method: 'post',
propertyName: 'token',
},
logout: { url: '/user/logout', method: 'post' },
user: { url: '/user/me', method: 'get', propertyName: 'token' },
refresh: {
url: '/user/refreshToken',
method: 'post',
// propertyName: 'refreshToken',
},
},
},
I am using nuxtjs/auth for login and logout of mu users. When I login, I receive this from the backend:
return JSONResponse({
'result': True,
'token_type': 'bearer',
'access_token': *****})
:cookie(key="refresh_token", httponly=True)
So the refresh token is in cookies already. How can I use it within the nuxtjs/auth?
My nuxt.config.js looks like:
auth: {
strategies: {
local: {
token: {
property: 'access_token',
global: true,
maxAge: 1800,
type: 'Bearer'
},
user: {
property: 'userID',
autoFetch: true
},
endpoints: {
login: { url: '/api/v1/auth/login', method: 'post', headers: { 'Content-Type': 'application/x-www-form-urlencoded' } },
logout: false,
user: { url: '/api/v1/auth/get_cur_user', method: 'get' }
}
}
}
}
I am attempting to get Nuxt.js to work with cookie authentication. I am using nuxt-auth with cookie setting. Laravel Backend with Passport.
The reason I need to use Cookies is because I plan on having the nuxt project be on my main domain name (with login) and then having app.mydomainname.com for the actual application. The main website has public facing pages that use authentication as well.
Here is my config for nuxt.js for nuxt-auth:
auth: {
local: false,
redirect: {
login: "/login",
logout: "/login",
callback: "/login",
home: false,
},
strategies: {
cookie: {
token: {
property: "data.access_token",
},
user: {
property: "data",
},
endpoints: {
login: {
url: "v1/auth/login",
method: "post",
propertyName: "access_token",
},
logout: { url: "/v1/auth/logout", method: "delete" },
user: { url: "/v1/settings", method: "get" },
},
},
},
},
Login works fine, but then the cookie does not set when I look in my editthiscookie chrome plugin, thus the call to /settings does not work:
As you see the cookie is just being set to true and not the access token.
Any help with the configuration would be helpful.
Thanks
Figured it out. I had to set set required: true and type: "Bearer" in the token config.
So it looks like this now:
auth: {
redirect: {
login: "/login",
logout: "/login",
callback: "/login",
home: false,
},
strategies: {
local: false,
cookie: {
token: {
property: "data.access_token",
required: true,
type: "Bearer",
},
user: {
property: "data",
},
endpoints: {
login: {
url: "v1/auth/login",
method: "post",
},
logout: { url: "/v1/auth/logout", method: "delete" },
user: { url: "/v1/settings", method: "get" },
},
},
},
},
I'm using Nuxt auth, but I don't have an endpoint for the user, in nuxt.config is set the endpoint to be false and after loginWith I'm jest setting the user manually.
The issue is that after refresh I'm logged in but I don't have any user info (name, email...) what I'm I missing here?
nuxt.config file:
auth: {
strategies: {
local: {
endpoints: {
login: {
url: '/api/users/login/',
method: 'post',
propertyName: 'token',
},
logout: { url: '/api/users/logout/', method: 'post' },
user: { url: '/api/users/auth/', method: 'post' },
// user: false,
},
autoFetchUser: false,
tokenName: 'Authorization',
tokenType: 'Token',
// tokenRequired: true,
// globalToken: true,
},
},
},
login form file
const { data } = await this.$auth.loginWith('local', {
data: { username: this.email, password: this.password },
});
this.$auth.setUser(data);
When you logged in, user info will return from login data, when you refresh there is no endpoint for user, then auth plugin cant retrieve your user info, so you must do it manually and setUser yourself
After calling $auth.loginWith('google'), I am getting
http://localhost:3000/ru/user-registration#state=D7xooLsNNxNGfbvcQMU5g&access_token=ya29.a0Ae4lvC2z0XERgeRUipmu7c205WWCCSVgRZ-s_mYWg6ZoMgCGzVZ-U69arfpn-ybm5kthqtvqQrD7lGYmNDqiLtkW1aIecP6Wp-bwINMok3ztNcW5KwmlohLmtnbk4IZVkciKfb8T_JUtf89xpJcjpt2dSx_09FPGSKc&token_type=Bearer&expires_in=3599&scope=email%20profile%20openid%20https://www.googleapis.com/auth/userinfo.email%20https://www.googleapis.com/auth/userinfo.profile&authuser=0&prompt=consent as a callback. What should I do next in order to get the info of the registered gmail. Any help or ideas are welcome
auth part in my nuxt.config.js
auth: {
strategies: {
local: {
endpoints: {
login: { url: "token/", method: "post", propertyName: "access" },
user: { url: "user/me/", method: "get", propertyName: false },
logout: false,
}
},
google: {
client_id: 'my_client_id',
redirect_uri: 'http://localhost:3000',
}
},
},
In your nuxt.config.js file you declare two differents strategies: local and google. If you would like to use Google as an identity provider you don't need to precise the endpoints.
Here is my actual config for one of my project:
auth: {
redirect: {
login: '/login',
logout: '/login',
home: '/',
callback: '/callback'
},
strategies: {
google: {
client_id: 'XXXXXxxxx.apps.googleusercontent.com'
}
}
}
And I have specified on Google API Console the following authorized URI: localhost:3000/callback for my dev environment and mydomain.com/callback for the prod.