feat(emulator): work without a service account

Author: posva

packages/nuxt/src/module.ts

@@ -10,14 +10,18 @@ import {
 } from '@nuxt/kit'
 // cannot import from firebase/app because the build fails, maybe a nuxt bug?
 import type { FirebaseApp, FirebaseOptions } from '@firebase/app-types'
-import type { AppOptions, App as FirebaseAdminApp } from 'firebase-admin/app'
+import type { App as FirebaseAdminApp } from 'firebase-admin/app'
 import { markRaw } from 'vue'
 import { consola } from 'consola'
 import {
   VueFireNuxtModuleOptions,
   VueFireNuxtModuleOptionsResolved,
 } from './module/options'
-import { FirebaseEmulatorsToEnable, detectEmulators } from './module/emulators'
+import {
+  FirebaseEmulatorsToEnable,
+  detectEmulators,
+  willUseEmulators,
+} from './module/emulators'
 
 const logger = consola.withTag('nuxt-vuefire module')
 
@@ -47,6 +51,13 @@ export default defineNuxtModule<VueFireNuxtModuleOptions>({
     const runtimeDir = fileURLToPath(new URL('./runtime', import.meta.url))
     const templatesDir = fileURLToPath(new URL('../templates', import.meta.url))
 
+    // we need this to avoid some warnings about missing credentials and ssr
+    const hasEmulatorsEnabled = await willUseEmulators(
+      options,
+      resolve(nuxt.options.rootDir, 'firebase.json'),
+      logger
+    )
+
     // to handle TimeStamp and GeoPoints objects
     addPlugin(resolve(runtimeDir, 'payload-plugin'))
 
@@ -55,6 +66,8 @@ export default defineNuxtModule<VueFireNuxtModuleOptions>({
     nuxt.options.appConfig.firebaseConfig = markRaw(options.config)
     nuxt.options.appConfig.vuefireOptions = markRaw(options)
 
+    nuxt.options.runtimeConfig.vuefire = { options }
+
     nuxt.options.build.transpile.push(runtimeDir)
     nuxt.options.build.transpile.push(templatesDir)
 
@@ -83,24 +96,28 @@ export default defineNuxtModule<VueFireNuxtModuleOptions>({
     // NOTE: the order of the plugins is reversed, so we end by adding the app plugin which is used by all other
     // plugins
 
-    if (options.auth) {
-      if (nuxt.options.ssr && !hasServiceAccount) {
-        logger.warn(
-          'You activated both SSR and auth but you are not providing a service account for the admin SDK. See https://vuefire.vuejs.org/nuxt/getting-started.html#configuring-the-admin-sdk.'
-        )
-      }
-
-      if (options.appCheck) {
-        addPlugin(resolve(runtimeDir, 'app-check/plugin.client'))
-        // TODO: ensure this is the only necessary check. Maybe we need to check if server
+    if (options.appCheck) {
+      addPlugin(resolve(runtimeDir, 'app-check/plugin.client'))
+      // TODO: ensure this is the only necessary check. Maybe we need to check if server
+      if (!hasEmulatorsEnabled) {
         if (hasServiceAccount) {
+          // this is needed by the api endpoint to properly work if no service account is provided, otherwise, the projectId is within the service account
           addPlugin(resolve(runtimeDir, 'app-check/plugin.server'))
         } else if (nuxt.options.ssr) {
           logger.warn(
             'You activated both SSR and app-check but you are not providing a service account for the admin SDK. See https://vuefire.vuejs.org/nuxt/getting-started.html#configuring-the-admin-sdk.'
           )
         }
       }
+    }
+
+    if (options.auth) {
+      // TODO: should be fine if emulators are activated
+      if (nuxt.options.ssr && !hasServiceAccount && !hasEmulatorsEnabled) {
+        logger.warn(
+          'You activated both SSR and auth but you are not providing a service account for the admin SDK. See https://vuefire.vuejs.org/nuxt/getting-started.html#configuring-the-admin-sdk.'
+        )
+      }
 
       // this adds the VueFire plugin and handle SSR state serialization and hydration
       addPluginTemplate({
@@ -112,7 +129,11 @@ export default defineNuxtModule<VueFireNuxtModuleOptions>({
         },
       })
 
-      if (options.auth && nuxt.options.ssr && hasServiceAccount) {
+      if (
+        options.auth &&
+        nuxt.options.ssr &&
+        (hasServiceAccount || hasEmulatorsEnabled)
+      ) {
         // Add the session handler than mints a cookie for the user
         addServerHandler({
           route: '/api/__session',
@@ -143,22 +164,9 @@ export default defineNuxtModule<VueFireNuxtModuleOptions>({
     }
 
     // Emulators must be enabled after the app is initialized but before some APIs like auth.signinWithCustomToken() are called
-    const isEmulatorEnabled =
-      typeof options.emulators === 'object'
-        ? options.emulators.enabled
-        : !!options.emulators
 
-    if (
-      // Disable emulators on production unless the user explicitly enables them
-      (process.env.NODE_ENV !== 'production' ||
-        process.env.VUEFIRE_EMULATORS) &&
-      isEmulatorEnabled
-    ) {
-      const emulators = await detectEmulators(
-        options,
-        resolve(nuxt.options.rootDir, 'firebase.json'),
-        logger
-      )
+    if (hasEmulatorsEnabled) {
+      const emulators = detectEmulators(options, hasEmulatorsEnabled, logger)
 
       // expose the detected emulators to the plugins
       nuxt.options.runtimeConfig.public.vuefire ??= {}
@@ -189,7 +197,7 @@ export default defineNuxtModule<VueFireNuxtModuleOptions>({
         )
       }
 
-      if (hasServiceAccount) {
+      if (hasServiceAccount || hasEmulatorsEnabled) {
         if (options.auth) {
           // decodes user token from cookie if any
           addPlugin(resolve(runtimeDir, 'auth/plugin-user-token.server'))
@@ -286,7 +294,7 @@ interface VueFireRuntimeConfig {
      * Options passed to the Nuxt VueFire module
      * @internal
      */
-    options?: VueFireNuxtModuleOptionsResolved
+    options?: VueFireNuxtModuleOptions
   }
 }
 

packages/nuxt/src/module/emulators.ts

@@ -3,24 +3,26 @@ import stripJsonComments from 'strip-json-comments'
 import type { ConsolaInstance } from 'consola'
 import type { VueFireNuxtModuleOptions } from './options'
 
-/**
- * Detects the emulators to enable based on the `firebase.json` file. Returns an object of all the emulators that should
- * be enabled based on the `firebase.json` file and other options and environment variables.
- *
- * @param options - The module options
- * @param firebaseJsonPath - resolved path to the `firebase.json` file
- * @param logger - The logger instance
- */
-export async function detectEmulators(
-  { emulators: _emulatorsOptions, auth }: VueFireNuxtModuleOptions,
+export async function willUseEmulators(
+  { emulators }: VueFireNuxtModuleOptions,
   firebaseJsonPath: string,
   logger: ConsolaInstance
-) {
+): Promise<FirebaseEmulatorsJSON | null> {
+  const isEmulatorEnabled =
+    (typeof emulators === 'object' ? emulators.enabled : !!emulators) &&
+    // Disable emulators on production unless the user explicitly enables them
+    (process.env.NODE_ENV !== 'production' || process.env.VUEFIRE_EMULATORS)
+
+  // Avoid even checking the firebase.json
+  if (!isEmulatorEnabled) {
+    return null
+  }
+
   const fileStats = await stat(firebaseJsonPath)
   if (!fileStats.isFile()) {
-    return
+    return null
   }
-  let firebaseJson: FirebaseEmulatorsJSON
+  let firebaseJson: FirebaseEmulatorsJSON | null = null
   try {
     firebaseJson = JSON.parse(
       stripJsonComments(await readFile(firebaseJsonPath, 'utf8'), {
@@ -30,9 +32,24 @@ export async function detectEmulators(
   } catch (err) {
     logger.error('Error parsing the `firebase.json` file', err)
     logger.error('Cannot enable Emulators')
-    return
   }
 
+  return firebaseJson
+}
+
+/**
+ * Detects the emulators to enable based on the `firebase.json` file. Returns an object of all the emulators that should
+ * be enabled based on the `firebase.json` file and other options and environment variables.
+ *
+ * @param options - The module options
+ * @param firebaseJsonPath - resolved path to the `firebase.json` file
+ * @param logger - The logger instance
+ */
+export function detectEmulators(
+  { emulators: _emulatorsOptions, auth }: VueFireNuxtModuleOptions,
+  firebaseJson: FirebaseEmulatorsJSON,
+  logger: ConsolaInstance
+) {
   // normalize the emulators option
   const emulatorsOptions =
     typeof _emulatorsOptions === 'object'

packages/nuxt/src/runtime/auth/api.session-verification.ts

@@ -9,16 +9,23 @@ import {
 } from 'h3'
 import { getAdminApp } from 'vuefire/server'
 import { logger } from '../logging'
+import { useRuntimeConfig } from '#imports'
 
 /**
  * Setups an API endpoint to be used by the client to mint a cookie based auth session.
  */
 export default defineEventHandler(async (event) => {
   assertMethod(event, 'POST')
   const { token } = await readBody<{ token?: string }>(event)
+  const { vuefire } = useRuntimeConfig()
 
-  logger.debug('Getting the admin app')
-  const adminApp = getAdminApp(undefined, 'session-verification')
+  const adminApp = getAdminApp(
+    {
+      projectId: vuefire?.options?.config?.projectId,
+      ...vuefire?.options?.admin?.options,
+    },
+    'session-verification'
+  )
   const adminAuth = getAdminAuth(adminApp)
 
   logger.debug(token ? 'Verifying the token' : 'Deleting the session cookie')

src/auth/index.ts

@@ -1,5 +1,5 @@
 import type { FirebaseApp } from 'firebase/app'
-import { getAuth, initializeAuth, type User } from 'firebase/auth'
+import { getAuth, type User } from 'firebase/auth'
 import { App, ref } from 'vue-demi'
 import { useFirebaseApp } from '../app'
 import { getGlobalScope } from '../globals'