Spring Security ログイン成功リダイレクト うまくいかない

Question

ログイン画面で認証成功時にmainページへリダイレクトすることを考えていますが
今は以下に記載する動作をしてしまいます。

ログイン処理をなげてユーザー認証がうまくいきリダイレクト先もresponse headerに入っているのを
確認できていますが実際の画面表示がログイン画面のままで原因がいまいちわかりません。
リダイレクト先のリクエストも開発者ツールのネットワークを見る限り
mainページへ遷移するリクエストが投げられておりステータスコードが200で返ってきています。

(都度トークンは生成されるので問題ないと思いますが一応マーキングさせていただきます。)

以下に原因となりそうなSpring Securityの設定部分と成功時のハンドルを記載いたします。

セキュリティ設定部分

package com.ransu.lastperiodweb.webconfig;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.security.config.annotation.authentication.builders.AuthenticationManagerBuilder;
import org.springframework.security.config.annotation.web.builders.HttpSecurity;
import org.springframework.security.config.annotation.web.builders.WebSecurity;
import org.springframework.security.config.annotation.web.configuration.EnableWebSecurity;
import org.springframework.security.config.annotation.web.configuration.WebSecurityConfigurerAdapter;
import org.springframework.security.crypto.bcrypt.BCryptPasswordEncoder;
import org.springframework.security.crypto.password.PasswordEncoder;
import org.springframework.security.web.authentication.AuthenticationSuccessHandler;
import org.springframework.security.web.csrf.CookieCsrfTokenRepository;

import com.ransu.lastperiodcommon.service.imp.LoginServiceImp;
import com.ransu.lastperiodweb.security.handler.SuccessHandler;


@Configuration
@EnableWebSecurity
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {

	@Autowired
    LoginServiceImp loginService;

	@Override
	public void configure(WebSecurity web) throws Exception {
		web.ignoring().antMatchers("/css/**", "/js/**", "/webjars/**");
	}

	@Override
	protected void configure(HttpSecurity http) throws Exception {

		http.authorizeRequests()
			// ログインとアカウント作成ページを認証不要に
			.antMatchers("/loginPage").permitAll()
			.antMatchers("/createAccountPage").permitAll()
			.antMatchers("/createAccount").permitAll()

			// ユニットの一覧検索ページを認証不要に
			.antMatchers("/mainPage").permitAll()
			.antMatchers("/unitListPage").permitAll()
			.antMatchers("/getUnitDataList").permitAll()

			// その他はログインが必要
			.anyRequest().authenticated()

			.and()
			// トークンをcookieで持つように設定
			.csrf().csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse())

			.and()
			.formLogin()
			// ログイン処理をするURL
			.loginProcessingUrl("/login")
			// ログイン画面のURL
			.loginPage("/loginPage")
			.usernameParameter("mail")
			.passwordParameter("password")
			.successHandler(appAuthenticationSuccessHandler());
	}

	@Bean
	public AuthenticationSuccessHandler appAuthenticationSuccessHandler() {
		return new SuccessHandler();
	}

	@Bean
	public PasswordEncoder passwordEncoder() {
		return new BCryptPasswordEncoder();
	}

	@Autowired
	public void configureGlobal(AuthenticationManagerBuilder auth) throws Exception{
        auth.userDetailsService(loginService)
        	.passwordEncoder(passwordEncoder());
	}
}

認証成功時のハンドラ

package com.ransu.lastperiodweb.security.handler;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.security.core.Authentication;
import org.springframework.security.web.authentication.SimpleUrlAuthenticationSuccessHandler;
import org.springframework.stereotype.Component;

@Component
public class SuccessHandler extends SimpleUrlAuthenticationSuccessHandler{

	/**
	 * 認証成功時のハンドラ
	 */
	@Override
	protected void handle(HttpServletRequest request, HttpServletResponse response, Authentication authentication) throws IOException, ServletException {
		response.sendRedirect(request.getContextPath() + "/mainPage");
	}
}

リダイレクト先に設定している mainPage コントローラー部分

package com.ransu.lastperiodweb.controller.page;

import java.util.ArrayList;
import java.util.List;

import org.bson.types.ObjectId;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.servlet.ModelAndView;

import com.ransu.lastperiodcommon.dto.AbilityDTO;
import com.ransu.lastperiodcommon.dto.AttributeDTO;
import com.ransu.lastperiodcommon.dto.BoardDTO;
import com.ransu.lastperiodcommon.dto.ConditionDTO;
import com.ransu.lastperiodcommon.dto.RealmDTO;
import com.ransu.lastperiodcommon.dto.SexDTO;
import com.ransu.lastperiodcommon.dto.StatusDTO;
import com.ransu.lastperiodcommon.dto.TypeDTO;
import com.ransu.lastperiodcommon.dto.UnitDTO;
import com.ransu.lastperiodcommon.entity.AbilityEntity;
import com.ransu.lastperiodcommon.entity.AttributeEntity;
import com.ransu.lastperiodcommon.entity.BoardEntity;
import com.ransu.lastperiodcommon.entity.ConditionEntity;
import com.ransu.lastperiodcommon.entity.RealmEntity;
import com.ransu.lastperiodcommon.entity.SexEntity;
import com.ransu.lastperiodcommon.entity.StatusEntity;
import com.ransu.lastperiodcommon.entity.TypeEntity;
import com.ransu.lastperiodcommon.entity.UnitEntity;
import com.ransu.lastperiodcommon.service.AbilityService;
import com.ransu.lastperiodcommon.service.AttributeService;
import com.ransu.lastperiodcommon.service.BoardService;
import com.ransu.lastperiodcommon.service.ConditionService;
import com.ransu.lastperiodcommon.service.RealmService;
import com.ransu.lastperiodcommon.service.SexService;
import com.ransu.lastperiodcommon.service.StatusService;
import com.ransu.lastperiodcommon.service.TypeService;
import com.ransu.lastperiodcommon.service.UnitService;

@Controller
public class PageController {

	@Autowired
	private UnitService unitService;

	@Autowired
	private SexService sexService;

	@Autowired
	private RealmService realmService;

	@Autowired
	private TypeService typeService;

	@Autowired
	private StatusService statusService;

	@Autowired
	private AttributeService attributeService;

	@Autowired
	private AbilityService abilityService;

	@Autowired
	private BoardService boardService;

	@Autowired
	private ConditionService conditionService;

	@RequestMapping(value="/loginPage", method=RequestMethod.GET)
	public ModelAndView loginDisp(ModelAndView mav) {
		mav.setViewName("login");
		return mav;
	}

	@RequestMapping(value="/mainPage", method=RequestMethod.GET)
	public ModelAndView mainDisp(ModelAndView mav) {
		mav.setViewName("main");
		return mav;
	}
}

ログイン画面

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
	<head th:replace="common/header :: meta_header(${title},~{::link},~{::script})">
	</head>
	<body>
		<div id="content">

			<h1>{{label.title}}</h1>

			<el-form v-model="loginForm" label-width="200px">

				<el-form-item :label="label.mail" prop="mail">
					<el-input v-model="loginForm.mail"></el-input>
				</el-form-item>

				<el-form-item :label="label.password" prop="password">
					<el-input v-model="loginForm.password"></el-input>
				</el-form-item>

			</el-form>
			<el-button @click="login">{{label.loginBtn}}</el-button>
			<a th:href="@{/createAccountPage}">{{label.accountCreate}}</a>
		</div>
		<script type="application/javascript" th:inline="javascript">
			/*<![CDATA[*/
				new Vue({
					el:'#content',
					data: {
						loginForm: {},
						label: {
							title: 'ログイン画面',
							mail: 'メールアドレス',
							password: 'パスワード',
							loginBtn: 'ログイン',
							accountCreate: 'アカウントの新規作成'
						}
					},
					methods: {
						login() {

							set_csrftoken();

							let _this = this;
							$.ajax({
								type: 'POST',
								url: 'login',
								data: this.loginForm,
								dataType: 'json',
							}).then(function(result) {

							}, function () {
								_this.$message({
									type: 'error',
									message: '画面エラー'
								})
							})
						}
					}
				})
			/*]]>*/
		</script>
	</body>
</html>

Answer 1

通信にajax通信を使用しており、リダイレクトするなら
非同期通信は使うな！という結論になりました。

お騒がせしてすみません。