gorb/frontend
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

fix: refresh returning 401 not properly logging you out of client

Browse source
This commit is contained in:
SauceyRed 2025-05-28 02:24:54 +02:00
parent 6a11108ec1
commit a15f85a082
Signed by: sauceyred
GPG key ID: 2BF92EB6D8A5CCA7
2 changed files with 79 additions and 70 deletions
Download patch file Download diff file Expand all files Collapse all files

20
composables/auth.ts
View file

@ -30,11 +30,11 @@ export const useAuth = () => {
{
username, password: hashedPass, device_name: "Linux Laptop"
}
}) as { access_token: string, refresh_token: string }; fetch
}) as { access_token: string, refresh_token: string };
console.log("hi");
accessToken.value = res.access_token;
console.log("access token:", accessToken.value);
await fetchUser();
//await fetchUser();
}
async function logout(password: string) {
@ -60,19 +60,17 @@ export const useAuth = () => {
async function refresh() {
console.log("refreshing");
try {
const res = await fetchWithApi("/auth/refresh", {
method: "POST"
}) as { access_token: string };
accessToken.value = res.access_token;
console.log("set new access token");
} catch (error) {
console.error("refresh error:", error);
}
const res = await fetchWithApi("/auth/refresh", {
method: "POST"
}) as any;
console.log("finished refreshing:", res);
accessToken.value = res?.access_token;
console.log("set new access token");
}
async function fetchUser() {
if (!accessToken.value) return;
console.log("fetchuser access token:", accessToken.value);
const res = await fetchWithApi("/users/me") as UserResponse;
user.value = res;
return user.value;

129
utils/fetchWithApi.ts
View file

@ -9,63 +9,74 @@ export default async <T>(path: string, options: NitroFetchOptions<string> = {})
path = path.slice(0, path.lastIndexOf("/"));
}
console.log("formatted path:", path);
try {
const accessToken = useCookie("access_token");
console.log("access token:", accessToken.value);
const apiBase = useCookie("api_base").value;
const apiVersion = useRuntimeConfig().public.apiVersion;
console.log("heyoooo")
console.log("apiBase:", apiBase);
if (!apiBase) {
console.log("no api base");
return;
}
console.log("path:", path)
const { revoke, refresh } = useAuth();
console.log("access token 2:", accessToken.value);
let headers: HeadersInit = {};
if (accessToken.value) {
headers = {
...options.headers,
"Authorization": `Bearer ${accessToken.value}`
};
} else {
headers = {
...options.headers
};
}
let reauthFailed = false;
while (!reauthFailed) {
try {
console.log("fetching:", URL.parse(apiBase + path));
const res = await $fetch<T>(URL.parse(apiBase + path)!.href, {
...options,
headers,
credentials: "include"
});
return res;
} catch (error: any) {
if (error?.response?.status === 401) {
if (!path.startsWith("/auth/refresh")) {
try {
await refresh();
} catch (error: any) {
if (error?.response?.status === 401) {
reauthFailed = true;
await revoke();
return;
}
}
}
}
throw error;
}
}
} catch (error) {
console.error("error:", error);
}
const accessToken = useCookie("access_token");
console.log("access token:", accessToken.value);
const apiBase = useCookie("api_base").value;
const apiVersion = useRuntimeConfig().public.apiVersion;
console.log("heyoooo")
console.log("apiBase:", apiBase);
if (!apiBase) {
console.log("no api base");
return;
}
console.log("path:", path)
const { revoke, refresh } = useAuth();
console.log("access token 2:", accessToken.value);
let headers: HeadersInit = {};
if (accessToken.value) {
headers = {
...options.headers,
"Authorization": `Bearer ${accessToken.value}`
};
} else {
headers = {
...options.headers
};
}
let reauthFailed = false;
while (!reauthFailed) {
try {
console.log("fetching:", URL.parse(apiBase + path));
const res = await $fetch<T>(URL.parse(apiBase + path)!.href, {
...options,
headers,
credentials: "include"
});
return res;
} catch (error: any) {
console.error("Error fetching resource");
if (error?.response?.status === 401) {
console.log("Error status is 401");
if (!path.startsWith("/auth/refresh")) {
console.log("Path is not refresh endpoint");
try {
console.log("Trying to refresh");
await refresh();
console.log("Successfully refreshed token");
} catch (error: any) {
console.log("Failed to refresh token");
if (error?.response?.status === 401) {
console.log("Refresh returned 401");
reauthFailed = true;
console.log("Revoking");
await revoke();
console.log("Redirecting to login");
await navigateTo("/login");
console.log("redirected");
return;
}
}
} else {
console.log("Path is refresh endpoint, throwing error");
throw error;
}
}
console.log("throwing error");
throw error;
}
}
}