When developing a web, mobile app or a Smart TV app – login with Facebook is used for user authentication and conveniently capturing the user’s social information from Facebook itself.
This blog describes the steps to have a clear and consistent user experience for device login on a Smart TV.
Flow for Login With Facebook on Smart TV
Login with Facebook Action :
The step is to finalize an appropriate place for the Login button and where the user can connect to their Facebook profile. This can be done at the start of the application or can be also done at any later stages as per the requirements
The development team must ensure that the call-to-action button is easy-to-use, visually consistent as per the brand colours and closely look like an official Facebook Login button.
Display Activation Code
When the user clicks the call-to-action button, the device immediately calls the Facebook API which returns an activation code. In interface tell user to go to http://facebook.com/device via his/her desktop and smartphone and enter the displayed code.
The code that returns from Facebook Device Login API is between 6-12 characters long.
Once the code is displayed, the device starts to poll for the authorization using Facebook Device Login API to check if user has authorized the code or not. If the authorization is not complete the device shows an error message of code expired. Depending upon the case, the response is displayed on the screen for the user.
Authorization of the Code
When an user goes to link http://facebook.com/device from his/her desktop then they see the following screen where they see a text field to enter the displayed code on device and click on continue.
After clicking on continue user can choose the permissions they want to grant
If user completes the process then Facebook show them the successful login screen
As soon as user completes its login process for devices, Smart TV continues the polling from Facebook Device Login API, Once the code is authorized Smart TV gets the information and shows user confirmation message of login and ask user to continue.
Data of user can be fetched using Facebook Graph APIs.
Logout from Facebook Action
If user wants to logout from device then there should be an option to logout, When user click logout button then we should delete the access_token from Facebook. Device should not store the token and if we have stored the token in database or cloud then we should delete the same from that places.
There is no need to make any API call to invalidate the token.