How to avoid a JSON object with numbers as keys getting interpreted as an array when uploading to Firebase Real Time Database?

Question

I am using Typescript with Enums to create some dynamic object structure. These enums are represented as numbers in the object, not as their string value, which I want to keep as it is. When I am uploading these objects to the Firebase RTDB, the objects are misinterpreted as arrays.

Enum example in typescript

enum TableState {
  Standby = 0,
  Idle,
  In_Game,
  Maintenance,
}

Javascript object I want to upload to the Google RTDB

configuration_per_state: {
  [TableState.Idle]: {
    brightness: 10,
  },
  [TableState.In_Game]: {
    brightness: 10,
    duration: 20 * 60, //20 minutes,
  }
}

which is the following stringified JSON:

{
    "configuration_per_state": {
        "1": {
            "brightness": 10
        },
        "2": {
            "brightness": 10,
            "duration": 120
        }
    }
}

I now faced the issue that when uploading to the Firebase Real Time Database, the object gets interpreted as an array. So when I want to retrieve the data the object structure was changed by the DB.

Code to upload the object:

const createInitialConfigInDb = (
  tableConfig: InitialTableState): Promise<any> => {
  return new Promise((resolve, reject) => {
    const userId = auth.currentUser?.uid
    db.ref(`config/${userId}/general`).set(tableConfig).then((data) => {
      //success callback
      resolve(data)
    }).catch((error) => {
      //error callback
      reject(error)
    })
  })
};

Resulting JSON after uploading to the database and downloaded from the RTDB:

{
  "configuration_per_state" : [ null, {
    "brightness" : 10,
  }, {
    "brightness" : 10,
    "duration" : 1200,
  } ],
}

Firstly I don't get why there is an entry "null" as the first array entry ... And secondly is there an easy way to avoid this behaviour?

Frank van Puffelen · Accepted Answer · 2022-01-30 20:36:30Z

2

Firebase interprets you data as an array, and the null it adds indicates that there's no element at index 0 in the array.

Firebase Realtime Database's array coercion/interpretation cannot be configured.

The only way to prevent it from interpreting your data as an array, is by not using numeric keys.

My common solution is to prefix such keys with a short, constant string value. For example:

{
  "configuration_per_state" : {
    "key_1": 
      "brightness" : 10,
    }, 
    "key_2": {
      "brightness" : 10,
      "duration" : 1200,
    }
  }
}

answered Jan 30, 2022 at 20:36

Frank van Puffelen

603k85 gold badges896 silver badges869 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

tickietackie Over a year ago

Ok, got it, thanks. Any idea how to do this best with my dynamic enum object creation I want to keep? Changing all enums to strings seems like not a good solution for the web app. Maybe changing the keys right before the upload and again when downloading them? But this also does not seem a very good solution to me. But it sounds to me I do not really have other possibilities, do I?

Frank van Puffelen Over a year ago

"key_"+[TableState.Idle]: { ... }?

tickietackie Over a year ago

Is another idea, I can consider. Will have to decide which one I take then. But given that the question is answered. Thanks.

Collectives™ on Stack Overflow

How to avoid a JSON object with numbers as keys getting interpreted as an array when uploading to Firebase Real Time Database?

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related