1---
2category: '@Firebase'
3---
4 
5# useAuth
6 
7Reactive [Firebase Auth](https://firebase.google.com/docs/auth) binding. It provides a reactive `user` and `isAuthenticated` so you
8can easily react to changes in the users' authentication status.
9 
10## Usage
11 
12```vue
13<script setup lang="ts">
14import { useAuth } from '@vueuse/firebase/useAuth'
15import { initializeApp } from 'firebase/app'
16import { getAuth, GoogleAuthProvider, signInWithPopup } from 'firebase/auth'
17 
18const app = initializeApp({ /* config */ })
19const auth = getAuth(app)
20const { isAuthenticated, user } = useAuth(auth)
21 
22const signIn = () => signInWithPopup(auth, new GoogleAuthProvider())
23</script>
24 
25<template>
26  <pre v-if="isAuthenticated">{{ user }}</pre>
27  <div v-else>
28    <button @click="signIn">
29      Sign In with Google
30    </button>
31  </div>
32</template>
33```
34 
35## Return Values
36 
37| Name              | Type                   | Description                                               |
38| ----------------- | ---------------------- | --------------------------------------------------------- |
39| `user`            | `Ref<User \| null>`    | The current Firebase user, or `null` if not authenticated |
40| `isAuthenticated` | `ComputedRef<boolean>` | Whether a user is currently authenticated                 |
41 
42The composable automatically updates when the user's ID token changes (including sign-in, sign-out, and token refresh events) using Firebase's `onIdTokenChanged` listener.
43 
44## Type Declarations
45 
46```ts
47export interface UseFirebaseAuthOptions {
48  isAuthenticated: ComputedRef<boolean>
49  user: Ref<User | null>
50}
51/**
52 * Reactive Firebase Auth binding
53 *
54 * @see https://vueuse.org/useAuth
55 *
56 * @__NO_SIDE_EFFECTS__
57 */
58export declare function useAuth(auth: Auth): {
59  isAuthenticated: ComputedRef<boolean>
60  user: Ref<
61    {
62      readonly emailVerified: boolean
63      readonly isAnonymous: boolean
64      readonly metadata: {
65        readonly creationTime?: string | undefined
66        readonly lastSignInTime?: string | undefined
67      }
68      readonly providerData: {
69        readonly displayName: string | null
70        readonly email: string | null
71        readonly phoneNumber: string | null
72        readonly photoURL: string | null
73        readonly providerId: string
74        readonly uid: string
75      }[]
76      readonly refreshToken: string
77      readonly tenantId: string | null
78      delete: () => Promise<void>
79      getIdToken: (forceRefresh?: boolean) => Promise<string>
80      getIdTokenResult: (forceRefresh?: boolean) => Promise<IdTokenResult>
81      reload: () => Promise<void>
82      toJSON: () => object
83      readonly displayName: string | null
84      readonly email: string | null
85      readonly phoneNumber: string | null
86      readonly photoURL: string | null
87      readonly providerId: string
88      readonly uid: string
89    } | null,
90    | User
91    | {
92        readonly emailVerified: boolean
93        readonly isAnonymous: boolean
94        readonly metadata: {
95          readonly creationTime?: string | undefined
96          readonly lastSignInTime?: string | undefined
97        }
98        readonly providerData: {
99          readonly displayName: string | null
100          readonly email: string | null
101          readonly phoneNumber: string | null
102          readonly photoURL: string | null
103          readonly providerId: string
104          readonly uid: string
105        }[]
106        readonly refreshToken: string
107        readonly tenantId: string | null
108        delete: () => Promise<void>
109        getIdToken: (forceRefresh?: boolean) => Promise<string>
110        getIdTokenResult: (forceRefresh?: boolean) => Promise<IdTokenResult>
111        reload: () => Promise<void>
112        toJSON: () => object
113        readonly displayName: string | null
114        readonly email: string | null
115        readonly phoneNumber: string | null
116        readonly photoURL: string | null
117        readonly providerId: string
118        readonly uid: string
119      }
120    | null
121  >
122}
123```
124