Reset local creds if access is denied (#9114)

website/client/app.vue

@@ -144,6 +144,16 @@ export default {
       return response;
     }, (error) => {
       if (error.response.status >= 400) {
+        // Check for conditions to reset the user auth
+        const invalidUserMessage = [this.$t('invalidCredentials'), 'Missing authentication headers.'];
+        if (invalidUserMessage.indexOf(error.response.data.message) !== -1) {
+          localStorage.removeItem('habit-mobile-settings');
+          localStorage.removeItem('hello');
+          this.$store.state.isUserLoggedIn = false;
+          window.location.href = '/static/home';
+          return Promise.reject(error);
+        }
+
         // Don't show errors from getting user details. These users have delete their account,
         // but their chat message still exists.
         let configExists = Boolean(error.response) && Boolean(error.response.config);

website/client/store/index.js

@@ -22,6 +22,8 @@ let AUTH_SETTINGS = localStorage.getItem('habit-mobile-settings');
 
 if (AUTH_SETTINGS) {
   AUTH_SETTINGS = JSON.parse(AUTH_SETTINGS);
+
+  if (AUTH_SETTINGS.auth && AUTH_SETTINGS.auth.apiId && AUTH_SETTINGS.auth.apiToken) {
     axios.defaults.headers.common['x-api-user'] = AUTH_SETTINGS.auth.apiId;
     axios.defaults.headers.common['x-api-key'] = AUTH_SETTINGS.auth.apiToken;
 
@@ -29,6 +31,7 @@ if (AUTH_SETTINGS) {
 
     isUserLoggedIn = true;
   }
+}
 
 const i18nData = window && window['habitica-i18n'];
 
@@ -57,7 +60,7 @@ export default function () {
       isUserLoaded: false, // Means the user and the user's tasks are ready
       isAmazonReady: false, // Whether the Amazon Payments lib can be used
       user: asyncResourceFactory(),
-      credentials: AUTH_SETTINGS ? {
+      credentials: isUserLoggedIn ? {
         API_ID: AUTH_SETTINGS.auth.apiId,
         API_TOKEN: AUTH_SETTINGS.auth.apiToken,
       } : {},