Database Emulator -- Auth token revoked: invalid_token/Unsupported jwt algorithm: none

[mdo5004]

[REQUIRED] Environment info macOS 11.2.3 node 12.20.1 firebase-tools 9.10.0 firebase JS SDK 8.4.2

[REQUEST] Test case Not receiving data from database emulator when used with Auth emulator.

Database emulator logs:

[2021-04-24T18:45:06.642Z]  @firebase/database: p:0: Making a connection attempt 
logger.ts:115 [2021-04-24T18:45:06.652Z]  @firebase/database: p:0: Auth token refreshed 
logger.ts:115 [2021-04-24T18:45:06.653Z]  @firebase/database: getToken() completed. Creating connection. 
logger.ts:115 [2021-04-24T18:45:06.653Z]  @firebase/database: c:0:15: Connection created 
logger.ts:115 [2021-04-24T18:45:06.654Z]  @firebase/database: c:0:15:0 Websocket connecting to wss://s-usc1c-nss-369.firebaseio.com/.ws?v=5&ls=Fyb9OFRNpzWZ8f9S8JNRDha2bvJulpck&ns=react-firebase-app-50cb5 
logger.ts:115 [2021-04-24T18:45:06.778Z]  @firebase/database: c:0:15:0 Websocket connected. 
logger.ts:115 [2021-04-24T18:45:06.778Z]  @firebase/database: c:0:15: Realtime connection established. 
logger.ts:115 [2021-04-24T18:45:06.778Z]  @firebase/database: p:0: connection ready 
logger.ts:115 [2021-04-24T18:45:06.779Z]  @firebase/database: p:0: {"r":677,"a":"auth","b":{"cred":"eyJhbGciOiJub25lIiwidHlwIjoiSldUIn0.eyJuYW1lIjoiTWljaGFlbCIsInBpY3R1cmUiOiIiLCJlbWFpbCI6Im1pY2hhZWxkYXZpZG9jb25uZWxsQGdtYWlsLmNvbSIsImVtYWlsX3ZlcmlmaWVkIjpmYWxzZSwiYXV0aF90aW1lIjoxNjE5Mjg5OTA2LCJ1c2VyX2lkIjoieEFFVTZHTWU4dWp4VGhFc25wN0lJM1Z5SDE1UCIsImZpcmViYXNlIjp7ImlkZW50aXRpZXMiOnsiZW1haWwiOlsibWljaGFlbGRhdmlkb2Nvbm5lbGxAZ21haWwuY29tIl19LCJzaWduX2luX3Byb3ZpZGVyIjoicGFzc3dvcmQifSwiaWF0IjoxNjE5Mjg5OTA2LCJleHAiOjE2MTkyOTM1MDYsImF1ZCI6InJlYWN0LWZpcmViYXNlLWFwcC1kZXYiLCJpc3MiOiJodHRwczovL3NlY3VyZXRva2VuLmdvb2dsZS5jb20vcmVhY3QtZmlyZWJhc2UtYXBwLWRldiIsInN1YiI6InhBRVU2R01lOHVqeFRoRXNucDdJSTNWeUgxNVAifQ."}} 
logger.ts:115 [2021-04-24T18:45:06.779Z]  @firebase/database: p:0: Listen on /data for default 
logger.ts:115 [2021-04-24T18:45:06.779Z]  @firebase/database: p:0: {"r":678,"a":"q","b":{"p":"/data","h":""}} 
logger.ts:115 [2021-04-24T18:45:06.823Z]  @firebase/database: p:0: from server: {"r":677,"b":{"s":"invalid_token","d":"Unsupported jwt algorithm: none"}} 
logger.ts:115 [2021-04-24T18:45:06.824Z]  @firebase/database: Auth token revoked: invalid_token/Unsupported jwt algorithm: none 
logger.ts:115 [2021-04-24T18:45:06.824Z]  @firebase/database: c:0:15: Closing realtime connection. 
logger.ts:115 [2021-04-24T18:45:06.824Z]  @firebase/database: c:0:15: Shutting down all connections 
logger.ts:115 [2021-04-24T18:45:06.824Z]  @firebase/database: c:0:15:0 WebSocket is being closed 
logger.ts:115 [2021-04-24T18:45:06.824Z]  @firebase/database: p:0: data client disconnected 
logger.ts:115 [2021-04-24T18:45:06.824Z]  @firebase/database: p:0: Window isn't visible.  Delaying reconnect. 
logger.ts:115 [2021-04-24T18:45:06.825Z]  @firebase/database: p:0: Trying to reconnect in 217471.1922366258ms 
logger.ts:115 [2021-04-24T18:45:06.825Z]  @firebase/database: 0: onDisconnectEvents 
react_devtools_backend.js:2557 [2021-04-24T18:45:06.825Z]  @firebase/database: FIREBASE WARNING: Provided authentication credentials for the app named "[DEFAULT]" are invalid. This usually indicates your app was not initialized correctly. Make sure the "apiKey" and "databaseURL" properties provided to initializeApp() match the values provided for your app at https://console.firebase.google.com/. 
overrideMethod @ react_devtools_backend.js:2557
defaultLogHandler @ logger.ts:115
Logger.warn @ logger.ts:206
warn @ index.esm.js:314
FirebaseAuthTokenProvider.notifyForInvalidToken @ index.esm.js:774
PersistentConnection.onAuthRevoked_ @ index.esm.js:3845
(anonymous) @ index.esm.js:3418
PersistentConnection.onDataMessage_ @ index.esm.js:3566
Connection.onDataMessage_ @ index.esm.js:2411
Connection.onPrimaryMessageReceived_ @ index.esm.js:2405
(anonymous) @ index.esm.js:2307
WebSocketConnection.appendFrame_ @ index.esm.js:1917
WebSocketConnection.handleIncomingFrame @ index.esm.js:1965
mySock.onmessage @ index.esm.js:1864
logger.ts:115 [2021-04-24T18:45:06.877Z]  @firebase/database: c:0:15:0 Websocket connection was disconnected. 

[REQUIRED] Steps to reproduce

• Create new react app
• Initialize new firebase project
• Initialize Auth emulator & Database emulator
• Add firebase project credentials to initializeApp()
• Add firebase.database().useEmulator() and firebase.auth().useEmulator()
• Start emulators & react dev server
• Add a user with email & password to Auth emulator
• Add some data to Database emulator
• Add an email/password login form to App.js
• Add a database listener to App.js
• Log in with email/password

[REQUIRED] Expected behavior

Data should be received by web app

[REQUIRED] Actual behavior

Web app does not receive data from database

Originally posted by @mdo5004 in https://github.com/firebase/firebase-tools/issues/2758#issuecomment-825871943

Edit: dependencies

[samtstern]

@mdo5004 what's happening here is that you're sending an Auth emulator token to the production Realtime Database server, which is causing an error (as it should).

Can you show some of your code where you call initializeApp and useEmulator?

[mdo5004]

Thanks for your reply @samtstern! Here is my init code:

import firebase from 'firebase/app';
import 'firebase/auth';
import 'firebase/database';

const firebaseConfig = {
  ...
};

const fire = !firebase.apps.length ? firebase.initializeApp(firebaseConfig) : firebase.app();

export default fire;

firebase.database().useEmulator('localhost', 9000);
firebase.database.enableLogging(true);
console.log('using database emulator on port 9000');
firebase.auth().useEmulator('http://localhost:9099');
console.log('using auth emulator on port 9099');

[samtstern]

Hmmm nothing looks obviously wrong, but can you try changing your firebase.database() and firebase.auth() calls to fire.database() and fire.auth()? Also I assume elsewhere in your app when you access the database you're using fire.database().

[sincraianul]

Can confirm this is happening to me as well. Using firebase@8.4.2.

[mdo5004]

Changing my code to this does not fix the issue, unfortunately.

fire.database().useEmulator('localhost', 9000);
firebase.database.enableLogging(true);
console.log('using database emulator on port 9000');
fire.auth().useEmulator('http://localhost:9099');
console.log('using auth emulator on port 9099');

[jits]

This sounds like it may be related to https://github.com/firebase/firebase-js-sdk/issues/4110

Try putting your auth emulator line first, before the other emulators.

[mdo5004]

Thanks for your reply, but that did not work :-/

[mdo5004]

The issue seems to be isolated to the client-to-rtdb connection. Starting the functions emulator and adding a functions.auth.user().onCreate trigger successfully writes to the emulated rtdb.

[sincraianul]

Managed to get it working by overriding the config:

const config = {
  // your config
};

if (location.hostname === 'localhost') {
  config.databaseURL = 'http://127.0.0.1:9000/?ns=firebase-project-id';
}

For some reason, database().useEmulator doesn't seem to work as expected. Unsure if it's an edge case related to the following line or something else:

const fire = !firebase.apps.length ? firebase.initializeApp(firebaseConfig) : firebase.app();

[yn5]

This has kept me from using the database emulator for a while, @sincraianul fix fixes it for me too.