Firebase-Admin with Nuxt

Question

I am trying to consume a Firestore database with Nuxt. But the following code generates an error when compiling. I leave several excerpts from the project I'm doing

In this file I have configured the database credentials path

README.md

$env:GOOGLE_APPLICATION_CREDENTIALS="D:\Educacion\Proyectos\Go\social\whatsapp-f91a0.json"

nuxt.config.js

plugins: [
    '@plugins/firebase.js'
  ],

Plugins

firebase.js

var admin = require("firebase-admin");

var serviceAccount = require("whatsapp-f91a0.json");

admin.initializeApp({
  credential: admin.credential.cert(serviceAccount),
  databaseURL: "https://whatsapp-f91a0.firebaseio.com"
});

const db = admin.database();

export {db}

index.vue

<script>
import db from 'firebase';

  db.collection('categorias').doc('aaa').get()
  .then(doc=>{
    if (!doc.exists){
      console.log('no existe')
    }
  })
  .catch(err=>{
    console.error('error', err);
    process.exit();
  });
</script>

Here I get an error when compiling

Error

 WARN  Compiled with 3 warnings                                                                                                    friendly-errors 17:54:45  


 WARN  in ./node_modules/hash-stream-validation/index.js                                                                           friendly-errors 17:54:45  

Module not found: Error: Can't resolve 'fast-crc32c' in 'D:\Educacion\Proyectos\Go\social\node_modules\hash-stream-validation'     friendly-errors 17:54:45
                                                                                                                                   friendly-errors 17:54:45

 WARN  in ./node_modules/retry-request/index.js                                                                                    friendly-errors 17:54:45  

Module not found: Error: Can't resolve 'request' in 'D:\Educacion\Proyectos\Go\social\node_modules\retry-request'                  friendly-errors 17:54:45
                                                                                                                                   friendly-errors 17:54:45  

 WARN  in ./node_modules/configstore/node_modules/write-file-atomic/index.js                                                       friendly-errors 17:54:45  

Module not found: Error: Can't resolve 'worker_threads' in 'D:\Educacion\Proyectos\Go\social\node_modules\configstore\node_modules\write-file-atomic'        
                                                                                                                                   friendly-errors 17:54:45  

 ERROR  Failed to compile with 20 errors                                                                                           friendly-errors 17:54:45  

These dependencies were not found:                                                                                                 friendly-errors 17:54:45
                                                                                                                                   friendly-errors 17:54:45  
* child_process in ./node_modules/google-auth-library/build/src/auth/googleauth.js                                                 friendly-errors 17:54:45  
* dns in ./node_modules/@grpc/grpc-js/build/src/resolver-dns.js                                                                    friendly-errors 17:54:45  

 WARN  in ./node_modules/configstore/node_modules/write-file-atomic/index.js                                                       friendly-errors 17:54:45  

Module not found: Error: Can't resolve 'worker_threads' in 'D:\Educacion\Proyectos\Go\social\node_modules\configstore\node_modules\write-file-atomic'        
                                                                                                                                   friendly-errors 17:54:45  

 ERROR  Failed to compile with 20 errors                                                                                           friendly-errors 17:54:45  

These dependencies were not found:                                                                                                 friendly-errors 17:54:45  
                                                                                                                                   friendly-errors 17:54:45  
* child_process in ./node_modules/google-auth-library/build/src/auth/googleauth.js                                                 friendly-errors 17:54:45  
* dns in ./node_modules/@grpc/grpc-js/build/src/resolver-dns.js                                                                    friendly-errors 17:54:45  
* fs in ./node_modules/@google-cloud/storage/build/src/file.js, ./node_modules/@grpc/grpc-js/build/src/tls-helpers.js and 8 others friendly-errors 17:54:45  
* http2 in ./node_modules/@grpc/grpc-js/build/src/server.js                                                                        friendly-errors 17:54:45  
* net in ./node_modules/@grpc/grpc-js/build/src/resolver-dns.js, ./node_modules/http-proxy-agent/dist/agent.js and 1 other         friendly-errors 17:54:45  
* tls in ./node_modules/@grpc/grpc-js/build/src/channel-credentials.js, ./node_modules/http-proxy-agent/dist/agent.js and 1 other  friendly-errors 17:54:46  
* whatsapp-f91a0.json in ./plugins/firebase.js  

Could someone help me please

Answer 1

Nuxt is a frontend framework with the goal of serve the content in a variety of ways (including server side).

Firebase-admin is a server side library. You could make it work with some tweaks here and there but it's not recommendable at all, starting from the fact that you'd have to make your credentials public.

Use Firebase Javascript SDK optionally with Firebase-Nuxt in combination of a set of rules and auth claims , so you can work as admin.

Answer 2

One way to do this is to initialize the app two different times, one on the server and one on the client. On nuxt.config.js, make sure you do something like this

serverMiddleware : [
    { 
      path : '/api',
      handler : '~/api/serversidefirebase.js'
    }
],
plugins: [
    {
      src : '~/plugins/clientsidefirebase.js',
      ssr : false
    },
]

Register your API in the serverMiddleware and for all client side plugins, specify ssr: false. tadaaa..