Authentication module for Nuxt.js
- Add
@nuxtjs/auth
dependency using yarn or npm to your project - Add
@nuxtjs/auth
and@nuxtjs/axios
tomodules
section ofnuxt.config.js
{
modules: [
'@nuxtjs/auth',
// ...Axios module should be included AFTER @nuxtjs/auth
'@nuxtjs/axios'
],
// Default Values
auth: {
user: {
endpoint: 'auth/user',
propertyName: 'user',
resetOnFail: true,
enabled: true,
method: 'GET',
},
login: {
endpoint: 'auth/login',
},
logout: {
endpoint: 'auth/logout',
method: 'GET',
},
redirect: {
notLoggedIn: '/login',
loggedIn: '/'
},
token: {
enabled: true,
type: 'Bearer',
localStorage: true,
name: 'token',
cookie: true,
cookieName: 'token'
}
}
Sets the global settings for store fetch action.
- endpoint - Set the URL of the user data endpoint. It can be a relative or absolute path.
- propertyName - Set the name of the return object property that contains the user data. If you want the entire object returned, set an empty string.
- resetOnFail - Automatically invalidate all tokens if user fetch fails. (Default is
true
) - method - Set the request to POST or GET.
Set the global settings for store login action.
- endpoint - Set the URL of the login endpoint. It can be a relative or absolute path.
Sets the global settings for store logout action.
- endpoint - Set the URL of the logout endpoint. It can be a relative or absolute path.
- method - Set the request to POST or GET.
- enabled (Boolean) - Get and use tokens for authentication.
- type - Sets the token type of the authorization header.
- localStorage(Boolean) - Keeps token in local storage, if enabled.
- name - Set the token name in the local storage.
- cookie (Boolean) - Keeps token in cookies, if enabled.
- cookieName - Set the token name in Cookies.
- notLoggedIn (Boolean) - Sets the redirect URL default of the users not logged in. Only when
auth
middleware is added to a page. - loggedIn (Boolean) - Sets the redirect URL default of the users logged in. Only when
no-auth
middleware is added to a page.
// ... code ...
// Do a password based login
store.dispatch('auth/login', {
fields: {
username: 'your_username',
password: 'your_password'
}
})
// ... code ...
store.dispatch('auth/logout') // run logout
// ... code ...
store.state.auth.token // get access token
// ... code ...
store.state.auth.user // get user data
// ... code ...
store.getters['auth/loggedIn'] // get login status (true or false)
// ... in nuxt.config.js ...
router: {
middleware: [
'auth', // If user not logged in, redirect to '/login' or to URL defined in redirect property
'no-auth' // If user is already logged in, redirect to '/' or to URL defined in redirect property
]
}
Copyright (c) Nuxt Community