Skip to content
Permalink
Browse files
feat: add auth0-js scheme
  • Loading branch information
Pooya Parsa committed Feb 16, 2018
1 parent ec4ee25 commit c38a1e49946cb1d435fe28d534e31ebf6aa258e8
Show file tree
Hide file tree
Showing 12 changed files with 473 additions and 79 deletions.
@@ -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

0 comments on commit c38a1e4

Please sign in to comment.