#7308 - Warning inject #1065

Merged
jsegarra merged 10 commits from 7308_warning into dev 2025-01-22 10:41:33 +00:00
5 changed files with 39 additions and 27 deletions

View File

@ -20,7 +20,7 @@ describe('Axios boot', () => {
describe('onRequest()', async () => { describe('onRequest()', async () => {
it('should set the "Authorization" property on the headers', async () => { it('should set the "Authorization" property on the headers', async () => {
const config = { headers: {} }; const config = { headers: {} };
localStorage.setItem('token', 'DEFAULT_TOKEN');
const resultConfig = onRequest(config); const resultConfig = onRequest(config);
expect(resultConfig).toEqual( expect(resultConfig).toEqual(

View File

@ -3,9 +3,9 @@ import { useSession } from 'src/composables/useSession';
import { Router } from 'src/router'; import { Router } from 'src/router';
import useNotify from 'src/composables/useNotify.js'; import useNotify from 'src/composables/useNotify.js';
import { useStateQueryStore } from 'src/stores/useStateQueryStore'; import { useStateQueryStore } from 'src/stores/useStateQueryStore';
import { getToken, isLoggedIn } from 'src/utils/session';
import { i18n } from 'src/boot/i18n'; import { i18n } from 'src/boot/i18n';
const session = useSession();
const { notify } = useNotify(); const { notify } = useNotify();
const stateQuery = useStateQueryStore(); const stateQuery = useStateQueryStore();
const baseUrl = '/api/'; const baseUrl = '/api/';
@ -13,7 +13,7 @@ axios.defaults.baseURL = baseUrl;
const axiosNoError = axios.create({ baseURL: baseUrl }); const axiosNoError = axios.create({ baseURL: baseUrl });
const onRequest = (config) => { const onRequest = (config) => {
const token = session.getToken(); const token = getToken();
if (token.length && !config.headers.Authorization) { if (token.length && !config.headers.Authorization) {
config.headers.Authorization = token; config.headers.Authorization = token;
config.headers['Accept-Language'] = i18n.global.locale.value; config.headers['Accept-Language'] = i18n.global.locale.value;
@ -37,15 +37,15 @@ const onResponse = (response) => {
return response; return response;
}; };
const onResponseError = (error) => { const onResponseError = async (error) => {
stateQuery.remove(error.config); stateQuery.remove(error.config);
if (session.isLoggedIn() && error.response?.status === 401) { if (isLoggedIn() && error.response?.status === 401) {
session.destroy(false); await useSession().destroy(false);
const hash = window.location.hash; const hash = window.location.hash;
const url = hash.slice(1); const url = hash.slice(1);
Router.push(`/login?redirect=${url}`); Router.push(`/login?redirect=${url}`);
} else if (!session.isLoggedIn()) { } else if (!isLoggedIn()) {
return Promise.reject(error); return Promise.reject(error);
} }

View File

@ -6,6 +6,7 @@ import axios from 'axios';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import useNotify from './useNotify'; import useNotify from './useNotify';
import { useTokenConfig } from './useTokenConfig'; import { useTokenConfig } from './useTokenConfig';
import { getToken, getTokenMultimedia } from 'src/utils/session';
const TOKEN_MULTIMEDIA = 'tokenMultimedia'; const TOKEN_MULTIMEDIA = 'tokenMultimedia';
const TOKEN = 'token'; const TOKEN = 'token';
@ -15,19 +16,6 @@ export function useSession() {
let isCheckingToken = false; let isCheckingToken = false;
let intervalId = null; let intervalId = null;
function getToken() {
const localToken = localStorage.getItem(TOKEN);
const sessionToken = sessionStorage.getItem(TOKEN);
return localToken || sessionToken || '';
}
function getTokenMultimedia() {
const localTokenMultimedia = localStorage.getItem(TOKEN_MULTIMEDIA);
const sessionTokenMultimedia = sessionStorage.getItem(TOKEN_MULTIMEDIA);
return localTokenMultimedia || sessionTokenMultimedia || '';
}
function setSession(data) { function setSession(data) {
let keepLogin = data.keepLogin; let keepLogin = data.keepLogin;
const storage = keepLogin ? localStorage : sessionStorage; const storage = keepLogin ? localStorage : sessionStorage;

View File

@ -1,4 +1,4 @@
import { route } from 'quasar/wrappers'; import { route as defineRouter } from 'quasar/wrappers';
import { import {
createRouter, createRouter,
createMemoryHistory, createMemoryHistory,
@ -8,14 +8,14 @@ import {
import routes from './routes'; import routes from './routes';
import { i18n } from 'src/boot/i18n'; import { i18n } from 'src/boot/i18n';
import { useState } from 'src/composables/useState'; import { useState } from 'src/composables/useState';
import { useSession } from 'src/composables/useSession';
import { useRole } from 'src/composables/useRole'; import { useRole } from 'src/composables/useRole';
import { useUserConfig } from 'src/composables/useUserConfig'; import { useUserConfig } from 'src/composables/useUserConfig';
import { useTokenConfig } from 'src/composables/useTokenConfig'; import { useTokenConfig } from 'src/composables/useTokenConfig';
import { useAcl } from 'src/composables/useAcl'; import { useAcl } from 'src/composables/useAcl';
import { isLoggedIn } from 'src/utils/session';
import { useSession } from 'src/composables/useSession';
const state = useState(); let session = null;
const session = useSession();
const { t, te } = i18n.global; const { t, te } = i18n.global;
const createHistory = process.env.SERVER const createHistory = process.env.SERVER
@ -43,11 +43,12 @@ const Router = createRouter({
* with the Router instance. * with the Router instance.
*/ */
export { Router }; export { Router };
Outdated
Review

Que cambia del export default route al export default defineRouter ¿?

Que cambia del `export default route` al `export default defineRouter` ¿?

Esto lo vi en la documentación oficial, pero ahora no recuerdo el enlace exacto. Lo buscaré

Esto lo vi en la documentación oficial, pero ahora no recuerdo el enlace exacto. Lo buscaré
https://gitea.verdnatura.es/verdnatura/salix-front/pulls/1065#issuecomment-74021
export default route(function (/* { store, ssrContext } */) { export default defineRouter(function (/* { store, ssrContext } */) {
Review

El dejarlo fuera del Router.beforeEach, solo lo llamarà una vez entiendo, queremos ese enfoque?

El dejarlo fuera del Router.beforeEach, solo lo llamarà una vez entiendo, queremos ese enfoque?
Review

El comentario es sobre el useState?
Lo pregunto porque este, al que me refiero, ya estaba fuera del beforeEach, en la linea 17

El comentario es sobre el useState? Lo pregunto porque este, al que me refiero, ya estaba fuera del beforeEach, en la linea 17
Review

Sisi por eso, ahora esta dentro, por lo que en cada iteración del router se llamará. Como estaba antes entiendo q solo se llamará 1 vez

Sisi por eso, ahora esta dentro, por lo que en cada iteración del router se llamará. Como estaba antes entiendo q solo se llamará 1 vez
Review

solved

solved
const state = useState();
Router.beforeEach(async (to, from, next) => { Router.beforeEach(async (to, from, next) => {
const { isLoggedIn } = session; if (!session) session = useSession();
Review

Quitar entiendo

Quitar entiendo
const outLayout = Router.options.routes[0].children.map((r) => r.name); const outLayout = Router.options.routes[0].children.map((r) => r.name);
if (!isLoggedIn() && !outLayout.includes(to.name)) { if (!session.isLoggedIn() && !outLayout.includes(to.name)) {
return next({ name: 'Login', query: { redirect: to.fullPath } }); return next({ name: 'Login', query: { redirect: to.fullPath } });
} }

23
src/utils/session.js Normal file
View File

@ -0,0 +1,23 @@
const TOKEN_MULTIMEDIA = 'tokenMultimedia';
const TOKEN = 'token';
function getToken() {
const localToken = localStorage.getItem(TOKEN);
const sessionToken = sessionStorage.getItem(TOKEN);
return localToken || sessionToken || '';
}
function getTokenMultimedia() {
const localTokenMultimedia = localStorage.getItem(TOKEN_MULTIMEDIA);
const sessionTokenMultimedia = sessionStorage.getItem(TOKEN_MULTIMEDIA);
return localTokenMultimedia || sessionTokenMultimedia || '';
}
function isLoggedIn() {
const localToken = localStorage.getItem(TOKEN);
const sessionToken = sessionStorage.getItem(TOKEN);
return !!(localToken || sessionToken);
}
export { getToken, getTokenMultimedia, isLoggedIn };