so I have a website, which has 2 firebase projects. One is my own firebase app (A), and another is the user's firebase app (B) who will be using my website. Consider it as a dashboard kind-of thing that i'm building where the user puts in their firebase-config and I have to fetch data from their firebase app B and display it on the website. But here's where my problem is, I'm not able to fetch their app's data because of security rules.

As the user is only authenticated for firebase project A, so while I'm trying to fetch data from B, it's throwing me Access Denied due to their security rules only allowing requests having an auth object.

(If there was a way to allow requests from a specific domain or something similar, my life would have been so easier right now.)

So to get around this, I decided to also auth the user in B but i cannot simply do it like so:

createUserWithEmailAndPassword(authForProject1, email, password)
  .then((userCredential) => {
    createUserWithEmailAndPassword(authForProject2, email, password);
  })

Because I don't have the user's config at the time of authentication, I cannot do this method.

So then i tried to authenticate with custom tokens, but apparently tokens from app A don't work in app B. I was trying to createCustomToken() from my app and signinWithCustomToken() from their app, as i only have the admin keys for A and not B. And i won't be taking the admin keys from my users because that means literally giving me their project's private key.

After failing again, I decided to store the user's login details in window.localStorage (email and password encrypted) and auth the user in app B whenever I get the config. But this was a bad idea, (I think i should never store creds in localstorage) so i never tried this.

I'm now literally at a blocker and have no idea how to move forward. Any help is appreciated.