Better Auth
Client Identity Sync
Mirror the server-side user identity into client-side logs by watching the Better Auth session and calling setIdentity.
The middleware identifies users on the server. To get the same identity on client-side logs (clicks, navigation, errors caught in the browser), watch the Better Auth session and forward the user to evlog's client identity store.
Vue / Nuxt
composables/useAuthIdentity.ts
import { authClient } from '~/lib/auth-client'
export function useAuthIdentity() {
const session = authClient.useSession()
watch(() => session.value?.data?.user, (user) => {
if (user) {
setIdentity({ userId: user.id, userName: user.name })
} else {
clearIdentity()
}
}, { immediate: true })
}
Call it once in your root layout:
app.vue
<script setup>
useAuthIdentity()
</script>
React
hooks/useAuthIdentity.tsx
import { useEffect } from 'react'
import { setIdentity, clearIdentity } from 'evlog/http'
import { authClient } from '@/lib/auth-client'
export function useAuthIdentity() {
const { data } = authClient.useSession()
useEffect(() => {
if (data?.user) {
setIdentity({ userId: data.user.id, userName: data.user.name })
} else {
clearIdentity()
}
}, [data?.user?.id])
}
Wire it up at the root of your app (in _app.tsx, the root layout, or a top-level provider).
Svelte
src/lib/auth-identity.ts
import { setIdentity, clearIdentity } from 'evlog/http'
import { authClient } from '$lib/auth-client'
export function setupAuthIdentity() {
const session = authClient.useSession()
session.subscribe(({ data }) => {
if (data?.user) {
setIdentity({ userId: data.user.id, userName: data.user.name })
} else {
clearIdentity()
}
})
}
Run setupAuthIdentity() once when the app boots.
Output
Client-side logs now include the user identity:
Client Log
{
"level": "info",
"tag": "checkout",
"message": "User clicked checkout",
"userId": "QBX9tPjJQExWawAbNll75",
"userName": "Hugo Richard"
}
setIdentity is part of evlog's client logging layer. The same fields are picked up by the HTTP transport when client logs are forwarded to your server, so a single user shows up identified across browser and API logs.