bit-badger/myPrayerJournal
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases 36 Activity

myPrayerJournal v2 #27

Merged
danieljsummers merged 27 commits from version-2 into master 2019-09-03 00:01:26 +00:00
Conversation 0 Commits 27 Files Changed 44 +138 -88
5 changed files with 138 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 7e08d7375f - Show all commits

5
src/app/src/App.vue
View File

@ -93,6 +93,11 @@ export default {
},
hideProgress () {
this.progress.visible = false
},
handleLoginEvent (data) {
if (!data.loggedIn) {
this.showInfo('Logged out successfully')
}
}
},
provide () {

159
src/app/src/auth/AuthService.js
View File

@ -7,30 +7,31 @@ import AUTH_CONFIG from './auth0-variables'
import mutations from '@/store/mutation-types'
/* es-lint-enable*/
// Auth0 web authentication instance to use for our calls
const webAuth = new auth0.WebAuth({
domain: AUTH_CONFIG.domain,
clientID: AUTH_CONFIG.clientId,
redirectUri: AUTH_CONFIG.appDomain + AUTH_CONFIG.callbackUrl,
audience: `https://${AUTH_CONFIG.domain}/userinfo`,
responseType: 'token id_token',
scope: 'openid profile email'
})
/**
* A class to handle all authentication calls and determinations
*/
class AuthService extends EventEmitter {
id = {
token: null,
expiry: null
}
access = {
token: null,
expiry: null
}
profile = null
// Local storage key for our session data
AUTH_SESSION = 'auth-session'
ACCESS_TOKEN = 'access_token'
ID_TOKEN = 'id_token'
EXPIRES_AT = 'expires_at'
USER_PROFILE = 'user_profile'
// Received and calculated values for our ssesion (initially loaded from local storage if present)
session = {}
constructor() {
super()
this.refreshSession()
}
/**
* Starts the user log in flow
@ -56,31 +57,37 @@ class AuthService extends EventEmitter {
})
}
handleAuthentication (store) {
this.parseHash()
.then(authResult => {
if (authResult && authResult.accessToken && authResult.idToken) {
this.setSession(authResult)
store.commit(mutations.USER_LOGGED_ON, this.profile)
}
})
.catch(err => {
console.log(err)
alert(`Error: ${err.error}. Check the console for further details.`)
})
/**
* Handle authentication replies from Auth0
*
* @param store The Vuex store
*/
async handleAuthentication (store) {
try {
const authResult = await this.parseHash()
if (authResult && authResult.accessToken && authResult.idToken) {
this.setSession(authResult)
store.commit(mutations.USER_LOGGED_ON, this.session.profile)
}
} catch(err) {
console.error(err)
alert(`Error: ${err.error}. Check the console for further details.`)
}
}
/**
* Set up the session and commit it to local storage
*
* @param authResult The authorization result
*/
setSession (authResult) {
this.profile = authResult.idTokenPayload
this.id.token = authResult.idToken
this.id.expiry = new Date(this.profile.exp * 1000);
this.access.token = authResult.accessToken
this.access.expiry = new Date(Date.now() + authResult.expiresIn * 1000)
this.session.profile = authResult.idTokenPayload
this.session.id.token = authResult.idToken
this.session.id.expiry = this.session.profile.exp * 1000
this.session.access.token = authResult.accessToken
this.session.access.expiry = authResult.expiresIn * 1000 + Date.now()
localStorage.setItem(this.ACCESS_TOKEN, authResult.accessToken)
localStorage.setItem(this.ID_TOKEN, authResult.idToken)
localStorage.setItem(this.EXPIRES_AT, this.id.expiry)
localStorage.setItem(this.USER_PROFILE, JSON.stringify(this.profile))
localStorage.setItem(this.AUTH_SESSION, JSON.stringify(this.session))
this.emit('loginEvent', {
loggedIn: true,
@ -89,9 +96,32 @@ class AuthService extends EventEmitter {
})
}
/**
* Refresh this instance's session from the one in local storage
*/
refreshSession () {
this.session =
localStorage.getItem(this.AUTH_SESSION)
? JSON.parse(localStorage.getItem(this.AUTH_SESSION))
: { profile: {},
id: {
token: null,
expiry: null
},
access: {
token: null,
expiry: null
}
}
}
/**
* Renew authorzation tokens with Auth0
*/
renewTokens () {
return new Promise((resolve, reject) => {
if (localStorage.getItem(this.ID_TOKEN) !== null) {
this.refreshSession()
if (this.session.id.token !== null) {
webAuth.checkSession({}, (err, authResult) => {
if (err) {
reject(err)
@ -106,45 +136,58 @@ class AuthService extends EventEmitter {
})
}
logout (store, router) {
/**
* Log out of myPrayerJournal
*
* @param store The Vuex store
*/
logout (store) {
// Clear access token and ID token from local storage
localStorage.removeItem(this.ACCESS_TOKEN)
localStorage.removeItem(this.ID_TOKEN)
localStorage.removeItem(this.EXPIRES_AT)
localStorage.removeItem(this.USER_PROFILE)
this.idToken = null
this.idTokenExpiry = null
this.profile = null
localStorage.removeItem(this.AUTH_SESSION)
this.refreshSession()
store.commit(mutations.USER_LOGGED_OFF)
webAuth.logout({
// navigate to the home route
returnTo: '/'
returnTo: `${AUTH_CONFIG.appDomain}/`,
clientID: AUTH_CONFIG.clientId
})
this.emit('loginEvent', { loggedIn: false })
}
/**
* Check expiration for a token (the way it's stored in the session)
*/
checkExpiry = (it) => it.token && it.expiry && Date.now() < it.expiry
/**
* Is there a user authenticated?
*/
isAuthenticated () {
return Date.now() < this.id.Expiry && localStorage.getItem(this.ID_TOKEN)
return this.checkExpiry(this.session.id)
}
/**
* Is the current access token valid?
*/
isAccessTokenValid () {
return this.access.token && this.access.expiry && Date.now() < this.access.expiry
return this.checkExpiry(this.session.access)
}
getAccessToken () {
return new Promise((resolve, reject) => {
if (this.isAccessTokenValid()) {
resolve(this.access.token)
} else {
this.renewTokens()
.then(authResult => {
resolve(authResult.accessToken)
}, reject)
/**
* Get the user's access token, renewing it if required
*/
async getAccessToken () {
if (this.isAccessTokenValid()) {
return this.session.access.token
} else {
try {
const authResult = await this.renewTokens()
return authResult.accessToken
} catch (reject) {
throw reject
}
})
}
}
}

50
src/app/src/components/common/Navigation.vue
View File

@ -1,30 +1,29 @@
<template lang="pug">
.md-toolbar-row
md-tabs(md-sync-route).md-primary
md-tab(v-if='isAuthenticated'
md-label='Journal'
to='/journal')
md-tab(v-if='isAuthenticated'
md-label='Active'
to='/requests/active')
md-tab(v-if='hasSnoozed'
md-label='Snoozed'
to='/requests/snoozed')
md-tab(v-if='isAuthenticated'
md-label='Answered'
to='/requests/answered')
md-tab(v-if='isAuthenticated'
md-label='Log Off'
href='#'
@click.stop='logOff()')
md-tab(v-if='!isAuthenticated'
md-label='Log On'
href='#'
@click.stop='logOn()')
md-tab(md-label='Docs'
href='https://docs.prayerjournal.me'
target='_blank'
@click.stop='')
template(v-if='isAuthenticated')
md-tab(md-label='Journal'
to='/journal')
md-tab(md-label='Active'
to='/requests/active')
md-tab(v-if='hasSnoozed'
md-label='Snoozed'
to='/requests/snoozed')
md-tab(md-label='Answered'
to='/requests/answered')
md-tab(md-label='Log Off'
href='/user/log-off'
@click.prevent='logOff()')
md-tab(md-label='Docs'
href='https://docs.prayerjournal.me'
@click.prevent='showHelp()')
template(v-else)
md-tab(md-label='Log On'
href='/user/log-on'
@click.prevent='logOn()')
md-tab(md-label='Docs'
href='https://docs.prayerjournal.me'
@click.prevent='showHelp()')
</template>
<script>
@ -51,6 +50,9 @@ export default {
},
logOff () {
this.$auth.logout(this.$store, this.$router)
},
showHelp () {
window.open('https://docs.prayerjournal.me','_blank')
}
}
}

4
src/app/src/components/user/LogOn.vue
View File

@ -10,9 +10,9 @@ article.mpj-main-content(role='main')
export default {
name: 'log-on',
inject: ['progress'],
created () {
async created () {
this.progress.$emit('show', 'indeterminate')
this.$auth.handleAuthentication(this.$store)
await this.$auth.handleAuthentication(this.$store)
},
methods: {
handleLoginEvent (data) {

6
src/app/src/store/index.js
View File

@ -38,7 +38,7 @@ const logError = function (error) {
const setBearer = async function () {
try {
await auth.getAccessToken()
api.setBearer(localStorage.getItem(auth.ID_TOKEN))
api.setBearer(auth.session.id.token)
} catch(err) {
if (err === 'Not logged in') {
console.warn('API request attempted when user was not logged in')
@ -50,7 +50,7 @@ const setBearer = async function () {
export default new Vuex.Store({
state: {
user: JSON.parse(localStorage.getItem(auth.USER_PROFILE) || '{}'),
user: auth.session.profile,
isAuthenticated: auth.isAuthenticated(),
journal: {},
isLoadingJournal: false
@ -98,7 +98,7 @@ export default new Vuex.Store({
},
async [actions.CHECK_AUTHENTICATION] ({ commit }) {
try {
await auth.renewTokens()
await auth.getAccessToken()
commit(mutations.SET_AUTHENTICATION, auth.isAuthenticated())
} catch(_) {
commit(mutations.SET_AUTHENTICATION, false)