cookies and http.js file in vuex

[bellagrunt]

In vuex I pass in a custom http.js file that has access to my api. Before I was using localstorage but its not good practice for auth. So I’m looking into a different solution. I was wondering if anyone encountered this type of set up and or if I’m passing this correctly?

old http file:

export default {
  baseURL: "/",
  onError(error) {
    switch (error.response.status) {
      case 401:
        this.onUnauthorised(error);
        break;
      case 404:
        this.onNotFound(error);
        break;
      case 422:
        this.onValidationError(error);
        break;
      case 500:
        this.onServerError(error);
        break;
      default:
        this.onGenericError(error);
        break;
    }
    return Promise.reject(error);
  },
  access_token() {
    try {
      return window.localStorage["default_auth_token"];
    } catch (err) {
      err;
    }
  }
};

new http file:

import { Cookies } from "quasar";

export default {
  baseURL: "/",
  onError(error) {
    switch (error.response.status) {
      case 401:
        this.onUnauthorised(error);
        break;
      case 404:
        this.onNotFound(error);
        break;
      case 422:
        this.onValidationError(error);
        break;
      case 500:
        this.onServerError(error);
        break;
      default:
        this.onGenericError(error);
        break;
    }
    return Promise.reject(error);
  },
  access_token() {
    try {
      return Cookies.get["default_auth_token"];
    } catch (err) {
      err;
    }
  }
};

vuex file:

import Vue from "vue";
import Vuex from "vuex";
import VuexORM from "@vuex-orm/core";
import Item from "../store/models/Item";
import item from "../store/modules/item";
import VuexORMAxios from "@vuex-orm/plugin-axios";
import http from "../store/http";
import createPersistedState from "vuex-persistedstate";
import User from "../store/models/User";
import Sort from "../store/models/Sort";
import Recipe from "../store/models/Recipe";
import recipeData from "./recipeData/recipeData";

Vue.use(Vuex);

const database = new VuexORM.Database();
database.register(Item, item);
database.register(User);
database.register(Sort);
database.register(Recipe);

VuexORM.use(VuexORMAxios, {
  database,
  http
});

const VuexORMPlugin = VuexORM.install(database);

export default function({ ssrContext }) {
  const plugins = [];
  plugins.push(VuexORMPlugin);

  if (!ssrContext) {
    plugins.push(
      createPersistedState({
        filter: ({ payload }) => (payload ? payload.entity !== "users" : true)
      })
    );
  }

  const Store = new Vuex.Store({
    modules: {
      // example
      recipeData
      // indexData
    },

    plugins,

    // enable strict mode (adds overhead!)
    // for dev mode only
    strict: process.env.DEV
  });

  return Store;
}