spring security CSRF対策のログイン画面について

表題についてですが
spring securityの実装をしてセッションタイムアウトしたら
セッションタイムアウトしました。ログイン画面へ移動します。
というページを挟むことができました。

ここからが本題ですが、ログイン画面へ移動した後、
情報を入力、submitするとタイムアウト画面が表示されてしまいます。
ちなみにタイムアウト時間は5秒で設定しています。

自分で少し調べたら、CSRF対策のトークンをsessionに保管している
からこの現象が起きるらしいです
※https://qiita.com/opengl-8080/items/3720ed415c2df26251a7　参照

なのでログイン画面でトークンを取得してhidennで送る処理が必要らしいのですが
ajaxとかやったことないので全然わかりませんでした、またjspのカスタムタグを
用いたトークンの取得はネット上にあったのですが、thymeleafを用いたトークンを取得
するやり方が見つけきれませんでした。

まとめると
・thymeleaf+ajax(javascript)でトークンを取得する記述の仕方が知りたい
・取得したあとコントローラ(webのConfiger?)になにか追記する必要があるのか

上記二点についてよろしくお願いいたします。

追記
アドバイス参考に実装してみましたがうまくいきませんでした。
ボタン押下時にjsでトークンをhiddenにセットして一応ajaxsendでRequestHeaderにもトークンをセットしました。
デバッグして確かにトークンをセットしてるのを確認しましたが、
やはりタイムアウト後にログインするとセッションタイムアウトページに飛んじゃいます。
うーん。難しいずらね。

login.html
<meta name="_csrf_header" th:content="${_csrf.headerName}" />
<meta name="_csrf" th:content="${_csrf.token}" />

<input type="hidden" id="csrfToken" th:name="${_csrf.headerName}" />
<input type="button" id="loginButton" value="ログイン" />

login.js
//　ログイン時csrfトークン取得
$(function() {
	 $('#loginButton').on('click', function() {
		var headerName =$("meta[name='_csrf_header']").attr("content");
		var tokenValue =$("meta[name='_csrf']").attr("content");
		$(document).ajaxSend(function(e,xhr,options){
			xhr.setRequestHeader(headerName,tokenValue);
		});
		 $('#csrfToken').val(tokenValue);
         $('#form').submit();
	 });
});