Firebase v3.1 Web SDK - Github oAuth Not Working - javascript

I'm not gonna post a bunch of code, unless I have to. It's mostly pasted straight from Firebase.google.com. I got every authentication method working fine but Github oAuth is all kinds of screwed up. So after a while I decided to go from Firebase v3.0 to 3.1. No fix.
The redirect page does pop up but I can't use my regular Github credentials - the Github account used to create the developer app (even though I log out of Github in my other web tab. My authAction() catch says:
An account already exists with the same email address but different
sign-in credentials. Sign in using a provider associated with this
email address.
So, I created a second dummy Github account and I now can log in using that. However upon logging in, user.email and user.displayName come back null.
Another strange thing: When logged out of every app, I log in to my Firebase app via Github oAuth and then open a new tab and navigate to Github, I'm already logged in! Presumably, somehow my token is shared between websites? Google, Facebook, Twitter, Anon, and Email/Pwd all work fine.
Anyone have this Github oAuth issue too or is it just me?...

When you get the error:
An account already exists with the same email address but different sign-in credentials. Sign in using a provider associated with this email address.
It means you already signed in using the same email with a different provider. You can sign in to the same provider and then link the github account to that current user. You can call firebase.auth(().currentUser.link(githubCred) or firebase.auth(().currentUser.linkWithPopup/Redirect(githubProvider)
As for Github not providing your email and name, you could have your github account settings set to not disclose your email and info. Typically you have to ask for the user:email oauth scope if you are using signInWithPopup/signInWithRedirect but that is currently not working with Firebase. The team is working on a fix.
Regarding your third issue, I am not sure I understand this correctly. When you sign in to Firebase using Github or any other provider, you will need to login to that provider before consenting to that app's permissions. If you navigate to that provider's site, it is normal to be logged in. If you try to sign in with Firebase using github on a different app, you would still be logged in to github but you would be asked to consent to that app's new permissions.

Related

Firebase error with Google Authentication

I am trying out google firebase authentication for my college project. I have implemented the login and signup with email functionality using firebase and it works fine. But, when i implemented the sign up with google functionality, its show this. When i click on advanced then it works and i can login.
I have to remove this warning. As this is just simple college project, i dont want to verify. Give me a solution and if its not possible without verification, then tell me how can i verify this website.I dont even have a domain name for this project.
have you hosted your app may be on netlify or vercel?
In that case, you have to add a custom domain i.e. your hosted web address in the firebase console > authentication settings > authorized domain.

Authenticate a user from via a widget using Firebase Auth

Context:
I am currently working on an embeddable widget, something akin to Intercom or
Hotjar, and have the need to authenticate users. Thus far, I got away with
using Passwordless authentication using Firebase auth but users complain that
it's a high friction process, and they'd rather not do it at all. The ideal
authentication solution would be to let users use their Google or Facebook
account and authenticate via OAuth2.
Problem:
Firebase Auth restricts authenticating via 3rd party auth providers if the
domain the user authenticates via is not whitelisted in the authorized domains
list. So if the user puts the code in abc.com, and tries to auth via Google
firebase rejects it because abc.com is not in the whitelist. Whitelisting the
domain of every client is unorthodox. I feel like the way I'm approaching it
is wrong because I can't correctly build up a mental model of how this would
work out. Technically cookies, sessions, etc. are pointless.
Question:
How would I go about providing the ability to let users authenticate via 3rd
party auth providers? Is this even technically possible?
Potential Solutions:
Host the widget at the main app in a dynamic route (the website where the user
would get the widget's code) and render this route as an iframe in the
client's website. (ex: /widgets/{widgetID} would have the widget). I don't
want to do this really because iframes are a serious pain but this sounds like
the most feasible.
I'd like to know more/better solutions to address this particular situation.
It doesn't matter even if it's from a different cloud provider or a different
authentication service. The goal is to authenticate the user from the widget
ideally via a 3rd party auth provider like Google.
EDIT: This is the error that I currently receive:
widget.js:2 auth/unauthorized-domain This domain (xyz.com) is not authorized to run this operation. Add it to the OAuth redirect domains list in the Firebase console -> Auth section -> Sign in method tab.
Based on your use case, you need to verify the domain ownership xyz.com by following this guide
After that you need to add xyz.comto Authorized domains your, as the error message mentioned.
Add it to the OAuth redirect domains list in the Firebase console -> Auth section -> Sign in method tab.
For more information please check this guide
Is not possible enable Google Sign In by using a domain unverified or unauthorized, this is to protect the access to your sites/projects by restricting the usage of the Firebase/Google credentials only for configured domains.
There is no way to disable this setting, Google sign in uses Oauth2 as authentication framework

OAuth flow for Google Drive App

Background: I have created and installed a Google Drive App. It sits in my https://apps.google.com/u/1/user/hub as seen in the image below.
I am signed into my Google account to be on this page. When I click on one of these installed apps the behaviour is very inconsistent.
If I am signed into multiple google accounts in the browser, it asks me to sign-in with google when I arrive on the app but then sometimes it just signs me in automatically.
If I have already signed into the app separately from Google Drive, then it uses the existing login profile on the app.
If I have only signed into one google account on my browser it sometimes signs me in to this account on the app and sometimes does not.
I have scoured far and wide for documentation and all I have found is this snippet from https://developers.google.com/drive/v3/web/practices:
Treat all Create New and Open with events like potential logins. Some
users may have multiple accounts. If the user ID in the state
parameter does not match the current session, you may need to end the
current session for your app and log in as the requested user.
But this snippet doesn't mention if any OAuth login flow is done automatically when you arrive on the app.
The question: Does anyone know how the OAuth flow logic actually works when you open an installed app from Google Drive, either by clicking on the app (as in the picture above) or by opening/creating a file in Google Drive with the app?
My desired outcome is that the app is always logged in with the account that the user is using in Google Drive when they clicks the link, without having to sign-in with Google again on the app, or needing to switch account.
Check the About Authorization for Drive API. It describes the OAuth flow. Or you can just opt to use one gmail account in your browser to avoid confusion altogether.

Firebase Authentication Issues Juggling Anonymous And AuthProvider Accounts

I am having issues figuring out how to implement the functionality for my current tasks. I will try to explain the situation simply:
The app is an Angular 2 webapp that uses Firebase for authentication. when the app loads up, the user is automatically authenticated anonymously (since we have database and file storage rules that are set to "auth != null".
Then later in the app there is a feature that the user can only use when authenticated through an auth provider (Google). If I try to just sign in with Google it saying that the user is already signed in.
So we can sign out, and then try to authenticate with Google. But then what if the user closes the auth popup box or denies giving the app permissions? Then the user is not authenticated at all!
And if we re-authenticate anonymously if the Google sign-in fails then we have a completely different username (created from the uid) which is very weird UX for the user.
Perhaps I am not thinking about it correctly, but I just don't see any good solution for what I'm trying to do. Hopefully, someone else can find a better solution. Thanks!

Is the Facebook JavaScript API suitable to create user accounts?

I want users to be able to register on my mobile (web based) app and login using their Facebook account. Is this possible using the JavaScript API?
The user can login using Facebook, and the userID and auth code of that user can be sent to my server to create the account, but I see a security flaw because then anyone could then log in as anyone by sending a userID and their own auth code. So can user accounts not be done with the JavaScript API and only with a server side API?
All Facebook requests are also signed with a secret key that belongs to the app you've registered to handle Facebook sign-ups on your website, so you can use that to verify it comes from Facebook and not someone else.
This is also outlined in the registration documentation
Strictly speaking, it is not possible for the Facebook SDKs to explicitly create a new user. However, when you implement a 'Login with Facebook' button (see here for JS and here for PHP), Facebook's OAuth dialog appears, which will prompt the user to log in (if they are not already) or to sign up with Facebook, thereby creating a new account, albeit not under your control.

Categories