Nuxt.js: Firebase firestore not working with Nuxt in server side execution.

Created on 18 Apr 2019  路  3Comments  路  Source: nuxt/nuxt.js

Version

v2.6.2

Reproduction link

https://github.com/ThomasKientz/nuxt-firestore-repro

Steps to reproduce

npm install

npm run dev

navigate to website.

check the console.

What is expected ?

The firebase query to execute without any errors.

What is actually happening?

On server side (from a page reload), the firebase library produces an error. It looks like the firestore js library doesn't recognize objects from the async hook. Maybe nuxt is modifying prototypes or is messing with objects.

Additional comments?

I am trying to query data by date from Firestore with Nuxt in an Universal App :

asyncData() {
    citiesRef
      .where("date", ">", new Date())
      .get()
      .then(() => {
        console.log("ok");
      })
    return {};
  }

But I get the error when loading from the server side (not happening in client side) :

Function Query.where() called with invalid data. Unsupported field value: a custom Date object

Similar error with :

asyncData() {
    citiesRef
      .add({
        name: "Tokyo"
      })
      .then(function(docRef) {
        console.log("Document written with ID: ", docRef.id);
      });
    return {};
  }

Function CollectionReference.add() requires its first argument to be of type object, but it was: a custom Object object

It doesn't happen with the client side context.

It's doesn't appear to be a firebase error as I can not reproduce this on a simple node env with the same lib : https://github.com/ThomasKientz/firestore-node-repro

This bug report is available on Nuxt community (#c9071)
bug-report stale

All 3 comments

Thanks for your contribution to Nuxt.js!
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.
If you would like this issue to remain open:

  1. Verify that you can still reproduce the issue in the latest version of nuxt-edge
  2. Comment the steps to reproduce it

Issues that are labeled as pending will not be automatically marked as stale.

const firebase = require("firebase/app");
citiesRef
      .where("date", ">", firebase.firestore.Timestamp.fromDate(new Date()))
      .get()
      .then(() => {
        console.log("ok");
      })
    return {};

@1919yuan this solution worked for me. Thanks!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

VincentLoy picture VincentLoy  路  3Comments

mikekidder picture mikekidder  路  3Comments

bimohxh picture bimohxh  路  3Comments

vadimsg picture vadimsg  路  3Comments

gary149 picture gary149  路  3Comments