Refreshing tokens on page navigation

I'm currently fighting with refreshing tokens on route navigation in a

auth.global.ts

auth.global.ts

auth.global.ts

auth.global.ts RouteMiddleware.
As far as I can tell the issue is that the

login

login

login

login and

refreshToken

refreshToken

methods in my

useAuth

useAuth

useAuth

useAuth composable are async, but using async in

defineNuxtRouteMiddleware

defineNuxtRouteMiddleware

defineNuxtRouteMiddleware

defineNuxtRouteMiddleware causes the server to spit out errors such as

Fetch handler error: Premature close

Fetch handler error: Premature close

Fetch handler error: Premature close

Fetch handler error: Premature close

I've solved the login issue by moving it to

onMounted

onMounted

onMounted

onMounted in

app.vue

app.vue

app.vue

app.vue but would like to make sure that tokens have not expired/are refreshed on page loads (I will also be refreshing the tokens on API calls)