Google authentication in firebase showing blank screen Progressive Web App

Question

I am on the way to create my first Progressive web app which uses firebase for storing data. I am also using Gmail as an entry point for all the users that would us

Answer 1

The redirect auth does not work on PWAs (likely uses different browser instances in some cases). You can get around this by using the pop-up auth flow:

https://firebase.google.com/docs/auth/web/google-signin

It would look something like this:

firebase.auth().signInWithPopup(provider).then(function(result) {
  // This gives you a Google Access Token. You can use it to access the Google API.
  var token = result.credential.accessToken;
  // The signed-in user info.
  var user = result.user;
  // ...
}).catch(function(error) {
  // Handle Errors here.
  var errorCode = error.code;
  var errorMessage = error.message;
  // The email of the user's account used.
  var email = error.email;
  // The firebase.auth.AuthCredential type that was used.
  var credential = error.credential;
  // ...
});

Only flow difference is that it launches a pop up browser window, instead of redirecting the current instance. This simplifies some of the logic for getting the auth result as well. If you prefer to retain the normal flow on non-PWAs, you can detect if the app was launched from home screen:

https://developers.google.com/web/updates/2015/10/display-mode