EP/website-typo3
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implement forced logout on api errors

Browse Source
This commit is contained in:
Björn Fromme
2018-10-19 17:39:56 +02:00
parent b496d17c2e
commit b70d95b14c
6 changed files with 87 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/_store.js
+78 -64
View File
@@ -1,12 +1,28 @@
import Vue from 'vue'; import Vue from 'vue'
import Vuex from 'vuex'; import Vuex from 'vuex'
import axios from 'axios'; import axios from 'axios'
import EventBus from '../_bus'
const configElement = document.getElementById('appconfig');
const config = JSON.parse(configElement.innerHTML);
axios.defaults.headers.common['Accept'] = 'application/json';
axios.defaults.headers.put['Content-Type'] = 'application/json';
axios.defaults.baseURL = config.myEpApiBaseUrl;
const createAuthenticatingClient = () => {
return axios.create({
headers: {
'X-Auth-Token': sessionStorage.getItem('token')
},
});
};
Vue.use(Vuex); Vue.use(Vuex);
export default new Vuex.Store({ export default new Vuex.Store({
state: { state: {
config: {}, config: config,
loading: false, loading: false,
loggedIn: !!sessionStorage.getItem('token'), loggedIn: !!sessionStorage.getItem('token'),
countries: [] countries: []
@@ -29,9 +45,6 @@ export default new Vuex.Store({
}, },
setCountries (state, countries) { setCountries (state, countries) {
state.countries = countries; state.countries = countries;
},
setConfig (state, config) {
state.config = config;
} }
}, },
actions: { actions: {
@@ -89,81 +102,82 @@ export default new Vuex.Store({
}, },
loadAddress ({ commit }) { loadAddress ({ commit }) {
commit('loadingBegin'); commit('loadingBegin');
return axios({
url: '/api/addresses', const client = createAuthenticatingClient();
headers: {
'x-auth-token': sessionStorage.getItem('token') return client.get('/api/addresses')
} .then((response) => {
}).then((response) => { commit('loadingFinish');
commit('loadingFinish'); return response.data[0];
return response.data[0]; }).catch((error) => {
}).catch((error) => { commit('loadingFinish');
commit('loadingFinish'); commit('logout');
throw error; EventBus.$emit('forcedLogout');
}); throw error;
});
}, },
saveAddress ({ commit }, data) { saveAddress ({ commit }, data) {
commit('loadingBegin'); commit('loadingBegin');
return axios({
url: '/api/addresses/' + data.id, const client = createAuthenticatingClient();
headers: {
'x-auth-token': sessionStorage.getItem('token') return client.put('/api/addresses/' + data.id, data)
}, .then(() => {
method: 'PUT', commit('loadingFinish');
data: data })
}).then(() => { .catch((error) => {
commit('loadingFinish'); commit('loadingFinish');
}) commit('logout');
.catch((error) => { EventBus.$emit('forcedLogout');
commit('loadingFinish'); throw error;
throw error; });
});
}, },
loadEvents ({ commit }) { loadEvents ({ commit }) {
commit('loadingBegin'); commit('loadingBegin');
return axios({
url: '/api/events', const client = createAuthenticatingClient();
headers: {
'x-auth-token': sessionStorage.getItem('token') return client.get('/api/events')
} .then((response) => {
}).then((response) => {
commit('loadingFinish'); commit('loadingFinish');
return response.data; return response.data;
}).catch((error) => { }).catch((error) => {
commit('loadingFinish'); commit('loadingFinish');
commit('logout');
EventBus.$emit('forcedLogout');
throw error; throw error;
}); });
}, },
loadCrmData ({ commit }) { loadCrmData ({ commit }) {
commit('loadingBegin'); commit('loadingBegin');
return axios({
url: '/api/crm-selections', const client = createAuthenticatingClient();
headers: {
'x-auth-token': sessionStorage.getItem('token') return client.get('/api/crm-selections')
} .then((response) => {
}).then((response) => { commit('loadingFinish');
commit('loadingFinish'); return response.data[0];
return response.data[0]; }).catch((error) => {
}).catch((error) => { commit('loadingFinish');
commit('loadingFinish'); commit('logout');
throw error; EventBus.$emit('forcedLogout');
}); throw error;
});
}, },
saveCrmData ({ commit }, data) { saveCrmData ({ commit }, data) {
commit('loadingBegin'); commit('loadingBegin');
return axios({
url: '/api/crm-selections/' + data.id, const client = createAuthenticatingClient();
headers: {
'x-auth-token': sessionStorage.getItem('token') return client.put('/api/crm-selections/' + data.id, data)
}, .then(() => {
method: 'PUT', commit('loadingFinish');
data: data }).catch((error) => {
}).then(() => { commit('loadingFinish');
commit('loadingFinish'); commit('logout');
}).catch((error) => { EventBus.$emit('forcedLogout');
commit('loadingFinish'); throw error;
throw error; });
});
} }
}, },
getters: { getters: {
web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/Address.vue
+2 -8
View File
@@ -7,7 +7,7 @@
</button> </button>
{{ message }} {{ message }}
</div> </div>
<img :src="loaderUrl" alt="" v-show="loading"> <img :src="$store.state.config.loaderUrl" alt="" v-show="loading">
<div class="row" v-show="!loading"> <div class="row" v-show="!loading">
<form @submit.prevent="saveAddress()"> <form @submit.prevent="saveAddress()">
<div class="col-xs-12 col-md-6"> <div class="col-xs-12 col-md-6">
@@ -69,7 +69,7 @@
Land: Land:
</label> </label>
<select id="country" v-model="address.country" class="form-control"> <select id="country" v-model="address.country" class="form-control">
<option v-for="country in countries" :value="country.code">{{ country.name }}</option> <option v-for="country in $store.state.countries" :value="country.code">{{ country.name }}</option>
</select> </select>
</div> </div>
</div> </div>
@@ -143,12 +143,6 @@
} }
}, },
computed: { computed: {
loaderUrl () {
return this.$store.state.config.loaderUrl;
},
countries () {
return this.$store.state.countries;
},
loading () { loading () {
return this.$store.state.loading; return this.$store.state.loading;
} }
web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/App.vue
+4 -12
View File
@@ -11,20 +11,9 @@
</template> </template>
<script> <script>
const configElement = document.getElementById('appconfig');
const config = JSON.parse(configElement.innerHTML);
import axios from 'axios';
axios.defaults.headers.common['Accept'] = 'application/json';
axios.defaults.headers.put['Content-Type'] = 'application/json';
axios.defaults.baseURL = config.myEpApiBaseUrl;
import store from '../_store' import store from '../_store'
store.commit('setConfig', config);
import router from '../_router' import router from '../_router'
import EventBus from '../../_bus'
export default { export default {
store, store,
@@ -50,6 +39,9 @@
}, },
created () { created () {
this.$store.dispatch('loadCountries'); this.$store.dispatch('loadCountries');
EventBus.$on('forcedLogout', () => {
this.$router.push({ name: 'login' })
});
} }
} }
</script> </script>
web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/CrmData.vue
+1 -4
View File
@@ -7,7 +7,7 @@
</button> </button>
{{ message }} {{ message }}
</div> </div>
<img :src="loaderUrl" alt="" v-if="loading"> <img :src="$store.state.config.loaderUrl" alt="" v-if="loading">
<div class="row" v-if="loaded"> <div class="row" v-if="loaded">
<div class="col-xs-12 col-md-6"> <div class="col-xs-12 col-md-6">
<h2>Selektionsmerkmale</h2> <h2>Selektionsmerkmale</h2>
@@ -84,9 +84,6 @@
} }
}, },
computed: { computed: {
loaderUrl () {
return this.$store.state.config.loaderUrl;
},
loading () { loading () {
return this.$store.state.loading; return this.$store.state.loading;
} }
web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/Events.vue
+1 -4
View File
@@ -7,7 +7,7 @@
</button> </button>
{{ message }} {{ message }}
</div> </div>
<img :src="loaderUrl" alt="" v-if="loading"> <img :src="$store.state.config.loaderUrl" alt="" v-if="loading">
<div class="table-responsive" v-if="!loading"> <div class="table-responsive" v-if="!loading">
<table class="table table-striped table-condensed"> <table class="table table-striped table-condensed">
<thead> <thead>
@@ -89,9 +89,6 @@
} }
}, },
computed: { computed: {
loaderUrl () {
return this.$store.state.config.loaderUrl;
},
loading () { loading () {
return this.$store.state.loading; return this.$store.state.loading;
} }
web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/Login.vue
+1 -4
View File
@@ -1,6 +1,6 @@
<template> <template>
<div class="form-wrapper form--border col-xs-12 col-md-6" id="myep-main"> <div class="form-wrapper form--border col-xs-12 col-md-6" id="myep-main">
<h1>Login MyE&amp;P<img :src="loaderUrl" alt="" v-if="loading"></h1> <h1>Login MyE&amp;P<img :src="$store.state.config.loaderUrl" alt="" v-if="loading"></h1>
<div v-if="message" class="alert" :class="messageClass"> <div v-if="message" class="alert" :class="messageClass">
{{ message }} {{ message }}
</div> </div>
@@ -92,9 +92,6 @@
} }
}, },
computed: { computed: {
loaderUrl () {
return this.$store.state.config.loaderUrl;
},
loading () { loading () {
return this.$store.state.loading; return this.$store.state.loading;
}, },