Permalink
Browse files

feat: add auth0-js scheme

  • Loading branch information...
pi0 committed Feb 16, 2018
1 parent ec4ee25 commit c38a1e49946cb1d435fe28d534e31ebf6aa258e8
Showing with 473 additions and 79 deletions.
  1. +2 βˆ’1 examples/api/auth.js
  2. +2 βˆ’1 examples/demo/layouts/default.vue
  3. +15 βˆ’7 examples/demo/nuxt.config.js
  4. +5 βˆ’2 examples/demo/pages/login.vue
  5. +74 βˆ’52 lib/auth/auth.js
  6. +4 βˆ’3 lib/auth/plugin.js
  7. +93 βˆ’0 lib/auth/schemes/auth0.js
  8. +6 βˆ’3 lib/auth/schemes/local.js
  9. +1 βˆ’0 lib/auth/utilities.js
  10. +5 βˆ’2 lib/module.js
  11. +2 βˆ’0 package.json
  12. +264 βˆ’8 yarn.lock
@@ -34,7 +34,8 @@ app.post('/login', (req, res, next) => {
const accessToken = jsonwebtoken.sign(
{
username,
rand: Math.random() * 1000,
picture: 'https://github.com/nuxt.png',
name: 'User ' + username,
scope: ['test', 'user']
},
'dummy'
@@ -12,9 +12,10 @@
</b-navbar-nav>
<b-navbar-nav class="ml-auto">
<template v-if="$auth.state.loggedIn">
<b-nav-item-dropdown :text="$auth.state.user.username" right>
<b-nav-item-dropdown :text="$auth.state.user.name" right>
<b-dropdown-item @click="$auth.logout()">Logout</b-dropdown-item>
</b-nav-item-dropdown>
<b-img :src="$auth.state.user.picture" class="mt-1" rounded="circle" width="30px" height="30px" />
</template>
<template v-else>
<b-dropdown-item to="/login">Login</b-dropdown-item>
@@ -11,20 +11,28 @@ module.exports = {
extractCSS: true
},
serverMiddleware: ['../api/auth'],
modules: [
'bootstrap-vue/nuxt',
'@nuxtjs/axios',
'@@'
],
axios: {
proxy: true
},
proxy: {
'/api': 'http://localhost:3000'
},
auth: {
strategies: {
local: {
endpoints: {
login: { propertyName: 'token.accessToken' }
}
},
auth0: {
clientID: 'q8lDHfBLJ-Fsziu7bf351OcYQAIe3UJv',
domain: 'nuxt-auth.auth0.com'
}
}
},
modules: ['bootstrap-vue/nuxt', '@nuxtjs/axios', '@@'],
axios: {
proxy: true
},
proxy: {
'/api': 'http://localhost:3000'
}
}
@@ -16,7 +16,10 @@
</b-form-group>
<div class="text-center">
<b-btn @click="login" variant="outline-primary" size="lg">Login</b-btn>
<b-btn-group>
<b-btn @click="login" variant="outline-primary" size="lg">Login</b-btn>
<b-btn @click="$auth.strategies.auth0.login()" variant="outline-primary" size="lg">Login with Auth0</b-btn>
</b-btn-group>
</div>
</form>
</div>
@@ -42,7 +45,7 @@ export default {
},
methods: {
async login() {
return this.$auth.login({
return this.$auth.strategies.local.login({
data: {
username: this.username,
password: this.password
@@ -2,7 +2,7 @@ import Cookies from 'js-cookie'
import { parse as parseCookie } from 'cookie'
import getProp from 'dotprop'
import Vue from 'vue'
import { routeOption, isRelativeURL, isUnset, isSameURL } from './utilities'
import { routeOption, isRelativeURL, isUnset, isSet, isSameURL } from './utilities'
export default class Auth {
constructor (ctx, options) {
@@ -24,21 +24,16 @@ export default class Auth {
// Register vuex store
this._registerVuexStore()
// Reset on error
if (this.options.resetOnError) {
this._resetOnError()
}
// Watch for loggedIn changes only in client side
if (process.browser) {
this._autoRedirect()
}
// Sync token
this.syncToken()
// Restore strategy
this.syncUniversal('strategy', this.options.defaultStrategy)
// Set defaultStrategy
return this.setStrategy()
// Call mounted for active strategy on initial load
return this.mounted()
}
// ---------------------------------------------------------------
@@ -65,12 +60,6 @@ export default class Auth {
})
}
_resetOnError () {
this.onError(() => {
this.reset()
})
}
_autoRedirect () {
this.watchState('loggedIn', loggedIn => {
if (!routeOption(this.ctx.route, 'auth', false)) {
@@ -85,38 +74,42 @@ export default class Auth {
// ...Universal
setUniversal (key, value) {
setUniversal (key, value, isJson) {
// Local state
this.setState(key, value)
// Cookies
this.setCookie(key, value)
// Local Storage
this.setLocalStorage(key, value)
this.setLocalStorage(key, value, isJson)
}
getUniversal (key) {
getUniversal (key, isJson) {
// Local state
let value = this.getState(key)
// Cookies
if (isUnset(value)) {
value = this.getCookie(key)
value = this.getCookie(key, isJson)
}
// Local Storage
if (isUnset(value)) {
value = this.getLocalStorage(key)
value = this.getLocalStorage(key, isJson)
}
return value
}
syncUniversal (key) {
const value = this.getUniversal(key)
syncUniversal (key, defaultValue, isJson) {
let value = this.getUniversal(key, isJson)
if (!isUnset(value)) {
if (isUnset(value) && isSet(defaultValue)) {
value = defaultValue
}
if (isSet(value)) {
this.setUniversal(key, value)
}
@@ -154,19 +147,20 @@ export default class Auth {
// ...Local Storage
setLocalStorage (key, value) {
setLocalStorage (key, value, isJson) {
if (typeof localStorage !== 'undefined') {
if (isUnset(value)) {
localStorage.removeItem(key)
} else {
localStorage.setItem(key, value)
localStorage.setItem(key, isJson ? JSON.stringify(value) : value)
}
}
}
getLocalStorage (key) {
getLocalStorage (key, isJson) {
if (typeof localStorage !== 'undefined') {
return localStorage.getItem(key)
const value = localStorage.getItem(key)
return isJson ? JSON.parse(value) : value
}
}
@@ -186,7 +180,7 @@ export default class Auth {
}
}
getCookie (key) {
getCookie (key, isJson) {
if (!this.options.cookie) {
return
}
@@ -196,8 +190,9 @@ export default class Auth {
: this.ctx.req.headers.cookie
const cookies = parseCookie(cookieStr || '') || {}
const value = cookies[key]
return cookies[key]
return isJson ? JSON.parse(value) : value
}
// ---------------------------------------------------------------
@@ -213,41 +208,74 @@ export default class Auth {
}
setStrategy (name) {
if (name === undefined) {
name = this.options.defaultStrategy
}
const oldName = this.getState('strategy')
if (oldName === name) {
if (name === this.getUniversal('strategy')) {
return Promise.resolve()
}
// Update state
this.setState('strategy', name)
// Call to reset
this.reset()
// Set strategy
this.setUniversal('strategy', name)
// Call mounted hook on active strategy
return this._mounted()
return this.mounted()
}
// ---------------------------------------------------------------
// Scheme interface wrappers
// Scheme interface wrappers and default handlers
// ---------------------------------------------------------------
_mounted () {
return this.strategy.mounted(...arguments)
mounted () {
if (this.strategy.mounted) {
return Promise.resolve(this.strategy.mounted(...arguments)).then(() => this.fetchUserOnce())
}
return this.fetchUserOnce()
}
login () {
return this.strategy.login(...arguments)
if (this.strategy.login) {
return Promise.resolve(this.strategy.login(...arguments))
}
return Promise.resolve()
}
fetchUser () {
return this.strategy.fetchUser(...arguments)
if (this.strategy.fetchUser) {
return Promise.resolve(this.strategy.fetchUser(...arguments))
}
return Promise.resolve()
}
logout () {
return this.strategy.logout(...arguments)
if (this.strategy.logout) {
return Promise.resolve(this.strategy.logout(...arguments)).then(() => this.reset())
}
this.reset()
return Promise.resolve()
}
fetchUserOnce () {
if (!this.state.user) {
return this.fetchUser(...arguments)
}
return Promise.resolve()
}
reset () {
if (this.strategy.reset) {
this.strategy.reset(...arguments)
}
this.setState('loggedIn', false)
this.setState('user', null)
this.setToken(null)
}
// ---------------------------------------------------------------
@@ -329,12 +357,6 @@ export default class Auth {
}
}
reset () {
this.setState('loggedIn', false)
this.setState('user', null)
this.setToken(null)
}
redirect (name) {
if (!this.options.redirect) {
return
@@ -2,7 +2,8 @@ import Auth from './auth'
import './middleware'
// Active chemes
<% for (let scheme of options.schemes) { %>import <%= 'scheme_' + hash(scheme) %> from '<%= scheme %>'<% } %>
<% for (let scheme of options.schemes) { %> import <%= 'scheme_' + hash(scheme) %> from '<%= scheme %>'
<% } %>
export default function (ctx, inject) {
// Options
@@ -15,8 +16,8 @@ export default function (ctx, inject) {
inject('auth', $auth)
// Register strategies
<% for (let strategyName in options.strategies) { const strategy = options.strategies[strategyName] %>
$auth.registerStrategy('<%= strategyName %>', new <%='scheme_' + hash(strategy._scheme)%>($auth, <%= JSON.stringify(strategy) %>))
<% for (let strategy of options.strategies) { %>
$auth.registerStrategy('<%= strategy._name %>', new <%='scheme_' + hash(strategy._scheme) %> ($auth, <%= JSON.stringify(strategy) %>))
<% } %>
// Initialize auth
Oops, something went wrong.

0 comments on commit c38a1e4

Please sign in to comment.