How to change the default spring social redirect page flow

Table of Contents

How to fix spring boot and spring social redirection to facebookConnected.html twitterConnected.html,linkedInconnected.html or googleConnected.html

How to fix spring boot and spring social redirection to facebookConnected.html twitterConnected.html,linkedInconnected.html or googleConnected.html

Introduction

Spring Boot when plugged with Spring social does provide a quick and easy way to log on to social providers and access the data quickly.

However, it does have lot of shortcomings too like

Supporting only single user sign per application
The Views are predefined so the user flow will be like
facebookConnect.html -> connect/facebookConnected.html and so on

While it is easy to change the initial view there is no clear documentation available which defines how to change the views.

Read Here: How to Fix Spring-Social Facebook one user per application problem.

To Replace facebookConnect.html

This bit is easy we just need to copy everything inside the form tag and place it in your login/home page.

All we are doing here is creating a form which posts to "/connect/facebook"

<form action="/connect/facebook" method="POST" style="display: inline">
			<input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}" /> <!-- csrf.token is Needed only if using spring security -->
			<input type="hidden" name="scope"
				value="public_profile,email" />
			<button type="submit" class="btn btn-primary">
				Facebook <span class="fa fa-facebook"></span>
			</button>
		</form>

<input type="hidden" name="scope"

value="public_profile,email" />

Facebook <span class="fa fa-facebook"></span>

</button>

</form>

When we submit the form the code goes to ConnectController class and does the OAuth dance and routes back to "/connect/facebookConnected.html"

To Replace connect/facebookConnected.html

AS mentioned in the previous step the Connect controller class does the OAuth auth behind the scenes and redirects back to "/connect/facebookConnected.html"
org.springframework.social.connect.web.ConnectController Class is an UI controller for managing the account-to-service-provider connection flow.

In this class, all the GET and Post methods have defined to handle the authentication flow

GET /connect/{providerId} – Get a web page showing connection status to {providerId}.
POST /connect/{providerId} – Initiate an connection with {providerId}.
GET /connect/{providerId}?oauth_verifier||code – Receive {providerId} authorization callback and establish the connection.
DELETE /connect/{providerId} – Disconnect from {providerId}.

Among all the methods you should see a connectedView method which returns the "/connect/facebookConnected.html"

protected String connectedView(String providerId) {
return getViewPath() + providerId + "Connected";
}

protected String connectedView(String providerId) {

return getViewPath() + providerId + "Connected";

}

All we need to do is to override this method

Create a CustomController

Create a class and call it CustomController make sure that it extends org.springframework.social.connect.web.ConnectController

Add the @Controller annotation at class level

Add the Constructor

public CustomController(ConnectionFactoryLocator connectionFactoryLocator,
ConnectionRepository connectionRepository) {
super(connectionFactoryLocator, connectionRepository);
}

public CustomController(ConnectionFactoryLocator connectionFactoryLocator,

ConnectionRepository connectionRepository) {

super(connectionFactoryLocator, connectionRepository);

}

Override the connectedView method

If you want web flow to be redirected to an another REST URL/Controller use something like

@Override
protected String connectedView(String providerId) {
return "redirect:/facebook";
}

@Override

protected String connectedView(String providerId) {

return "redirect:/facebook";

}

The above code will redirect to another REST controller where say data can be saved to DB and things like authentication can be done, something like below

@RequestMapping(value = "/facebook", method = RequestMethod.GET)
public String loginToFacebook(Model model) {
getFacebookUserData(model, new UserForm());
return "facebookPage"
}

@RequestMapping(value = "/facebook", method = RequestMethod.GET)

public String loginToFacebook(Model model) {

getFacebookUserData(model, new UserForm());

return "facebookPage"

}

If you want to show custom login/home page use something like

@Override
protected String connectedView(String providerId) {
return "home";
}

@Override

protected String connectedView(String providerId) {

return "home";

}

Complete Custom controller class looks like this

package com.nevado.controller;

import org.springframework.social.connect.ConnectionFactoryLocator;
import org.springframework.social.connect.ConnectionRepository;
import org.springframework.social.connect.web.ConnectController;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
@RequestMapping("/connect")
public class CustomController extends ConnectController {

	public CustomController(ConnectionFactoryLocator connectionFactoryLocator,
			ConnectionRepository connectionRepository) {
		super(connectionFactoryLocator, connectionRepository);
	}
	
	@Override
    protected String connectedView(String providerId) {
        return "redirect:/facebook";
    }

}