Integrating SNS Login to Web

Basic Steps

1. User clicks a social login button
2. An on-click client side method calls corresponding SNS API
3. The SNS API confirms whether the requesting user is also a user of the SNS and returns a token
4. The token is relayed from the client side to the server side
5. Another SNS API is called from the server side, this time with the relayed token equipped in the request header
6. The SNS API returns user information, and the server side uses this information to either help the user log in or become a new member.
   • Examine your LoginInfo table with the returned information to check if there is a matching user account. If there is, produce a JWT and return the token to the client side.
   • If there is not matching user account, let the user register automatically
   • There will only be one SNS login endpoint that deals with both logging in and signing up
   • Create separate API endpoints for different SNS platforms, however. Doing this way simplifies unit tests and increases code readability.

If your web supports more than one SNS login

Create one more table to store various SNS platforms and let your login info table reference this platform table.
For example:

---

#id | type
1 | kakao
2 | google
3 | facebook

---

OAuth 2.0

Many social networking services adhere to OAuth protocol when providing access tokens for social login integration in websites.
OAuth 2.0 is the industry-standard protocl for authorization, which specifies several authorization grant types for different use cases. Some common OAuth grant types are: Authorization Code, Client Credentials, Device Code, and Refresh Tokens.

Facebook Social Login

To enable Facebook login, the server side must send requests to Facebook Graph API with a pre-determined format.
Depending on what you specify in the 'fields' part of the query string, the API will return the corresponding values.
For instance,

"https://graph.facebook.com/{your-user-id}
   ?fields=id,name, email
   &access_token={your-user-access-token}"

Here is what I wrote for my website.

Google Social Login

To integrate social login for most services, you must first create authorization credentials. In case of Google, click here.
To authenticate with a backend server, check out here. In essence you send the ID token you received from the client side to Google, and Google validates the token's integrity and returns the requested user information.