NixMash Spring Social Web Flow Overview, First Pass

NixMash Spring v0.2.8 includes Spring Social, supporting site registered user accounts as well as Facebook and Twitter. I will be getting into Spring Social on the back end, but I first wanted to describe the Web Flow on the UI side. I'm calling this a “first pass” at the UI, since things will no doubt change as we go forward to v0.2.9 and beyond. You can follow along on the NixMash Spring Demo Site if you wish.

Account Creation

Users can create site accounts as before with Spring Security using the Site Registration Form. They can also use Facebook and Twitter to create a Site Account with Spring Social. If a Site User Account does not yet exist for the new user they will be returned to a Sign-Up Page (a scaled-down version of the registration form), where their Social Account from Facebook or Twitter will be integrated with a newly created Site Account.

Site Login

Once registered on the site through a Social Service, users will click on their respective “Sign-in with Facebook/Twitter” button. If the user created a conventional site account with the Site Registration Form they will login with their username and password.

Social Service Sign-In Buttons

Below is the Home Page with the new Social Sign-In buttons. The buttons also appear on the Login page.

Initial Social Service Sign-Up Page

We've authenticated the user through Facebook or Twitter with the user data provided by the OAuth Service Provider stored in a Spring Social datatable called UserConnection. We need to associate the user with a site account so we'll do that with a simple SignUp form. This provides the data we need to fully authenticate the user on the site, populating the usual datatables and assigning the appropriate roles.

User Authenticated and Logged-In

As you can see in the Navigation Bar top right, Twitter Burke is now logged-in.

Authentication Confirmed!

It's important to know that any user authenticated with a Social Service like Facebook is fully authenticated locally, with full permissions and all data characteristics of conventional user accounts. That's one of the things we'll be looking at in future posts.

Logins

The Login Page contains the Social Service buttons that users with Facebook or Twitter authentication will use for one-click login. Registered users will enter their username and password.

We'll cover the behind-the-scenes of Spring Social in future posts.

Source Code Notes for this Post

All source code discussed in this post can be found in my NixMash Spring GitHub repo and viewed online here.

Posted March 08, 2016 03:42 PM EST

More Like This Post