Do we need client-side flow or server-side flow or both to implement the login with facebook feature? - facebook

Currently on my website, users login with their login id and password, they are also required to enter their email when they register. Both login_id and email column on the users table have unique index. users table also stores other data associated with the user such as gender,last_name,first_name but these are optional (nullable) fields.
There are two changes I would like to make to the website.
The first one is, users can use their email (in addition to login_id) to login. For new users, when they register, they no longer need to provide a login_id because they will be using their email to login.
The second change is, they can login with facebook. For new users, if they login with facebook for the first time, their facebook uid will be obtained and stored in my database. This means I will have to add a facebook_uid column on the users table.
For existing users, when they login with facebook for the first time, I should first obtain their email address from their facebook profile and then check if there already exists a record using that email in the users table, if yes, their facebook uid will also be stored on the facebook_uid column on that record.
According to facebook, its platform supports two different OAuth 2.0 flows for user login: server-side flow and client-side flow. Which one or both is required for this use case?
Also, what problems can be anticipated when I implement the features like I describe above?

You could take either approach for this, it's entirely up to you. Both methods will give you the data you need, it's a question of how comfortable you are working on the back vs front end. You just need to ask for permission to access to the user's email address.
Problems that could happen: I'm not sure but there may be legal restrictions on storing the user's Facebook ID. Also, what if someone (not me, an evil person!) registers with my email address and you don't validate that they really have access to that address - then when I log in via Facebook, the app will assume we're the same person and the evil hacker now has access to my account. Unlikely scenario but could happen...

Related

How to linking a users data to his future account at the time of signup in Stitch

I would like to use Stitch to sign up users. Each user must have a unqiue email and a unique user-name.
This is important for applications like chats or forums, where users should not be forced to reveal their email when communicating.
I already implemented login with email and password as described here: https://docs.mongodb.com/stitch/authentication/userpass/#authenticate-a-user
The problem is:
How to securely save a user-name on signup? I could store a users desired name in a collection and merge it into his custom user data after initial login. In order to do that, I would need to grant the user write privileges to whichever collection holds pending names. This is unsafe, since he could now change the name after the fact or even change other peoples names while they are pending.
The user needs to choose his name at the time of signup. At this time the user is still logged in via anonymous credentials. Hence, I can not restrict users to changing only their own data since they are at this point sill anonymous. I see no way of linking a users data to his future account at the time of signup. Any idea to change that?
It would seem strange, if stitch lacked the functionalities to easily sign up users with a unique name/handle in addition to email address.
I haven't used your exact software but in general I would approach the problem as follows:
When someone starts using the application anonymously, create a user object. The user at this point does not have a reserved (i.e. globally unique) user name, or email address, etc. But the user still has an internal identifier.
Associate user-visible state with the user object. This could be done through server-side sessions or signed cookies. (Unlike unsigned cookies, cryptographically signed cookies permit server to store what would otherwise have to be stored in the server-side session in a cookie, and trust that the client hasn't tampered with the information by e.g. changing the user id).
When user registers, set the user name, email address, etc. on the existing user object. User id remains the same and allows the user to continue to have access to their anonymously-generated data.
Have a process for deleting anonymous users that don't register after some time.

How to get email and username when Facebook registers

As far as I know, on the new Facebook API, there is no way to get the Facebook username. Also, if the user registered to Facebook, his or her account might lack an email address if he or she logged in with a phone number.
However, I am working on a project, where, upon login with Facebook, if the user does not have a user, then the Facebook login is interpreted as a registration. Since, according to my best knowledge, there is no way to get the Facebook username using the API, I am using the email field to generate a username, taking into account only letters.
However, in some cases, the username generated this way is duplicated, or the Facebook account does not have an email address. The best solution I can think about is to redirect the user to a form where he or she can enter the email and/or the username, but that would not help the user-experience.
Is there a way to gather these data without making the user enter them? Or something close to it?
First of all, you should always present the data you want to store to the user BEFORE you store it, and let him change it.
That being said, the (App Scoped) ID is the only thing that is really unique, you can either use the email directly (if the user is already registered, just add the Facebook ID to your database) and present an input field if there is no email - or generate a username with his first and last name. Present the chosen username to the user and let him change it, or tell him that it already exists.
After all, wouldn´t a user WANT to choose his username?
If you want to make it smooth for the user and don´t want to bug him in anyway, you can just store his Facebook ID. Or just use the email directly as username (including the # sign and the domain), as i wrote above. If that´s not good enough, you need to implement your own routine to auto-generate usernames. There´s no general logic from Facebook to do this.

How to manage users account from multi-provider (facebook, twitter) in my website?

I'm about to use one of those multi-provider authentication frameworks Opauth or Hybridauth (don't know which is the best but I had a little preference for the second one) so the consequence is that I have to manage multi account.
In fact I already have my own account management (login+password+email) and I had last year facebook users. Now I will have to deal with Twitter account, linkedin account, etc...
So the question is easy : how to manage the username ?
For instance, John create a account on my site. So "John" login/username is taken. But if another John from Facebook then another one from Twitter arrive, what i'm supposed to do ?
In Stackoverflow (or elsewhere), what is the practice ?
I don't want a John write on the behalf of another John. Today with my own system, I verify that the login (username) is unique. If not I reject the user. But now ?
I thought that I can check the email but... I learnt that email address can't be the key because of Twitter that doesn't give it to you.
Hope I'm clear enough :)
regards
As you say it's not possible to just retrieve the username from different sources and just store it. I don't know how it is done here in stackoverflow but if you try to register the name is optional so probably it is not an unique key. I can't see the way to login with twitter here so I bet that email is a unique key.
I'll try to answer your question but I've only used facebook API so maybe this can't be done with others. I suppose that each API gives you something you can store in your database and use it later to identify your user against their API.
If you allow users to register with facebook (or gmail, twitter...)then you can use the next approaches (I'm sure there are few more):
They always login with facebook (or twitter, gmail...): you store a record for them inside your database with the key provided by the API and other useful info you can collect. As you said each API gives you different things so you have to think in advance what you really need to provide your users with a good experience: is their name needed? age? If you need more data than the provided by the API you should jump to the next approach or prefetch it and make it editable before. Here you don't ask your user for a password so they can only login with facebook not with a login form, if a user tries to authenticate with facebook (or twitter, gmail) again you know which key you have to look for and authenticate your use.
The can create an account and link it with facebook (or whatever): you ask for facebook permission and then prefill a form for them to provide the data that is missing (password, mail if they use twitter...) and then create the record storing the unique key provided by the API as well to proceed exactly as step 1 if they use their facebook accounts to login. If you asked for a password and an email they can use a standard login form as well.
You can use the first approach and ask the user to change the attribute that is in conflict with other user (name in your case) or even ask to fill what is missing depending on which social network they are using to sign in. You can use name+surname as username to reduce the colission possibility if this is what you want to store to identify your user.
Hope this helps
HybridAuth gives you an excellent way to integrate your site with the social media...
http://hybridauth.sourceforge.net/
This should also help...

Integrate social network login however authenticate using existing credentials

We are looking to integrate Facebook, Google, Twitter into an existing site.
Unlike most implementations, the user MUST be a customer prior being able to login with Facebook, Google, etc. The current database design is as follows;
userid | username | password | customerno
So the idea is if a user decides to login using Facebook, we need to validate that they are also an existing customer using their customer number which is alphanumeric. Once authenticated, they are no longer required to authenticate using their customer number. If they are not yet a customer, they will first need to create an account with us.
Do I need to design a new table for each provider? If so what should the design look like?
How do I authenticate a user who has logged in using Facebook with their existing customer number?
How do I authenticate a user who has logged in using Facebook with their existing customer number?
That depends on what criteria you have to recognize someone as a customer …
IMHO the best and easiest way to connect Facebook users to existing accounts on some other page is the email address. If you don’t have that, and see no other reliable way to identify someone as a customer with the data that Facebook can provide – then maybe you could just ask the user for their customer id on your site before connecting their Facebook account.
As for your database design – if you read the email address on every connect/login, then you could just look that up to find your user id. Otherwise, you could either add extra fields to your existing user table, where you save someone’s Facebook/Google/... user id. But if you want to use multiple services, maybe it’d be better to put this data into a second table like
userid | foreign_user_id | type
where type would be one of 'facebook', 'google' etc. to identify the login provider that foreign_user_id comes from.

Social Network (Facebook, Twitter, etc) User Account Integration (duplicate scenario)

So there are definitely many tutorials out there regarding how to integrate various individual social network authentication/registration into existing user accounts. But the scenario I can't seem to find out much information about is if a user signs into your account with different social network credentials. For example:
Scenario #1
User registers on site using site's authentication.
User then signs in/registers on site using Facebook Connect.
User then signs in/registers on site using Twitter.
How do I integrate all of these into one account?
Obviously once a user is registered, they can add other social network associations in the account settings pages. But I am more concerned if they register via the other social network not remembering they are already setup.
My general thoughts are trying to figure out a way to use the "username" or email to try and guess and present the user a way to combine accounts right there.
Anyone have any thoughts?
following up -
if your users can't remember that they've signed up previously, well, best of luck to them in general ;)
much as you described, i'm planning on giving users the option to link additional accounts once they have signed in by one means or another.
but as far as cross-checking, there's only so much you can do. many social network APIs do indeed provide email addresses (once you've busted in through OAuth) but these may be accessible only if a user has elected to make his/her address public, which is not guaranteed.
also not guaranteed is that the user used the SAME email address for each social network account, so even if you manage to retrieve an address it may or not be of any use to you.
finally, if you find matching email addresses via such means, it might be advisable to prompt the user to link accounts rather than assume he/she wants this done automatically. some people like to maintain multiple personalities. i.e. "it looks like you are also signed up with twitter - do you want to link your accounts? it will make your life seem worth living."
you might consider offering incentives to link user accounts or to provide an email address (up to you of course to figure out what these might be, based on the functionality of your website).
solution i am working on, database-side, is to maintain multiple accounts and then if link information is discovered by various means, said link is indicated in a lookup table.
an alternative is once you find a link, attempt to combine all relevant entries for the multiple accounts into one account entity - all i can say about this latter approach is that i would do so with caution as there could be a formidable level of complexity depending on the user's activity level and the complexity of your database schema.
in my (mental/actual) namespace a user who registers the old-fashioned way has a 'standard' account and one who uses a social network has an 'alias' account. then the goal becomes to define where the alias is supposed to point, i.e. create the lookup such that a subsequent login via either means retrieves the relevant information for both accounts (with a preference for displaying personal data for the 'standard' account).
btw i figured out how to make twitter OAuth behave since my last post - you can look at my other answers for details if you're interested.
JB
hi matt,
i'm working on the same problem right
now.
assuming the user starts with regular
site account (which is not
necessarily safe to assume if he sees
all the pretty "connect with XXX
network" buttons!!!), you can use
either OAuth or the javascript APIs
(facebookConnect or #anywhere -
haven't fully figured out the latter
yet and i'm not sure I recommend it as
I don't think it provides as rich an
API as do the backend libraries) to
login to the other sites.
the APIs should return certain
information after a successful
login/redirect from the social network
- such as the user ID and an ACCESS TOKEN which you can then store in your
database in some capacity associating
your 'actual' application user with
the ID of the social network.
when the user returns to the site, you
can then
1 verify cookies set by the social
network services (various schemes
typically verifying a signature, based
on sha1 or md5 hash of your
application data - by which i mean the
data you get when you register your
app with twitter/facebook, typically a
consumer key, application ID, etc. -
with the received cookies) so you know
the user has logged in with the social
network
2 find your database entry association
as described above
3 login your user manually based on
the assumption that facebook/twitter
connection is secure.
caveat: this is only as secure as your
implementation (or as secure as
facebook/twitter's implementations, if
you prefer...)
although twitter's OAuth does not
currently seem to work quite right,
their general description of the
process is pretty informative:
http://dev.twitter.com/pages/auth
good luck.
J
I have been contemplating adding FB auth to our app, but we know that our returning users might click it and complete checkout for a new item, and then be surprised to not see any of their existing orders. To solve this, when a user clicks the 'Login with Facebook' item, we are using that click to fire a dropdown menu with two options:
[ Login with Facebook ]
[ Create new account ]
[ I have an account ]
If the user clicks 'I have an account' we send them to FB auth and return email from FB to our app. We compare that email to our existing users. If we match, we add the FB creds to the user. If no match, we throw an alert:
The email you have with FB does not match any of our accounts. To log in to your existing account, login with your email below, or update the email in your Facebook account
This allows the user to create a whole new account, if they want to keep them separate, without needing a new email service. While this is an edge case, it is a feature.